Widget Articles Récents avec Image

Aujourd’hui je vous présente un des meilleurs widgets du blog: Un widget qui affiche les Articles Récents avec une image.
Widget Articles Récents avec Image
Ce widget utilise le même code que celui de l’ancien widget des articles récents publié il y a quelque temps sauf qu’il affiche, en plus du titre de l’article, une image (la première image de l’article) mais égalament le résumé et le nombre de commentaires.

Installation :
Connectez vous à Blogger, Allez dans "Mise en page", cliquez sur "Ajouter un gadget" puis sur "HTML/JavaScript" et copier / coller le code suivant :

<script language="JavaScript">
imgr = new Array();
showRandomImg = true;
boxwidth = 360;
cellspacing = 2;
borderColor = "#FFF";
bgTD = "#000000";
thumbwidth = 32;
thumbheight = 32;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "Commentaires";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 7;
home_page = "http://www.leblogger.com/";
</script>
<script src="http://lewordpress.com//Blogger/JS/ArticleRecentsImage0.js"></script>
<center><a href="http://www.leblogger.com/" target="_blank"><span style="font-size: x-small;">Le Blogger</span></a></center>
Personnalisation:
boxwidth – Largueur du Widget
cellspacing – Espace entre les Titres
borderColor – couleur de la bordure du widget
borderColor - couleur de l'arrière plan
thumbwidth & thumbheight – largeur et longueur de l’image.
fntsize – Taille du texte.
acolor – Couleur des Titres
aBold - Texte gras (true ou false)
numposts – Nombre d’articles affiché
Blog_URL : l’adresse de votre blog

Si le widget n’est plus visible sur ce blog, vous pouvez toujours le voir en action sur widget.leblogger.com.
Libellés : , Publié le jeudi, juillet 02, 2009
79 Commentaires
ELLA à dit :

Très beau Widget et ton blog est aussi très beau

@ ELLA
Merci:x

Voilà c fait mais j'ai deux papillons verts ??? si c pour les textes sans image pour les prochains textes j'en mettrai une en attendant on peut changer le papillon ou pas ?
j'adore les smileys yahoo je vais essayerde les intégrer aussi c'est pas gagné (dsl je ne c pas faire court):|=))

oops les papillions se sont métamorphosés en poissons=))

@ Lilas :D
Quand il n'ya pas d'image dans l'article, le widget peut afficher des image aléatoirement, j'ai mis 2 imagette dauphin et papillion, pour les changer remplace ces adresses avec les adresses des photos que tu veux mettre :

http://i906.photobucket.com/albums/ac264/leblogger/1247191245_Butterfly.png
http://i906.photobucket.com/albums/ac264/leblogger/1247191284_Dolphin.png

Tu peux aussi supprimer ces deux adresse pour avoir un blanc lorsque l'article ne contient pas de photos. :o

@ Lilas

Si tu n'arrives pas avec les smiley, dit le je pourrais t'aider plus :

:f :D :) ;;) :x :$ x( :?
:@ :~ :| :)) :( :s :(( :o

Super widget encore ^__^, mais est-il possible de modifier la couleur du fond ?

@ Vouvou
Le Widget affiche un arrière plan transparent.
Pour modifier la couleur du fond il faut télécharger le fichier JavaScript et le modifier.
Je prépare une nouvelle version avec plus d'options....

Merci pour ta réponse :)

Lydie Dee à dit :

Bonsoir Soufiane !
Super widget ! Mais mon blog ne permets pas les commentaires, ce qui génère un "undefined" un peu moche à côté du titre du billet...
Y'a t-il un moyen de palier cet inconvénient ?
Merci pour ton aide.

@ Lydie Dee
il faut modifier un peu le fichier JavaScript pour qu'il n'affiche pas le compteur des commentaires.
Si tu veux vraiment utiliser ce widget et que tu ne sais pas comment faire la modification je pourrais t'aider.

Lydie Dee à dit :

Ayé ! Widget installé !! Je veux bien ton aide pour enlever "undefined" ! Bises Soufiane !

@ Lydie Dee
Dans le code que tu as ajouté tu remplaces http://www.hotlinkfiles.com/files/2645548_zijqk/ArticlesRecentparLeBlogger.js par
http://www.hotlinkfiles.com/files/2707018_vw14t/LeBlogger.js

Lydie Dee à dit :

@ Soufiane : merciii !!! T'es génial ! Gros bisous !

Soufiane à dit :

:X
tatasse
:)) :))

mikku à dit :

sa a marcher mais le widgjet et tout en bas de la page alors que je lavait place a droite...
ou est le probleme? je ne comprend pas :(

Ambiru à dit :

Mais non de non ton travail d'aide envers les utilisateurs de la plate forme BLOGGER est excellent ;) mais pourquoi intégrer un lien dans ton Widget :(
Est il possible de l effacer ? Histoire d avoir une présentation fraîche et professionnelle ?

Merci pour ton travail et à très bientôt sur leblogger.com :)

