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.

20.10.2009

Affichez vos listes de liens dans un menu déroulant

Nous avons vu comment proposer l'accès aux archives en proposant une liste déroulante en bas du calendrier. Voyons comment appliquer cette méthode à la mise à disposition de listes de liens.

De nombreux blogs proposent des listes de liens à rallonge qui vont prendre grand place dans une ou deux colonnes. Afficher la liste ou pas, faire une sélection ou pas, autant de questions que chaque bloggueur finit par se poser. Sans prétendre proposer la solution idéale, la liste déroulante peut-être intéressante en prenant peu de place, tout en étant toujours gérée par le module d'administration de Hautetfort.

Pour éviter les malentendus, cliquez-ici pour voir un exemple de listes de liens mises en liste déroulante. Voyons un extrait du code.

Lire la suite

16.10.2009

Personnalisez l'affichage de vos listes de liens en proposant une description dans une infobulle

Personnalisez l'affichage de vos listes de liens en donnant quelques informations aux visiteurs qui s'apprêtent à les suivre. Révision d'une note publiée le 27/01/2009.

Parmi tous les trucs qui m'énervent, il y a le fil rouge des fromages fondus du bovin souriant, et l'huile des sardines en boîte bien sûr, mais aussi les cases de formulaire inutiles. Quand vous créer une liste de liens avec le module Hautetfort, et que vous faites une description appliquée, aussi pertinente que concise... Elle ne sert à rien. Elle est dans le formulaire, vous retrouvez la description dans le module d'administration, mais pas moyen d'afficher sur la partie publique du blog. Ou alors, et c'est possible, je ne comprend rien à rien.

Je vous propose de rendre cette description disponible dans une infobulle, cette zone qui s'affiche au survol d'un lien hypertexte. C'est déjà en place pour la liste de liens « Échangeur », mais vous pouvez voir un module de test ici.

Lire la suite

10.10.2009

Changer l'affichage des dernières notes

Personnalisons l'affichage du module "Notes récentes", en modifiant le nom du module, le nombre d'items, en précisant la date de publication, et en finissant par un lien avec les archives. Et tout ça en une note (mise à jour d'une note déjà révisée le 2 avril 2009).

La mise à jour de la note consacrée à la personnalisation des éléments de colonne m'a obligé à revoir celle-ci pour vous proposer un code "facilement" exploitable, et légèrement modifié. J'espère que c'est maintenant le cas.


Mais où est passé "Notes récentes" ?

Sur ce blog, effectivement, il n'y en a plus. On trouve à l'emplacement qui était le sien, un module nommé "Denières notes", qui affiche les 8 dernières notes, datées, et propose un accès aux archives.

J'ai dû chercher le code dans le modèle de page de la colonne où il était installé, pour trouver quelque chose comme :

Lire la suite

06.10.2009

Personnalisez les éléments des colonnes sans (trop) intervenir dans le code

Il n'est pas toujours nécessaire de passer en configuration avancée pour modifier le fonctionnement des modules situés dans les colonnes de votre blog. À condition de disposer du code adéquat, vous pouvez utiliser la gestion du "contenu des colonnes". (Mise à jour d'une note du 2 avril 2009)

J'ai déjà tenté de vous dissuader de modifier le code des éléments de colonne, en intervenant directement dans le code Html, des modèles de page « colonne de droite » ou « colonne de gauche ». Cela fonctionne correctement, mais toute intervention via le module d'administration de « Contenu des colonnes » effacerait vos interventions précédentes.

Je vous recommande donc d'utiliser l'administration de « Contenu des colonnes », accessible sans passer en configuration avancée, en réservant cette dernière à la récupération du code.

Comment récupérer le code d'un élément de colonne ?

Vous trouverez de nombreux exemples de code à récupérer dans mes notes, ce n'est peut-être pas la source la plus fiable, mais c'est celle que je connais le mieux. J'essaie de mettre la version d'origine avant mon code personnalisé, ce qui vous évite de passer en configuration avancée.

Pour récupérer le code d'un élément qui vous intéresse, il faut qu'il soit activé sur votre blog, puis passer en configuration avancée pour aller chercher dans le code des modèles de page « colonne de droite » ou « colonne de gauche ». Si vous avez peur de vous tromper, rien ne vous empêche de ne temporairement laisser activé que l'élément qui vous intéresse. Pour mémoire, la petite croix à côté de « colonne de droite » ou « colonne de gauche » ne fait que désactiver un élément. Pour « supprimer », il faut vraiment cliquer sur ce mot dans la liste des éléments, et H&F vous demande de confirmer.


Comment intégrer un code personnalisé.

Le principe est assez simple, il faut ajouter un élément personnalisé de texte, et y coller le code. Je vous le redis, les instructions spécifiques à la plateforme Hautetfort doivent être placées dans un élément « texte » et non « code Html / Javascript ».

Rappel : La mise à jour du contenu des colonnes réinitialise totalement le code Html de vos colonnes. Sauvegardez d'abord votre code personnel si vous en avez déjà.

  1. Dans l'administration, allez à Présentation / Contenu des colonnes

    341434024.jpg

  2. En bas de page, vous trouvez "Ajouter un élément personnalisé", choisissez « Ajouter un texte »

    Hautetfort_ajouter_element_personalisé_texte_code_personnalise.png
  3. Donnez un nom dans "Nom de l'élément"

  4. Dans "Contenu de l'élément" collez le code

  5. Selon le cas choisissez d'afficher ou non le "Nom de l'élément"

  6. Selon le cas choisissez d'aligner ou non le contenu du module

  7. Ces deux dernières options seront facile à modifier.

  8. Cliquez sur [Ajouter cet élément]

  9. Vous avez un nouvel élément dans votre liste, il faut choisir entre Ajouter à gauche ou Ajouter à droite (si vous avez les deux colonnes de côté).

  10. Remontez en haut de la page pour régler la position de l'élément dans la colonne

  11. Cliquez sur [Mettre à jour ces informations] sous la liste des éléments

Voilà, vous avez un nouvel élément dans votre liste, qui fait référence à votre CSS. Pensez à désactiver l'ancien en cliquant sur la petite croix que l'on voit à côté du contenu de chaque colonne.