Ok

En poursuivant votre navigation sur ce site, vous acceptez l'utilisation de cookies. Ces derniers assurent le bon fonctionnement de nos services. En savoir plus.

08.02.2010

Afficher le début d'une note en sachant couper, et pointer vers une ancre pour « Lire la suite... »

[MAJ] Nous avons déjà vu comment modifier le modèle de la page d'accueil pour n'afficher que le début des notes. Le mécanisme que je vous ai proposé souffre d'un défaut de "conception", et je tente ici d'en limiter les effets.

La méthode1, dont vous retrouverez le détail dans cette note, tronque la note. J'ai d'abord cru que cette troncature s'appliquait au texte, avant de comprendre qu'elle s'appliquait au code source. C'est une différence de taille qui rend l'utilisation de l'instruction "truncate" délicate, au regard de laquelle le confort du format de note longue de l'offre pro est incomparable.

Voyons le principe de cette troncature, avant de voir comment s'en accomoder.


Ça va couper ?

Je vous ai annoncé une différence entre le texte et le code, mais comment en évaluer l'importance ?

Tentons l'expérience : écrivons donc dans l'éditeur de note "1234567890", sans les guillemets. Vous avez saisi 10 caractères, mais le code source en comporte 17 car il est ainsi composé :

<p>1234567890</p>

Les difficultés ne font que commencer. Imaginons que j'attribue un lien hypertexte à cette "expression" vers l'adresse "http://geemee.hautetfort.com". Le code deviendra alors :

<p><a href="http://geemee.hautetfort.com">1234567890</a></p>

Nous en sommes déjà à 60 caractères dans le code alors que vous n'en voyez que 10. Et encore n'ai-je pas précisé la cible, la fenêtre dans laquelle le lien sera affiché, ni le titre du lien qui pourrait s'afficher dans une infobulle. Et si vous décidez d'insérer une image, là encore, vous augmentez considérablement le code :

<p><img src="http://geemee.hautetfort.com/images/aspire/marker.gif" alt="marker.gif" style="border-width: 0; float: left; margin: 0.2em 1.4em 0.7em 0;" /><a href="http://geemee.hautetfort.com">1234567890</a></p>

Nous en sommes à 211 caractères alors que l'on ne voit toujours que ceci :

Toute mise en forme du texte génèrera du code supplémentaire, et il devient donc très vite impossible de prévoir l'endroit précis ou sera effectuée la troncature. Ce n'est pas seulement que cela peut couper un mot au mépris des règles de césure que vous vous évertuez à respecter. Cela peut conduire à couper au milieu d'une commande de mise en forme ou de style qui déstabilisera l'ensemble de la page affichée.


Coupez, ça va !

En appliquant la méthode de la note "Afficher le début des notes de la page d'accueil" vous décidez d'un "point de coupe". Choisissez bien votre seuil, car il s'appliquera à toutes les notes, les nouvelles, comme les anciennes. De plus, un seuil qui serait supérieur à la longueur du code de votre note provoquerait un double affichage de la note. Sous titre, vous auriez deux fois le texte. À peu près l'exact opposé de ce que vous cherchiez en tronquant. Dans le code ci-dessous, le curseur a été placé à 500 caractères :

{$post.source|truncate:500:"..."}

Vous voulez couper à la fin de la première phrase du paragraphe suivant :

marker.gifIl est possible de n'afficher que début des notes, mais encore faut-il maîtriser le point de troncature.
Dans cette démarche il est plus facile d'avancer le "point de coupe" plutôt que de le reculer.

Si nous laissons le système couper au 500ème caratère du code, cela s'arrêtera à "poi et tout le reste du texte de la page sera en gras. L'instruction de fin de mise en gras ayant été supprimée par la troncature.

Pour avancer le point de troncature, aux 434 caractères déjà présents, il faudra ajouter le commentaire HTML suivant qui comporte les 66 caractères manquants pour arriver à 500.

<!--12345678901234567890123456789012345678901234567890123456789-->

Pour retarder le moment de la troncature, il faudrait raccourcir le texte de votre note ou apurer le code, en retirant de la mise en forme par exemple. Pas nécessairement le plus facile.


Pointez !

Nous avons décidé du point de coupe, mais pas encore de point de destination. Quand vous avez modifié le modèle de la page d'accueil, vous avez intégré les lignes suivantes :

{$post.source|truncate:500:"..."}
<p class="readmore"><a href="{$post.permalink}#more">Lire la suite >></a></p>

Vous voyez qu'il y a une ancre "#more" dans l'adresse, mais encore nous faut-il la poser dans la note de destination. Après avoir inséré le commentaire qui nous a permis d'avancer la troncature, nous insèrerons donc :

<a name="more"></a>

Si vous oubliez de posez cette ancre, le lecteur sera ramené au début de la note dans la page lien permanent. Ce n'est pas bien grave.

Pour finir, le code de notre exemple sera :

<p><img src="http://geemee.hautetfort.com/images/aspire/marker.gif" alt="marker.gif" style="border-width: 0; float: left; margin: 0.2em 1.4em 0.7em 0;" />Il est possible de n'afficher que début des notes, mais encore faut-il <a target="_self" title="Comment évaluer le point de troncature ?" href="http://geemee.hautetfort.com/archive/2009/03/13/afficher-debut-note-pointer-ancre-lire-suite.html">maîtriser le point de troncature</a>.
<!--12345678901234567890123456789012345678901234567890123456789-->
<a name="more"></a>
<br /> Dans cette démarche il est plus facile d'avancer le <b>"point de coupe"</b> plutôt que de le reculer.</p>

 

Au final, vous pourrez considérer que c'est beaucoup de complications pour ne pas payer un abonnement. À vous de juger.


[MAJ] Cette note a été intialement publiée le 17/03/2009.
1. 27/03/09 : cette méthode n'est plus appliquée ici mais reste applicable avec de nombreuses précautions expliquées dans cette note.

Commentaires

On peut donc utiliser le mode Note longue sans s'abonner? Etonnant!

Écrit par : Ferocias | 23.02.2010

Répondre à ce commentaire

Attention Ferocias ! Ce mode "note longue" là demande beaucoup de doigté, et je le déconseille pour les blogs ayant déjà de nombreuses archives ; il faut effectivement vérifier ce que cela donne, la coupure est "brutale" comme j'ai essayé de l'expliquer.

Écrit par : Gee Mee | 23.02.2010

Les commentaires sont fermés.