liste alphabetique messages libelle image

obtenir ces boutons

Afficher par ORDRE ALPHABÉTIQUE une liste
AVEC IMAGES des messages de la
même catégorie (avec le même "libellé")

Comme ci-dessous, on peut très facilement afficher par ORDRE ALPHABÉTIQUE une liste des messages de la même catégorie (avec le même "libellé") dans une page autonome ("statique") ou un message. Par rapport à la page précédente, cette page affiche en plus, par message, une image contenue dans ce message.

CATÉGORIE "DYNAMIC VIEW" :


Cette liste affiche les titres de tous les messages ayant le libellé "Dynamic View" sur le site "http://www.southernspeakers.net/".

Pour obtenir la liste affichée ci-dessus, il suffit d'ajouter le code suivant dans la version HTML d'une page statique ou d'un message :
<style type='text/css'>
.articles_alphas {list-style-type: none;float: left;width: 100%;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}
ul.articles_alphas li {padding-bottom:5px;padding-top:5px;border-bottom:black dotted 1px;min-height:40px;}
.articles_alphas a {text-decoration:none;}
.articles_alphas strong {font-size:10px;}
img.article_alpha {padding:0px 1px;width:55px;height:40px;border:0; float:left; margin:0px 10px; margin-top:0px;}
</style>
<div style="margin-left: 10px;font-weight: bold; color:black;font-size:20px;padding-top:5px;" >
CATÉGORIE "DYNAMIC VIEW" :</div>
<div style="margin-left: 10px;">
<script language='JavaScript'>
car_gras = true;
nb_mess=200;
nb_lignes_aff=10;
home_page = "http://www.southernspeakers.net/feeds/posts/default/-/Dynamic%20View";
</script><script style="text/javascript" src="https://sites.google.com/site/rvdmarcrailcatrain/home/libelle_ordre_alpha_im.js"></script>
</div>

Adaptations :
1) Il faut remplacer http://www.southernspeakers.net/ par le nom du blog concerné ;
2) A la fin de la même ligne, remplacer Dynamic%20View par le nom du libellé ;
remarque : %20 permet d'ajouter un espace entre Dynamic et View (le simple espace n'étant pas autorisé) ;
3) On peut changer le nombre de lignes : var nb_lignes_aff=10;
4) Pour corriger la marge à gauche, modifier "margin-left: 10px; (2x): le nombre peut être positif (:10px;) ou négatif (:-10px;).

8 commentaires:

†ιzzψ a dit…

Merci beaucoup !! C'est pile ce que je recherchais :)
Seriez-vous comment améliorer la netteté des images une fois la taille agrandie ?
Encore merci à vous

Meiser a dit…

Bonjour.

Page à consulter :

http://modifier-les-modeles-de-blogger.blogspot.com/2010/05/agrandir-les-images.html


Al Capone a dit…

Merci pour vos super tutoriels. J'avais posté une question sur un autre message mais en cherchant bien j'ai trouvé la réponse. Merci encore !

Manu lebonfilmleblog a dit…
Ce commentaire a été supprimé par l'auteur.
Manu lebonfilmleblog a dit…
Ce commentaire a été supprimé par l'auteur.
Manu lebonfilmleblog a dit…
Ce commentaire a été supprimé par l'auteur.
Manu lebonfilmleblog a dit…
Ce commentaire a été supprimé par l'auteur.
Manu lebonfilmleblog a dit…
Ce commentaire a été supprimé par l'auteur.