@ Ambiru
un tout petit lien n'est pas si génant que ça, et j'aprécierais vraiment si tu le gardes.

Sinon, oui tu peux l'enlever facilement.

Tortank1977 à dit :

Bonjour, je remarque que vous avez aussi un problème avec ce widget, vous savez d'où cela peut venir ?

Merci.

@ Totrank1977
Si Si le widget fonctionne parfaitement.
En fait le site ou j'enregistrais mes fichiers Javascript était hors d'usage pendant près de 3 heures et du coup tout les scripts ne fonctionnaient plus.
Le problème a été réglé et tout roule maintenant.

Tortank1977 à dit :

ok cool merci :) ton blog est super j'étais avant sur kazeo pas mal de truc aussi mais on ne sait pas faire comme Blogger modifier pas mal de chose dans le template. Je transfère tout pour le moment pas mal de taf.

@ Tortank1977
Merci oui en effet Google (Blogger) est le meilleur.
Bien sur après Wordpress, même si ce n'est pas dans la même catégorie.

J'ai ton media-libre-echange, il est trop cool et le Template est parfait (J'allais justement publier un article sur le SCARLETT).

Kazeon je connais pas.

Tortank1977 à dit :

Merci voici mon blog sur kazeo http://gratuitiel.kazeo.com/

Heu Scarlett c'est quoi ?

@ Tortank
Scarlett c'est le nom de la template/modèle Blogger que tu utilises.

ah oui tu devrais prendre un nom de domaine, c'est beaucoup plus cool.

Tortank1977 à dit :

ah ok, oui pourquoi pas je transfère le tout et je verrais après.

ok ok, si t'as besoin d'aide n'hésite pas.

salut,
le script ne fonctionne plus sur mon site.
pourtant c'est le seul qui fonctionnait impeccable, sans problème de positionnement.

aide svp !!!

@+

@ Mя Đo™ јuŝт ғøя ғци
J'ai beacoup de problème avec l'hébergement de mes fichiers JS. mais j'ai résolu (Pour quelques Mois) le problèmes et maintenant le script marche parfaitement.
C'est le même que j'utilise pour mon widget "Article Récents".
il faut juste remplacer l'ancien code avec le nouveau, Essai

salut,
trop bien merci.
en fait j'avais bien changé l'adresse, mais j'avais laissé le blog_url.
avec home_page,c'est beaucoup mieux
un grand merci à toi.
sinon, aurais-tu un petit logo (genre petit rectangle entre 100 et 150px X 15px)pour le mettre sur mon site.(un remerciement avec lien)

@ Mя Đo™ јuŝт ғøя ғци
Un remerciement avec lien, ah j'adore ça, c'est magnifique.

J'ai pas de logo pour le moment, mais un lien texte serais parfait.
Par exemple : <a href="http://www.leblogger.com" target="blank" title="LeBlogger.com">LeBlogger.com</a>

Je vais publier une MAJ pour afficher le widget en utisalt du jquery...

Franceline à dit :

Bonjour !
Encore un gadget sympa ...... re .. merci ....
`Je ne suis pas encore arrivée à gérer le nuage de tags dans mon blog "usuel"
...Par contre, je suis arrivée à l'installer dans un blog que j'ai clôturé`
URL ci-dessous

@ Franceline
J'ai dévoré tout les messages de ton blog http://quandlafemme.blogspot.com/ j'ai vraiment adoré, merci de partager tout ces moment ....

@
J'ai aussi adoré http://herreinfranc.blogspot.com/

Attention il y a le bouton bas de page qui traine au milieu du blog, et pour le widget articles récents avec image, la couleur des liens est la même que celle de l'arrière plan ce qui fait qu'on ne vois rien du tout ....

Bonjour,

il me semblait t'avoir laissé un message mais j'ai du faire une fausse manip.

j'ai installé ce widget sur mon site : www.gourmandeetcitadine.com et il marche très bien donc merci ! J'ai toutefois une petite demande de programmation j'imagine, est ce qu'au lieu de lui faire prendre la 1ère photo des billets qu'il trouve, est ce qu'on peut modifier le widget pour qu'il prenne la 2ème? car ma 1ère image est généralement une illustration du niveau de difficulté et non du résultat de ma recette.

merci de ton aide !

à plus

gourmande et citadine

bonjour Gourmande....,
en attendant la réponse de Soufiane, je vais tenter une réponse.
je ne pense pas que tu puisse, ce doit être dans son fichier JS. C'est lui qui te met des images par défaut s'il n'y en a pas sur ton article.
à moins que Sofiane transfert une partie des codes dans le sript.

