Aujourd'hui nous allons aborder comment, dans Joomla 3, il est possible dans les résultats de la recherche classique, d'intégrer l'image associée à article que vous avez créé.
Comme nous ne voulons pas modifier les fichiers d'origine fournies par Joomla, dans un premier temps, faisons un héritage du composant com_search via l'outil des templates de Joomla.
Lorsque votre héritage est fait, il se retrouve dans un sous dossier de votre template, portant le même nom, com_search, mais cette fois-ci dans le répertoire de votre template par défaut. Vous retrouverez donc dans ce répertoire l'ensemble des fichiers qui sont d'origine fournies avec le composant de recherche.
Avec votre éditeur de texte favoris, ouvrez le fichier default_results.php et rendez-vous autour de la ligne 20. Vous retrouverez à cet endroit une ligne <a href=....
Placez-vous sous cette ligne, et intégrer le code indiqué lignes 27 à 35 de ma copie d'écran, qui va récupérer dans un premier temps l'article courant au travers de l'objet $article.
Cet article est en stocké dans un objet éponyme ligne 27, vous pourrez ensuite récupérer l'identifiant de cet article, ainsi que son slug afin de pouvoir en extraire l'ensemble des images qui lui sont associés.
Ces images sont récupérées dans un tableau images (ligne 28), au travers de la fonction Json_decode dans le but est de convertir une chaîne de caractère du format JSON en objet.
Dans cet objet, vous allez pouvoir extraire l'ensemble des images au travers de la propriété $article->images qui va vous retourner un objet. Dans cet objet, nous avons extraire l'image d'introduction (d'où $images->image_intro), image dans laquelle vous allez pouvoir placer, au moment de l'édition de vos articles, une image liée à votre article. Cette propriété est une propriété de base de Joomla (voir ma première capture d'écran).
Afin d'afficher votre image, puisque nous sommes dans le fichier de présentation, vous n'avez plus qu'à "entourer" cette propriété du tag HTML vous permettant d'afficher une image.
echo '<img src="'.$images->image_intro.'">';
Et voilà le résultat est déjà terminé. Je n'ai pas ici appliqué de class CSS pour la mise en forme des résultats de recherche mais je ne peux que vous encourager à le faire. Sous Protostar, vous pouvez stocker le style dans le fichier custom.css de votre template
Mais nous n'allons pas en rester là, car peut être voudriez vous récupérer d'autres informations. Comme vous pouve le voir en commentaires verts sur ma copie d'écran, vous pouvez retourner dans un but de debugg, l'ensemble de l'objet image via un print_r car peu être êtes-vous interessé pour travailler avec l'une au l'autre des propriétés retournées suivantes :
-
stdClass Object ( [image_intro] => images/tortue/matortue.jpg [float_intro] => [image_intro_alt] => [image_intro_caption] => [image_fulltext] => [float_fulltext] => [image_fulltext_alt] => [image_fulltext_caption] => )
Il ne vous reste plus qu'à retoucher la mise en page comme bon vous semble.