Système de recherche par mot-clé
Publié le
Ajout d'un lien sur un mot-clé
Maintenant que nous avons listé nos mots-clés, ajoutons sur chacun d'entre eux un lien permettant de trier les articles.
Par exemple, si l'on clique sur le mot-clé "thelia", nous n'afficherons que les contenus associés à ce mot-clé. Pour ce faire, nous allons réutiliser la page de recherche fournie avec Thelia.
Tout d'abord, ajoutons notre lien autour du mot-clé :
{ifloop rel="tags"}
<ul class="tags" role="list">
{loop name="tag-group" type="keyword_group" keyword_group="tags"}
{loop name="tags" type="keyword" keyword_group="$ID" content="$contentId"}
<li itemprop="keywords">
<a href="{url path='/search' keyword='{$CODE}'}" title="{$TITLE}">{$TITLE}</a>
</li>
{/loop}
{/loop}
</ul>
{/ifloop}
Ici, le lien que nous créons via la fonction {url} nous permet de spécifier que nous voulons utiliser la route (l'url) /search en y ajoutant un argument keyword qui aura pour valeur le code du mot-clé que l'on récupère grâce à la variable {$CODE}.
Si vous tentez d'accéder à la page de recherche grâce à vos mots-clés, aucun contenu ne ressortira de la recherche. Pas d'inquiétude c'est tout à fait normal ! La boucle présente dans le template search.html ne fait que lister des produits dont le titre correspond à {$smarty.get.q} qui n'est en fait que la manière de récupérer l'argument q (argument $_GET) présent dans l'url lors d'une recherche.
Je vous propose ici, de laisser le code qui permet de rechercher un produit via le moteur de recherche, mais de l'inclure dans une condition afin de ne pas effectuer la boucle product si on a effectué une recherche par mot-clé.
Détection du type de recherche
D'après le lien que nous avons créé, si l'argument keyword est présent dans l'url, alors nous venons d'une recherche par mot-clé. Par contre, s'il n'existe pas ou que l'argument q est présent, il s'agit d'une recherche effectuée via le moteur de recherche de Thelia.
Mettons notre condition en place :
<div class="main">
{$limit={$smarty.get.limit|default:8}}
{$product_page={$smarty.get.page|default:1}}
{$product_order={$smarty.get.order|default:'alpha'}}
{if !$smarty.get.keyword} {* Si l'argument keyword n'est pas trouvé *}
<article class="col-main {$smarty.get.mode|default:"grid"}" role="main" aria-labelledby="main-label">
<h1 id="main-label" class="page-header">{intl l="Search Result for"} <small>{$smarty.get.q}</small></h1>
{assign var="amount" value="{count type="product" title="{$smarty.get.q}"}"}
{include file="includes/toolbar.html" toolbar="top" limit=$limit order=$product_order amount={$amount}}
<div id="category-products">
<div class="products-content">
{ifloop rel="product_list"}
<ul class="product-col-3">
{loop type="product" name="product_list" title="{$smarty.get.q}" limit=$limit page=$product_page order=$product_order}
{include file="includes/single-product.html" product_id=$ID hasBtn=true hasDescription=true width="369" height="247"}
{/loop}
</ul>
{/ifloop}
{elseloop rel="product_list"}
<h2 class="text-center">{intl l="No results found"} </h2>
{/elseloop}
</div>
</div><!-- /#category-products -->
{ifloop rel="product_list"}
{include file="includes/toolbar.html" toolbar="bottom" amount={$amount}}
{/ifloop}
</article>
{else}
{* NOTRE NOUVEAU CODE ICI *}
{/if}
</div><!-- /.layout -->
{/block}
À ce stade, si vous cliquez sur un mot-clé, la boucle product ne s'exécutera plus. Passons donc à la mise en place de notre nouvelle boucle.
Recherche des contenus associés au mot-clé
Nous allons utiliser la boucle keyword_content pour lister les contenus associés au code du mot-clé contenu dans l'argument keyword.
Voici le code à mettre en place :
<article role="article" itemscope itemtype="http://schema.org/Article">
<meta itemprop="datePublished" content="{format_date date=$CREATE_DATE}">
<meta itemprop="dateModified" content="{format_date date=$UPDATE_DATE}">
<meta itemprop="url" content="{$URL}">
<h2 itemprop="name"><a href="{$URL}">{$TITLE}</a></h2>
<hr>
{if $CHAPO}
<p itemprop="text">{$CHAPO|strip_tags|truncate:250 nofilter}</p>
{else}
<p itemprop="text">{$DESCRIPTION|strip_tags|truncate:250 nofilter}</p>
{/if}
</article>
{/loop}
Et voilà c'est fini !
C'est bien entendu une boucle et un affichage très basique alors n'hésitez pas à utiliser votre propre structure HTML. Il faut bien que je vous laisse travailler un peu seul ;-)
J'espère que vous avez apprécié ce tutoriel qui donnera sûrement suite à d'autres explications sur l'utilisation du module Keyword car c'est un module avec lequel beaucoup de choses sont possibles, n'hésitez pas à me poser vos questions sur les comptes Twitter ou Facebook du site !
Allez plus loin
Si à ce stade vous effectuez une recherche sur un mot-clé associé à 50 articles, vous allez vous apercevoir que la liste affichée est assez longue.
En effet, nous n'avons pas utilisé les critères de tri présents sur la boucle product à savoir : limit, page et order.
Il ne vous reste qu'à les utiliser sur votre nouvelle boucle et hop la pagination prendra aussi en compte votre recherche par mot-clé !
Ajouter votre commentaire
Les commentaires