Atahualpa : affichez vos extraits d’articles avec des miniatures

Atahualpa WordPres ThemeAtahualpa est l’un des thèmes WordPress (WP) les plus populaires du moment, à en juger par le nombre de téléchargements dans le Themes Directory : plus de 9000 à ce jour. Le thème est passé à sa version 3.4.2 bien que le répertoire WP ne soit pas encore actualisé.

Cet article s’adresse à ceux qui connaissent déjà un minimum ce thème : en bref, il est bourré de fonctionnalités et d’options que vous pouvez configurer directement depuis votre interface d’administration.

Il en offre plus, beaucoup plus, que d’autres thèmes qui sont eux payants. Mais il n’offre pas tout. Une fois installé, votre site ressemble à ça. A vous ensuite de le personnaliser. Nous allons voir comment afficher vos billets (vos articles) sous forme d’extraits avec une photo en miniature.

Une solution toute simple est celle donnée par le site Protuts. Nous allons opter pour plus de souplesse en adoptant le plugin Get The Image qui permet d’afficher la miniature via un champ personnalisé ou bien en allant la chercher dans l’article parmi les images attachées.

L’installation du plugin est simplissime :

  1. Installer le plugin sur votre site via FTP ou par l’interface d’administration WP.
  2. L’activer en allant sur la page où figurent les extensions installées.
  3. Ajouter à l’endroit voulu de votre thème le code ci-dessous.

1
<?php get_the_image(); ?>

Le fichier readme.html fourni avec le plugin donne des instructions détaillées pour ajouter des paramètres à ce code. On retrouve ce guide sur le site de l’auteur.

Pour le thème Atahualpa (à partir de la v3.4+) il faut ajouter ce code dans le fichier functions/bfa_post_parts.php vers la ligne 172. A la place de :

1
2
3
else {
the_excerpt()
}

Vous devez avoir :

1
2
3
4
else {
get_the_image(); // Ajoute le plugin de Justin Tadlock
the_excerpt()
}

L’image miniature est donc ajoutée dans votre article, soit par l’intermédiaire d’un champ personnalisé soit en reprenant automatiquement la première image contenue dans l’article (voir liens précédents).

Pour pouvoir contrôler la longueur exacte de cet extrait et lui ajouter un lien du type « Lire la suite », nous allons utiliser la fonction the_content_limit() qui va venir remplacer the_excerpt() dans le même fichier.

Vous aurez donc ainsi :

1
2
3
4
else {
get_the_image(); // Ajoute le plugin de Justin Tadlock
the_content_limit(550, "Lire la suite du billet"); // Remplace the_excerpt()
}

Vous voyez deux paramètres que vous pouvez modifier dans cette fonction :

  • 550 : l’extrait est constitué des 550 premiers caractères de l’article
  • « Lire le suite » : c’est le texte qui s’affiche et renvoie vers l’article complet

Pour utliser cette fonction il nous faut toutefois l’intégrer au fichier functions.php de votre thème Atahualpa. Pour cela, par exemple à la fin juste avant la balise ?> vous allez ajouter le code suivant :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
// Modif perso : limite la longueur des billets avec the_content_limit(1000, "Suite &raquo;")
function the_content_limit($max_char, $more_link_text = '(Lire la suite du billet)', $stripteaser = 0, $more_file = '') {
     $content = get_the_content($more_link_text, $stripteaser, $more_file);
     $content = apply_filters('the_content', $content);
     $content = str_replace(']]>', ']]>', $content);
     $content = strip_tags($content);
 
    if (strlen($_GET['p']) > 0) {
       echo $content;
       echo "<br><br><a href='";
       the_permalink();
       echo "'>"."Lire la suite du billet</a>";
    }
    else if ((strlen($content)>$max_char) && ($espacio = strpos($content, " ", $max_char ))) {
         $content = substr($content, 0, $espacio);
         $content = $content;
         echo $content;
         echo "...";
         echo "<br><br><a href='";
         the_permalink();
         echo "'>".$more_link_text."</a>";
      }
    else {
       echo $content;
       echo "<a href='";
       the_permalink();
       echo "'>"."Lire la suite du billet</a>";
    }
}

Les paramètres peuvent être modifiés pour s’adapter à votre thème. Le code de base figure ici.

Pour peaufiner tout ça, il reste bien sûr à styliser dans le fichier style.css du thème l’apparence de vos miniatures, les aligner à droite ou à gauche, à telle ou telle distance de l’extrait, etc. Le thème Atahualpa permet de faire cela en saisisant le code CSS via l’interface d’administration du thème. Menu « Apparence » puis « Atahualpa Theme Options » et enfin le bouton « Add HTML/CSS Inserts » pour afficher la page de paramètres. Dans le dernier bloc nommé CSS Inserts, j’ai pour mon site entré le code suivant :

1
img.thumbnail { float:left; width:110px; height:110px; margin:0 5px 10px 0; }

Pour d’autre thèmes que Atahualpa ce code peut être intégré simplement à la feuille de style.

Et voici au final un exemple de ce que vous pouvez obtenir : http://chabada.free.fr/. Sur ce site le plugin Get The Image permet aussi d’afficher dans le pied de page (le footer) les miniatures et les extraits par l’intermédiaire du plugin Query Poste, inventé aussi par Justin Tadlock.

Certains plugins permettent d’afficher des miniatures sans permettre toutefois tout à fait la même chose : par exemple Thumbnail for Excerpts. Faites-nous part de vos solutions si vous en connaissez d’autres ! ^_^

Et quel est le rapport avec le poisson ? C’est un Apistogramma atahualpa.

Apistogramma atahualpa


Partager cet article :
  • Facebook
  • Twitter
  • LinkedIn
  • Viadeo
  • MySpace
  • FriendFeed
  • Digg
  • del.icio.us
  • StumbleUpon
  • Technorati
  • Scoopeo
  • blogmarks
  • Wikio
  • Yahoo! Bookmarks
  • Drigg-France
  • Fuzz
  • MisterWong Fr
  • Tapemoi

A propos de l'auteur

Fabien

Après une formation commerciale et 8 ans passés dans la vente, il reprend des études dans le domaines des ressources humaines pour travailler dans la formation professionnelle et le recrutement en tant que Consultant et Conseiller RH. En parallèle, il prend pendant 9 ans des cours de chant lyrique et participe régulièrement à des spectacles et à des concerts en tant que choriste et soliste.

2 Réponses à “Atahualpa : affichez vos extraits d’articles avec des miniatures”


  1. Fabien je comprends que vous etes un specialiste Je suis une novice et je viens de decouvrir ce theme
    deux questions comment puis je colorer mes mots cles comme le site chabada et d’autre part je veux en barre den haut a page introduire des sous pages comme dans le site chabada avec liens ou s ouvre une liste
    Merci

  2. Bonjour Katy,

    Je ne suis qu’un simple amateur 8-)

    Le nuage de tags coloré n’a rien à voir avec le thème Atahualpa : il fait partie du plugin SimpleTags. Et le menu déroulant avec des sous-pages est une fonction de base de WordPress : il suffit de rattacher une page à une « page parente ». Je vous conseille de consulter la documentation consacrée à WordPress pour en connaître davantage sur le sujet.

    Meilleures salutations.


Laisser un commentaire