3 fonctions indispensables pour WordPress

7

Amis Blogueurs… si comme moi vous utilisez WordPress pour gérer votre Blog, je pense que cet article pourrait vous intéresser. Toutes les fonctions ci-dessous, je les utilise sur tous mes sites WordPress. Bien évidemment, je pourrai utiliser des Extensions pour obtenir le même résultat… mais comme vous allez le voir, ces quelques lignes de code sont vraiment très faciles à mettre en place.

Toutes ces lignes sont à insérer dans un seul et même fichier nommé function.php de votre thème WordPress. Je vous conseille tout de même de faire un copie de sauvegarde avant, car un mauvais copier/coller et votre site sera Hors Service… donc prudence.

Ajout d’une Image à la Une automatique dans WordPress

Comme vous le savez certainement, de nombreux thèmes utilisent l’Image à la Une pour mettre une image en avant dans un slider, en miniature dans la page principale, article relatif, etc. Bref, l’Image à la Une est devenue indispensable… et personnellement, 1 fois sur 2 j’oublie de mettre cette image.

wordpress-Image-a-la-uneAvec le code ci-dessous, une Image à la Une est mise automatiquement dès que vous appuyez sur le bouton Enregistrer, Planifier, Publier. Par défaut, c’est la première image insérée dans votre article qui sera à la Une.

function image_une_auto() {
   global $post;
   $already_has_thumb = has_post_thumbnail($post->ID);
   if (!$already_has_thumb)  {
      $attached_image = get_children( "post_parent=$post->ID&post_type=attachment&post_mime_type=image&numberposts=1" );
      if ($attached_image) {
         foreach ($attached_image as $attachment_id => $attachment) {
            set_post_thumbnail($post->ID, $attachment_id);
         }
      }
   }
}
add_action('the_post', 'image_une_auto');
add_action('save_post', 'image_une_auto');
add_action('draft_to_publish', 'image_une_auto');
add_action('new_to_publish', 'image_une_auto');
add_action('pending_to_publish', 'image_une_auto');
add_action('future_to_publish', 'image_une_auto');

Supprimer les variables des fichiers JavaScript et CSS

Lorsqu’une déclaration de fichier est faite via wp_register_script/style, le lien vers celui-ci contient une variable (exemple : &ver=3.9.2 ou autre chose du même style) :p Voici un code très simple pour retirer cette mention qui semble ne pas plaire à Google (Remove query strings from static resources) pour des raisons de mise en cache des pages… ce que l’on peut comprendre.

source-code-version

function retire_ver_cssjs( $src ) {
   if( strpos( $src, '?ver=' ) )
   $src = remove_query_arg( 'ver', $src );
   return $src;
}
add_filter( 'style_loader_src', 'retire_ver_cssjs', 10, 2 );
add_filter( 'script_loader_src', 'retire_ver_cssjs', 10, 2 );

Éliminer les codes JavaScript et CSS qui bloquent l’affichage du contenu au-dessus de la ligne de flottaison

Ce message, vous avez dû l’avoir si vous avez testé votre site avec l’outil PageSpeed Insights.

Pour les fichiers CSS, qui n’impacte pas votre affichage directement… vous pouvez les mettre  après la balise </html>. Oui, oui… après celle-ci. Le gain n’est pas énorme, mais chaque milliseconde à son importance compte.

Pour les fichiers JS, il est possible d’ajouter defer. Exemple : <script src= »mon.js » defer></script> ou <script src= »mon.js » defer=’defer’></script>Sauf que les JS de votre thème ou de WordPress ne sont pas toujours facile à modifier. Voici le petit bout de code afin ajouter defer à tous vos fichiers JS de votre thème ou WordPress.

function ajout_defer( $url ) {
   if ( FALSE === strpos( $url, '.js' ) ) {
    return $url; // Ce n'est pas notre fichier
   }
   return "$url' defer='defer";
}
add_filter( 'clean_url', 'ajout_defer', 11, 1 );

 

Voilà, c’est terminé pour aujourd’hui… J’espère que cela vous servira. Personnellement, ça me fait un aide-mémoire.

Et vous, quelles astuces utilisez-vous dans WordPress ?

Partager.

A propos de l'auteur

Passionné de nouvelles technologies, je suis un touche-à-tout. Mon smartphone ne me quitte (presque) jamais. Je peux vous parler des NAS pendant des heures.

  • Haeowyn

    Bonjour, j’aimerai ajouter le code defer pour JS. J’ai trouvé le fichier function.php mais je ne sais pas ou copier le code dans le fichier. Merci de votre aide.

    • Joh

      En dessous de < ?php à priori ? :)

    • Y’a Bmz

      mets le à la fin de function.php, si il t’arrive un soucis tu sauras ou le code se situe exactement 😉

  • bob

    Bonjour
    très intéressant ton article.
    Je voudrais savoir comment fais-tu pour mettre les css après la balise . Car les pages sont générées automatiquement.

    Merci à toi de ta réponse

  • Péniche Soleiado

    j’essaye de comprendre et d’appliquer l’histoire du blocage de ligne de flottaison, mais c’est très dur pour un néophyte. si il ya des tutos ou des articles plus détaillé je suis preneur

  • Rémi Rostan

    Bonjour,

    Merci pour ces conseils !

    Concernant le code (Supprimer les variables des fichiers JavaScript et CSS) il n’a pas l’air de faire l’effet escompter, lors du Page Speed, je retrouve toujours les variables.

    Une solution ?

    Merci de votre article 😉

Lire les articles précédents :
Edito du 12 août

Salut les Geeks, J'espère que vous allez bien et que vous profitez bien de ce joli mois d'août. Oui, je...

Fermer