voilà, j'espère ne pas avoir dit de bêtise.

@+

j'allais oublier,
la solution la plus simple reste de mettre une petite vignette en présentation sur tes posts.
c'est ce que j'ai fait
@+

salut tous,

juste un petit bug à signaler.

le "numposts = ce que tu veux" doit être inférieur ou égal au nombre de posts sur ton blog.
sinon, ça met le bordel, et ça se place n'importe où.

mais à part ça,c'est un script super

@+

@ gourmande et citadine
C'est peut être possible mais il faut imaginer un nouveau Script....

@ Mя Đo™ јuŝт ғøя ғци
Merci pour tes commentaires et ta contribution, c'est très sympa.....

De rien, ;)
faut bien que ça serve l'abonnement RSS :D
c'est toujours un plaisir, même si c'est vrai que c'est pas souvent :-/

@+ :-*

@
Merci c'est cool.....
bonne soirée.

bonjour,

@ Mя Đo™ јuŝт ғøя ғци merci pour ta réponse très rapide. C'est bien que je pensais malheureusement

@ Soufiane il me semblait bien qu'il fallait réécrire un truc dans le script. Sans vouloir trop te demander est ce très compliqué à faire ou tu penses que tu peux le modifier exceptionnelement?

merci d'avance

Gourmande et Citadine

@ Gourmande et Citadine
Non c'est trop compliqué, il faut créer un autre Widget qui affichera les 2 images, la première vide, puis la deuxième normale .....
C'est assez compliqué et ça n'en veux pas la peine, Tu aura le même problème avec "les Articles similaires", "les résumés", "les articles aléatoire" .....

Par contre pour les images comme "Niveau de difficulté" je pense avoir une astuce pour ça, c'est un peu compliqué j'expliquerais ça dans un tutoriel dans les jours a venir ....

@ soufiane : ok merci ! je regarderai ton tutoriel avec attention dans ce cas.
bonne soirée

Tony à dit :

Bonjour,

je constate un petit soucis assez embêtant avec ce widget, en effet sous firefox le fond colle avec mon theme gris, mais sous Ie ou safari, le fond est blanc (avec un texte blanc du coup on vois rien)

connaitrais tu l'astuce pour ce probleme assez etrange ?

mercii !

@Tony
Oui oui, dsl je vais modifier le fichiers JavaScript =))

Tony à dit :

Ok tu pourras me dire quand ce sera bon stp :D merci tu gère !

@Tony
OK ok, Bientôt.... Un nouveau Script....

bonjour à toi soufiane , déjà d'une , merci beaucoup de ton tes explication et de ton travail sur ce blog , voici ma question , j'avais installé ce widget , et je crois qu'il ne fonctionne plus , enfin pour mon blog , pourrais me dire ci cela vient de moi ou du template ;merci de ta réponse , et encore merci pour tout , bye bye ....

Ƞɸʯɳɸʯ180♫
Il faut remplacer le lien http://mydatanest.com/files/leblogger/12663_mvczy/Article_R__cents_image_0.js par http://lewordpress.com/Blogger/JS/ArticleRecentsImage1.js

Ou recopier le code entier du widget dans ton blog, sinon tous est OK.

Merci pour ton commentaire :)

Ce commentaire a été supprimé par l'auteur.

merci beaucoup de ta réponse et surtout de ta rapidité , je teste et te tient au courant , merci

re , bon ca ne marche pas , sniiifff , ci tu peut jeter un oeil sur mon template pour voir d'ou vient le défaut , le widget et nommer """Archives Des News Déroulantes Gauche"""
voila voila , voici mon adresse mail , beaucoup plus facile pour renvoyer le code rectifier ,augechris@orange.fr , milles merci :))8-(

Essai maintenant ;) ça devrait être bon :)

bonjour à toi soufiane , bon comme tu me l'a dit , c'est nickel chrom :D , j'ai tout remis en place et c'est reparti comme sur des roulettes , que dire de plus qu'un GRAANNNNNDDDD MMMMEEERRRRRCCCCCCCIIIIIII =)) Aller , sur ce , bon WE à toi , au plaisir bye bye....

@Ƞɸʯɳɸʯ180♫
Merci :)

Miss People à dit :

Merci Soufiane hier ca fonctionnait pas le module et là çà marche !! =))

@Miss Poeple
Ok, c'est cool :a

Tony à dit :

Salut Soufiane, pour mon problème c'est tjs possible ou pas ?
meci

@Tony
Oooops :-o dsl j'ai oublié 8-) je vais faire ça pour bientôt :(

Anonyme à dit :

Bonjour,

J'aimerais utiliser sans widget mais sans l'intitulé commentaire à côté de chaque article car je n'ai pas beaucoup de commentaires te je préférerais que ça n'apparaisse pas.
J'avais supprimé la ligne "commentaires" dans le code html mais du coup le widget n'apparaissait pas.
Peux-tu m'aider s'il te plaît car j'aimerais vraiment bien qu'on voit les derniers articles?
Merci beaucoup!

