Le Blog de Linuxine

The Eye of the Tiger

Je voulais intituler ce billet "comment casser son serveur en une étape simple" mais c'était un peu long comme titre, et un peu négatif aussi. Maintenant que le pire est dernière moi, je peux me concentrer sur le positif !

Alors pourquoi ce titre, me direz-vous ? Parce nous allons parler du passage de mon serveur sous l'OS Rocky Linux ! :D

Lire la suite

Migration de serveur

Cela fait maintenant presque 9 ans que j'ai mon serveur Dédibox chez Online. Installé initialement en CentOS 6, je l'avais manuellement updgradé en CentOS 7, ce qui est déconseillé en production (et à raison, vu que ça avait carrément cassé la partition de boot, c'était un peu risqué). Mais depuis la sortie de CentOS 8, je m'étais dit qu'il était temps de passer sur une machine et un OS plus récents. Hélas, entre temps les offres Online intéressantes pour les particuliers se sont grandement réduites. En gros, pour avoir une configuration équivalente, il aurait fallu que je paye le double du loyer de mon serveur actuel, passant de 36€ par mois à 72€... Avec 100€ de frais d'installation, en plus !

Après avoir demandé conseil à mes experts IT préférés, j'ai donc trouvé un serveur "en soldes" chez Hetzner, un fournisseur allemand. Ils proposent des serveurs "de seconde main", c'est à dire pas tous neufs, mais avec des bonnes spécifications, et surtout, pour un prix très intéressant : j'ai trouvé mieux à tout point de vue pour 32€ par mois seulement, et sans aucun frais d'installation !

Lire la suite

Customisation de Wordpress

Wordpress offre une API permettant d'ajouter facilement des boutons dans l'éditeur, la Quicktags_API.

Il est donc facile de rajouter un bouton avec un appel du type :

QTags.addButton( id, display, arg1, arg2, access_key, title, priority, instance );

On peut ajouter dans le fichier functions.php du thème des appels de fonction du type (exemple avec un ajout de bouton pour le plugin Piwigo :

// Add Quicktags
function piwitag() {
  if ( wp_script_is( 'quicktags' ) ) {
  ?>
  <script type="text/javascript">
  QTags.addButton( 'piwitag', 'Piwitag', '[PiwigoPress id=xxx url="PIWIGO_URL" size="me" class="img-shadow"]', '', 'Piwitag', '', 'piwitag',  );
  </script>
  <?php
 }
}
add_action( 'admin_print_footer_scripts', 'piwitag' );

J'en profite pour noter la fonction pour déclencher une commande à la publication d'un post (dans mon cas, publication sur une room Matrix):

function published_send_notif( $post_id ){

 // If this is just a revision, don't send the email.
 if ( wp_is_post_revision( $post_id ) )
         return;
 //if( get_post( $post_id ) == null ) {
 $post_title = get_the_title( $post_id );
 $post_url = get_permalink( $post_id );
 $subject = 'Nouveau post';

 $message = "Nouveau post:/n /n";
 $message .= $post_title . ": " . $post_url;

 // Send notification in Matrix room.
 $command = "";
 exec(escapeshellcmd($command) . " " . escapeshellarg($post_title) . " " . escapeshellarg($post_url));
 // }
}
add_action( 'publish_post', 'published_send_notif' );

 

Rendre un thème Wordpress responsive

Pour qu'un thème Wordpress soit responsive, il faut éviter que les tailles ne soit définies en dur : au lieu de :

#content{
    width:700px;
}

préferer :

#content{
    max-width: 700px;
    width: 100%;
}

On peut également inclure des requêtes média, pour modifier l'affichage selon la taille de l'écran. Exemple pour blog.linuxine.net :

/*Responsive media queries*/
@media screen and ( max-width: 800px ) {
    #header {
        width: 100%;
     }

    #logos {
        clear: both;
        display: block;
        float: left;
        margin-left: 20px
        width: 100%;
    }
    #social_icons {
        display:none;
    }    
    #content {
        clear: both;
        display: block;
        width: 100%;
    }
    #sidebar{
        display:none;
    }
}

/! Ne pas oublier d'inclure dans le header

Sinon les media queries ne sont pas executées ; le initial-scale est indispensable pour un affichage correct sous Opera mobile.

Mémo sur les xpath

Lien contenant une classe :

//a[@class='classe_exacte']
//a[contains(@class,'select2-choice')]

Div contenant du texte :

//div[text()="Collection"]
//div[contains(text(),'collection')]

Classe et texte :

xpath="//div[@class='alert alert-danger alert-dismissable']/ul/li[contains(text(),'collection: collection is required')]

Trouver une balise :

//*[local-name='circle']

Trouver le parent :

//div[@id=1]/parent::*

Deux conditions combinées, pour trouver ce lien :

 A 
//a[@data-event='scenario:view' and contains(text(),'A')]

Le 3e td apres ce lui, qui contient le texte "editing"

//td/a[@data-event='scenario:view' and contains(text(),'A')]/../following-sibling::td[3][contains(text(),'Editing')]