Jeudi 12 février 2009 4 12 /02 /2009 09:08
Encore un tuto de super Gee Mee ;-) La note d'origine est à lire ici


Hautetfort ne donne que l'auteur du commentaire et le titre de la note concernée. Nous ne sommes pas obligés de nous en contenter.


Le code du module « Commentaires récents »

{comments assign="comment" lastn="10" posts="posts"} {if $comment.first}<div id="box-recentcomments" class="box-decorator1"><div class="box-decorator2"><div class="box-decorator3"> <div class="decorator1"><div class="decorator2"><h2>{t}Recent comments{/t}</h2></div></div> <div class="boxcontent-decorator1"><div class="boxcontent-decorator2"><div class="boxcontent-decorator3"> <ul>{/if} <li><a href="{$comment.permalink}#c{$comment.id}">{$comment.authorname|truncate:50:"..."}</a> {t}on{/t} <a href="{$comment.permalink}">{$comment.post|truncate:50:"..."}</a></li> {if $comment.last}</ul> </div></div></div> </div></div></div>{/if} {/comments}

Comme pour le module "Dernières notes", on retrouve :
la mention lastn="10" pour demander au moteur de servir les dix derniers commentaires.
{t}Recent comments{/t}, une mention de texte par défaut en anglais pour que s'affiche « commentaires récents »
{$comment.post|truncate:50:"..."} l'instruction de troncature

Comme c'est déjà le cas dans ce blog, nous allons renommer le module, limiter les commentaires affichés au nombre de 5, et afficher le début du commentaire. Schématiquement cela donne

[nom du module] :
[titre de la note], [auteur du commentaire] a dit : « [début du commentaire] »

Dans un premier temps le code devient :
<!-- Commentaires >> -->
{comments assign="comment" lastn="5" posts="posts"} {if $comment.first}
<div id="box-recentcomments" class="box-decorator1">
<div class="box-decorator2"><div class="box-decorator3">
<div class="decorator1"><div class="decorator2">
<h2>{t}<!--Recent comments--> &Agrave; propos de :{/t}</h2>
</div></div> <div class="boxcontent-decorator1">
<div class="boxcontent-decorator2"><div class="boxcontent-decorator3">
<ul>{/if} <li>
<i><a href="{$comment.permalink}">"{$comment.post|truncate:50:"..."}"</a></i>,&nbsp;
<a href="{$comment.permalink}#c{$comment.id}">{$comment.authorname|truncate:50:"..."}
&nbsp;a dit :&nbsp;
<i>"{$comment.source|truncate:50:"..."}"</i></a>
</li> {if $comment.last}</ul>
</div></div></div> </div></div></div>{/if} {/comments}
<!-- << Commentaires -->

On remarque le nombre de commentaires affichés limité à 5, le changement de nom de module, qui devient « À propos », et l'ordre d'affichage des variables. Le titre de la note commentée {$comment.post} mis en italique entre guillemets, la ponctuation, le nom de l'auteur {$comment.authorname} du commentaire, la mention « a dit : » et le texte tronqué du commentaire {comment.source} en italique entre guillemets.
Et comment je sais d'abord que c'est {$comment.source} qui ramène le contenu du commentaire ? Et bien l'analyse appliquée du template de la page de commentaire, que vous auriez pu faire vous-même.

J'aurai pu arrêter là, mais toutes ces troncatures me gênent. J'aurai pu attribuer plus d'espace en augmentant le nombre de caractères, mais le template ne s'y prête guère. J'ai donc décidé d'utiliser la possibilité de créer des « info-bulles » dynamiques en utilisant le titre d'un lien hypertexte.

Pour finir le code devient :
<!-- Commentaires >> -->
{comments assign="comment" lastn="5" posts="posts"} {if $comment.first}<div id="box-recentcomments" class="box-decorator1"><div class="box-decorator2"><div class="box-decorator3"> <div class="decorator1"><div class="decorator2"><h2>{t}<!--Recent comments--> &Agrave; propos de :{/t}</h2></div></div> <div class="boxcontent-decorator1"><div class="boxcontent-decorator2"><div class="boxcontent-decorator3"> <ul>{/if} <li>
<i><a href="{$comment.permalink}" title="{$comment.post}">"{$comment.post|truncate:50:"..."}"</a></i>,&nbsp;
<a href="{$comment.permalink}#c{$comment.id}" title="{$comment.source|truncate:150:"..."}">{$comment.authorname|truncate:50:"..."}
&nbsp;a dit :&nbsp;
<i>"{$comment.source|truncate:50:"..."}"</i></a>
</li> {if $comment.last}</ul>
</div></div></div> </div></div></div>{/if} {/comments}
<!-- << Commentaires -->


Cette fois-ci, le titre de la note n'est plus tronqué dans l'info-bulle affichée au survol du lien, et la troncature du texte du commentaire est repoussée au 140ème caractère (même si c'est écrit 150, je vous l'ai déjà dit, soyez un peu à ce que vous faîtes quand même ;-).


Voilà le résultat obtenu :

Par Lavande - Publié dans : Haut et fort - Ecrire un commentaire - Voir les 1 commentaires
Retour à l'accueil



Je le fais pour vous !


Passer en mode avancé, installer un menu, migrer votre blog, créer un blog wordpress, besoin d'une bannière, relooker votre blog... Vous avez besoin d'aide ?
Je le fais pour vous ! Contactez moi, j'établierai un devis ! Pour un premier contact, clic ici.
@ tout de suite !

Coup de pouce pour

Very Nice Blog logo de participation

Comboost qui met à disposition des bloggeurs ses supers diaporamas !


 

Je sais aussi cuisiner...

Visitez mon autre blog !


Achetez mon livre !

Boutonlivre01

Installez le logo!

Parce que peut être vous avez trouvé votre bonheur sur blogtuto et que vous avez envie de le faire savoir, un petit lien ou une petite image sur votre blog, ça me fait drôlement plaisir quand je passe chez vous et que je reconnais mes codes... Alors pensez-y !

bouton_blogtuto

 




Bookmark and Share
http://www.wikio.fr
J'invite aussi les bloggeurs Haut et fort à ajouter le logo de Gee Mee, contributeur actif pour leur plateforme !

Personnalisez votre blog avec Gee Mee

Recherche

Comptons !

Compteur de visiteurs en lignes Nethique.info Il y a  8  personne(s) sur ce blog

Syndication

  • Flux RSS des articles
 
Contact - C.G.U. - Rémunération en droits d'auteur - Signaler un abus - Articles les plus commentés