Mobi à dit :

Ahhh ca c'est cool exactement ce que je voulais faire merci :)

bonjour, même requête que Anonyme au dessus , plus haut tu proposais un lien pour un .js qui permettait de ne pas afficher les commentaires mais il ne semble plus actif ...
Une solution ?

Juste cette option et ce widget est au top
merci beaucoup ...

@les ateliers du bien-être
D'accord je mettrais un Mise à jour avec l'affichage des commentaires en option ...

Ce commentaire a été supprimé par l'auteur.
Ce commentaire a été supprimé par l'auteur.
Ce commentaire a été supprimé par l'auteur.
A. à dit :

Salut...

Tout d'abord, BRAVO pour ce site génialissime et qui rend de fiers serices!

J'ai un problème avec ce widget...

J'aimerais grossir les images et voir le début du titre, mais à chaque fois, mes titres dépassent... Comment éviter que cela déborde du cadre tout en gardant une lisibilité?

mob blog: http://lacuilleredaluine.blogspot.com/

Merci pour votre aide!

minuit-1 à dit :
Ce commentaire a été supprimé par l'auteur.

Salut à tous

avez vous une idée de comment ne pas afficher le dernier message publié histoire de ne pas créer un doublon? et de comment supprimer l'affichage des commentaires histoire de gagner un peu de place?

sinon ce widget est sans conteste excellent

merci

Coucou, merci beaucoup pour ce super widget :) !!!
Je trouve qu'il sert aussi beaucoup pour essayer de faire une présentation un peu magazine quand on a plusieurs blogs :)

J'ai juste un souci:

quand je laisse ton url de blog, les images des posts s'affichent sans aucun souci
mais quand je mets mes propres urls de blogs,
les images ont décidé de ne plus se montrer (test avec plusieurs blogs)

meme celles hébergées par blogger (j'en ai peu mais au moins une ou 2 et aucune ne s'affiche)

donc y'a t il une astuce qui m'aurait échappée s'il te plait?


sinon au passage en effet, la formule sans le premier post serait aussi utile, mais à moins de monde bien sur.

et enfin, je me demandais si c'était envisageable à long terme quand tu aurais du temps, de modifier la mise en page pour que l'image n'apparaisse pas sur la meme ligne mais bien en face du titre (comme dans tes resumes d'articles avec image pour la page d'accueil) par hasard s'il te plait? :)

ainsi quand on aggrandirait la taille de l'image, ca ne créérait pas un gros espace vide au-dessus des titres :)

Sinon j'ai aussi essayé de mettre TRUE pour les dates, mais ça m'a pas marché, peut-être qu'en fait il n'y a pas l'option comme tu n'en parlais pas (mais j'ai essayé quand meme).

Et je n'ai pas réussi à retirer les commentaires, mais en fait je ne suis pas sure que tu les ai déjà rendus optionnels.

enfin voilouuu :)

merciii beaucoup d'avance pour ton aide pour afficher mes images :)

Loulou
le blog avec mon souci:
http://loulouchan.blogspot.com/

oups oups oups, pardon pardon, je viens de trouver ton post plus récent (là: http://www.leblogger.com/2010/05/widget-article-recent-image-blogspot.html )avec une version automatisée et tout :)
Mes photos apparaissent enfin c'est génial je suis super contente et même le début de l'article, c'est mieux ainsi mercii beaucoup :):x:x:x

Happy F. à dit :

Comment faire pour que le titre apparait en dessous de l'image ?

mon blog : www.sohappyface.blogspot.com

Lola à dit :

J'ai utilisé la méthode que vous avez dite. Mais le problème c'est que dans ma barre de droite il y a le titre du widget mais le contenu se place beaucoup plus bas dans la barre, regardez pour mieu comprendre : http://chicandclothes.blogspot.com/
Quelqu'un peut m'aider s'il vous plaît?
Merci

André à dit :

Bonjour Soufiane ,

j'utilise qcq'uns de tes widgets depuis longtemps et moi aussi je te félicites et remercie pour le boulot que tu abats pour les autres.
Juste une petite demande : pour le widget commentaites récents avec photos , j'aimerais qu'il les affiche depuis le premier article jusqu'au dernier à l'inverse de ce qu'il fait actuellement.

Encore merci et cordialement

Merci Soufiane, je n'avais jamais essayer ce widget, il est super.

http://msgdamour.blogspot.com/

salma à dit :

salam Soufiane ,est ce que widget marche aussi sous d'autres palteforme comme over-blog
je peux par exemple coller ce script dans un module "texte libre"?

Copyright 2011 LeBlogger.com