LeBlogger.com

Un nom de domaine personnel pour votre Blog Blogger

noreply@blogger.com (Soufiane Lamchaouri) — Thu, 11 Apr 2013 13:47:00 +0000

J’ai réalisé ici un tutoriel pour vous aider à configurer votre nom de domaine personnel (acheté chez 1and1) avec un blog Blogger. Dans la suite de l’article le mot "domaine" désigne (à titre d’exemple) le site LeBlogger.com et le "sous-domaine" désigne www.LeBlogger.com.

Le nom de domaine coûte environ 7 euro par an et vous avez droit à 10 sous-domaine gratuits. Donc en achetant un nom de domaine vous pouvez créer 10 blogs Blogger avec des noms de domaines personnels comme : www.leblogger.com, forum.leblogger.com et blog.leblogger.com ….

Avec Blogger, vous ne pouvez enregistrer que des sous-domaines. Mais vous pouvez facilement rediriger votre domaine vers votre sous-domaine en utilisant une redirection http dans 1and1 (donc sans effets secondaires sur le référencement). Ainsi vous aurez trois URLs qui pointent vert le même contenu : l’adresse blogspot, le domaine et le sous-domaine.

Configuration du compte 1and1

Inscrivez vous et acheter votre nom de domaine chez 1and1. Il faut environ 24 heures pour que le NDD soit opérationnel. Par la suite vous allez recevoir un email avec votre facture en PDF qui prouve que vous être le propriétaire du domaine. 1and1 débitera votre compte bancaire dans les 7 jours.

Allez dans votre compte 1and1 (gestion du pack) section Configuration des domaines. Sélectionnez votre nom de domaine et cliquez sur Nouveau / créer un sous domaine.
Ajouter seulement WWW et enregistrer.
Revenez dans Configuration des domaines sélectionnez votre domaine et cliquez sur Destination / Modifier la destination.

Dans "Destination" choisissez "Rediriger votre domaine". Dans "Adresse de redirection" entrerz l'URL de votre sous-domaine (Exemple : http://www.leblogger.com) et cochez "Redirection HTTP".

Le changement de destination des domaines et sous-domaines prend effet dans moins de 30 minutes

Revenez dans votre compte webmaster et selectionez votre sous-domaine et cliquer sur DNS / Modifier les paramètres DNS, cocher la case CNAME et à coté de Alias* ajoutez : ghs.google.com Enregistrez.
(le changement des paramètres DNS prend effet dans quelques heures à une journée au maximum).

La configuration de votre compte 1and1 est terminée.

Configuration de votre compte Blogger

Connectez vous à Blogger et aller dans Paramètre -> Basique -> Edition Domaine personnalisé/ Basculer vers les paramètres avancés. Entrez votre sous-domaine ( www.leblogger.com par exemple) et enregistrez.

Vous aurez immédiatement le message « Félicitations, votre blog est prêt ! » Maintenant votre Blogspot va être redirigé automatiquement vers votre domaine personnel.

Toutes les URLs (articles, pages, libellés etc) vont automatiquement être mises à jour.

La dernière chose à faire est de choisir votre domaine favori dans Google Webmaster Tools, c'est-à-dire le domaine qui va s’afficher dans les recherches Google : "www.leblogger.com" ou bien "leblogger.com". Il est indispensable de faire ce choix si non Google va considérer que ces deux sites sont totalement différents.
Cliquez ici pour vous inscrire chez 1and1.

Comment sauvegarder les images de votre Blog Blogger

noreply@blogger.com (Soufiane Lamchaouri) — Sun, 31 Mar 2013 07:00:00 +0000

Dans ce tutoriel je vais vous montrer comment sauvegarder les images de votre blog sur votre disque dur pour pouvoir les restaurer et les réutiliser si nécessaire.

Récemment j'ai eu un problème avec les images d'un blog que je gère et comme je n'avais pas de sauvegarde des photos, il a fallut modifier manuellement les articles, un-par-un !

Comment Blogger gère les images

La création d'un blog sous Blogger engendre la création d'un album photo sur Picasa (service de partage de photos de Google).

A chaque fois que vous ajoutez une photo dans ce blog, cette photo est hébergée dans l'album Picasa du blog.

Si une photo est supprimée de cet album Picasa, elle disparait du blog et les visiteurs verront un message d'erreur comme sur cet exemple :

Malheureusement il est très facile de supprimer des photos et même des albums sur Picasa, notamment via un téléphone Android.

Comment sauvegarder les photos

Pour sauvegarder les photos d'un blog, il faut régulièrement télécharger l'album Picasa du blog.

Donc pour télécharger l'album Picasa :

Allez dans Google+
Cliquez sur Photos puis Albums
Cliquez sur l'album qui porte le nom de votre blog
Dans le menu horizontal de droite, cliquez sur More puis Download Album

Voilà vous venez de télécharger une archive de votre album Picasa qui contient toutes les photos de votre blog.

Problème redirection vers lewordpress.com

noreply@blogger.com (Soufiane Lamchaouri) — Thu, 28 Feb 2013 22:18:00 +0000

Suivez ce tutoriel pour rendre votre blog accessible si vous êtes redirigé automatiquement vers lewordpress.com lorsque vous visualisez votre Blogspot ou quand vous allez dans l'interface Blogger ???

Ce problème arrive si vous utilisez un script hébergé sur le site lewordpress.com (notamment mon ancien code pour afficher des résumés avec des images). Le NDD a été racheté par quelqu'un de malhonnête qui redirige les visiteurs vers son site par du JavaScript.

Procédure pour se débarrasser de lewordpress.com

Vous devez enlever de votre blog l'appel au script hébergé chez lewordpress.com
Allez dans l'interface d'administration de Blogger et cliquez sur Modèle. Normalement vous ne pouvez rien faire sur cette page puisque vous êtes redirigé automatiquement vers lewordpress.com

Pour rester sur cette page, suivez la procédure décrite ici : UNE SOLUTION POUR RÉSOUDRE LES BUGS D’ÉDITION DE TEMPLATE SOUS BLOGGER

Donc une fois cette opération réussie (si vous avez des difficultés n'hésitez pas à me laisser un commentaire), vous pouvez modifier le code de votre blog en cliquant sur le bouton Modifier le code HTML .

Maintenant, avec les touches ctrl+F, il suffit de rechercher lewordpress.com/Blogger/JS/ et le remplacer par blogspot.leblogger.com/js/

Sauvegarder et normalement vous ne devez plus avoir de problèmes.

Si votre blog est toujours indisponible, alors le problème vient des widgtes.
Il faut désactiver un par un les widgets suivants :

Articles récents avec image
Articles populaires
Commentaires récents
Articles aléatoire
etc

Bien sur pour faire cela, il faut aller dans Mise en Page

N'hésitez pas à laisser un commentaire en dessous si vous avez des questions...

Résumé automatique avec image de vos articles dans la page d’accueil, des archives et des libellés

noreply@blogger.com (Soufiane Lamchaouri) — Thu, 06 Dec 2012 10:08:00 +0000

Aujourd’hui je vais vous montrer comment afficher un résumé avec image de vos articles dans la page d’accueil, des archives, des libellés et de recherche. Tout cela sera fait de manière totalement automatisé, c'est-à-dire que vous allez appliquer l’astuce et vos articles (anciens et nouveaux) seront résumés sans que vous n'ayez à les modifier.

~~J’utilise cette astuce depuis la création de mon blog et~~ voici un aperçu de ce que ça donne :

Mise à jour 4 --- 15 Janvier 2013

Changement d'hébergement.

Les avantages

-Tous vos articles sont résumés automatiquement.
-La première image est affichée dans le résumé automatiquement.
-Les articles dans Les pages d’Archives, de Libellés et les résultats des recherches internes sont automatiquement résumés.
-Deux copier/coller suffisent pour appliquer cette astuce.
-Vous choisissez la longueur du résumé et la taille des images.

Inconvénients

-Le seul point négatif de cette astuce est que les résumés perdent toute la mise en forme.
Mais lorsque vous cliquez sur « lire la suite » l’article est affiché normalement.

-Les images sont déformée si leur taille est trop différente de la taille définie par défaut pour les résumés.

Cette astuce est parfaite pour les blogs qui utilisent peu (ou pas) d’images dans les articles.
Elle est surtout pratique pour tout ceux (y compris moi) qui veulent résumer leur articles sans trop se prendre la tête en utilisant ~~la méthode classique~~ le bouton de résumé de Blogger.
J’utilise toujours des images de même dimension (128x128) et une longueur de texte équivalente, ce qui donne un look Pro et assez beau à la page d’accueil.

Installation - Étape 1 :

Comme je l’ai dit en haut, deux petits copier/coller suffisent pour utiliser cette astuce. La preuve :
Connectez vous à Blogger, Allez dans "Présentation", "Modifier le code HTML", cochez la case "Développer des modèles de gadgets", et recherchez (Ctrl + F) </head> et juste avant copier/coller ces lignes:

<script type='text/javascript'>var thumbnail_mode = "no-float" ;
summary_noimg = 300;        /* Longueur des des résumés,article sans image */
summary_img = 250;           /* Longueur des des résumés, article avec image */
img_thumb_height = 128;       /* Hauteur de l’image dans le résumé */
img_thumb_width = 128;       /* Largeur de l’image en pixel */
</script>
<script src='http://blogspot.leblogger.com/js/LireLaSuite0.js' type='text/javascript'/>

Pour afficher l'image du résumé à droite

Utilisez plutôt ce code juste avant </head>

<script type='text/javascript'>var thumbnail_mode = "no-float" ;
summary_noimg = 300;        /* Longueur des des résumés,article sans image */
summary_img = 250;           /* Longueur des des résumés, article avec image */
img_thumb_height = 128;       /* Hauteur de l’image dans le résumé */
img_thumb_width = 128;       /* Largeur de l’image en pixel */
</script>
<script src='http://blogspot.leblogger.com/js/LireLaSuiteDroite0.js' type='text/javascript'/>

Pour Centrer l'image du résumé

Pour afficher le résumé avec l'image au centre (taille réelle de l'image, comme affichée dans l'article non résumé) et le texte du résumé juste en dessous de cette image, copier/coller ce code avant </head> :

<script type='text/javascript'>var thumbnail_mode = "no-float" ;
summary_noimg = 300; /* Longueur des des résumés,article sans image */
summary_img = 250; /* Longueur des des résumés, article avec image */
</script>
<script src='http://blogspot.leblogger.com/js/LireLaSuiteCentre0.js' type='text/javascript'/>

Installation - Étape 2 :

Maintenant, recherchez <data:post.body/> et remplacez le par ces lignes:

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script> <div style='clear: both;'/><span style='float:right;padding-top:20px;'><a expr:href='data:post.url' rel='bookmark'> Lire La Suite...</a></span>
</b:if>
</b:if>

Vous pouvez utiliser une image au lieu de l'expression Lire La suite... en la remplaçant par :

<img src="URL de votre image" title="Lire La Suite" alt="Lire La Suite">

Maintenant les messages de votre page d’accueil, archives, libellés et de recherche sont résumés avec une image et le lien Lire la suite...

Remarque

Si vous voulez contrôler la taille (Message par message) et la mise en forme des résumés il faut utiliser ~~la méthode classique et résumer les articles un par un en suivant ce tutoriel.~~ la nouvelle fonction de résumé de Blogger.

Les Nouveaux services que proposent les Réseaux Sociaux

noreply@blogger.com (Soufiane Lamchaouri) — Tue, 20 Nov 2012 18:33:00 +0000

Apparus depuis maintenant un peu plus de 10 ans, les réseaux sociaux ont réussi à s’inscrire dans notre environnement. En effet à la vue de leurs succès, les réseaux sociaux et surtout Facebook sont désormais bien plus que de lieux virtuels de partage mais sont réellement devenus des services qui deviendront pratiquement aussi importants que les transports et les télécommunications. De plus depuis 2010, on a également assisté à un développement rapide du nombre de réseaux sociaux qui se veulent désormais plus spécialisé en proposant des services précis.

On a assisté au début du 21 ème siècle à l’avènement des réseaux sociaux qui ont rapidement connu un succès planétaire. Facebook a récemment dépassé le nombre du milliard d’utilisateur et s’affirme comme étant le géant du média social.

Selon une étude de la SNCD en 2012 sur plus de 10 934 personnes, représentatif des internautes inscrits à au moins un réseau social, Facebook est ainsi le réseau social le plus utilisé par les Français qui sont plus de 95% des socionautes à posséder un compte. De plus le réseau social développé par Mark Zuckerberg est le réseau social le plus utilisé, avec une moyenne d’utilisation de 68 minutes par jour contre 42 minutes pour Twitter par exemple. C’est donc une certitude, Facebook et les réseaux sociaux en général sont amenés à avoir un rôle de plus en plus important dans notre vie de tous les jours. Pour continuer à se développer, ils cherchent avant tout à proposer des nouveaux services pour se différencier et avoir toujours plus de membres. On assiste donc à l’émergence de plusieurs réseaux sociaux qui tentent de se spécialiser pour être des réseaux affinitaires et spécialisé.

Parmi les nouveaux réseaux sociaux, on peut citer les cas de Pinterest, Pheed, Diaspora, WeeMove ou encore Fancy qui tentent de proposer des services innovants pour se démarquer des plus grands réseaux sociaux.

Ainsi Pinterest a misé sur le partage des centres d’intérêts à partir de ce qui se trouve déjà sur internet pour s’affirmer «étant le troisième réseau social le plus populaire. Sa particularité réside donc dans le partage de contenu existant sur internet faisant de Pinterest un important pourvoyeur de trafic.
Preuve de sa popularité, les internautes passent plus de 2H30 par mois sur ce réseau.

Derrière Pinterest, on retrouve des réseaux largement moins connus mais qui méritent l’exposition grâce aux concepts innovants qu’ils proposent.
C’est par exemple le cas de Pheed qui a mis en place un système monétisé de l’information pour se différencier. Ce réseau social peut en effet s’apparenter à un Twitter Payant. Il mise donc sur la monétisation des contenus qui auront la garanti d’être exclusif pour les membres ayant un abonnement et pouvant donc suivre l’actualité de personnalités présente sur ce réseau (David Guetta).

On peut également citer Diaspora qui mise sur la sécurité et la confidentialité des contenus des utilisateurs en proposant un service d’archivage des publications sur les postes des membres assurant ainsi une totale décentralisation du système.

Enfin WeeMove se spécialise plus dans le partage d’évènements qui permet aux internautes de pouvoir faire connaissance entre eux.

Les réseaux sociaux ont réussi à occuper une place importante dans notre environnement. Ils sont devenus pratiquement indispensables dans beaucoup de domaines. Pour continuer à se développer, ils cherchent désormais à proposer des services toujours plus innovants.

Statistiques Blogger vs Statistiques Google Analytics

noreply@blogger.com (Soufiane Lamchaouri) — Mon, 29 Oct 2012 15:23:00 +0000

Cela fait plus de deux ans que Blogger offre des statistiques sur la fréquentation des Blogspots sans avoir à installer ou modifier quoi que ce soit, la fonctionnalité est intégrée à la plateforme.
Malheureusement cette option est toujours insuffisante pour la majorité d'entre nous et tout le monde devrait utiliser Google Analytics à la place.

Blogger à traduit l'interface en Français (pendant plus d'un an elle était en Anglais) et le look est vraiment sympa mais il y a pleins de statistiques qui manquent par rapport à Google Analytics.
Voici une petite liste :

Statistiques erronées : J'ai reçu +300.000 à partir de cette adresse : http://query.us.kikin.com/query-server/K/Query/?ksu=http%3A//www.init.com/&returnType=html !!!
Les statistiques de Blogger sont supérieures de 40% à celles de Google Analytics.
Statistiques pour les pages vue uniquement : Oui Blogger ne connait que les pages vues et ne prend pas en compte les "visiteurs", de ce fait on n'a pas accès à un tas de statistiques indispensables.
Nombre de visiteurs : vous pouvez avoir 100 pages vues par jour et avoir un seul visiteur.
Visiteurs connus : ce visiteur peut être le même que celui qui a visualisé les 200 pages hier.
Pages vues par visite : nombre total de pages vues par le nombre de visiteurs.
Temps par visite : le temps que passe un visiteur sur votre blog.
Taux de rebond : le pourcentage de personnes qui quittent le site après la première visite.
Statistiques d'une période précise : On ne peut pas avoir les statistiques de Juin 2012 ou celles du 27 Octobre 2012.

La liste est bien sûr beaucoup plus longue mais ces éléments devraient obliger tout le monde à utiliser Google Analytics.

Alors est ce que vous êtes un fan des statistiques Blogger ?

Adieu vieux Blogger

noreply@blogger.com (Soufiane Lamchaouri) — Fri, 12 Oct 2012 07:52:00 +0000

Blogger a définitivement tourné la page de l'ancienne interface qui datait quand même de 2004 et désormais depuis quelques semaines tout le monde est obligé d'utiliser la nouvelle interface "moderne" mais que beaucoup d'utilisateurs trouvent moins intuitive.

Même moi j'ai du mal à me motiver pour utiliser cette interface notamment pour modifier le code HTML du blog qui n'a pas changé depuis plusieurs mois :-(

Soufiane LeBlogger is back

noreply@blogger.com (Soufiane Lamchaouri) — Thu, 23 Aug 2012 09:09:00 +0000

Salut tout le monde. Ces dernières semaines j'ai été trop occupé avec des projets personnels et professionnels et je n'ai pas eu beaucoup de temps à consacrer à LeBlogger.com
Cela va bientôt changer et je compte recommencer à publier de nouveaux tutoriels et astuces pour vous aider à améliorer vos Blogspots :)

Comme vous l'avez certainement remarqué, mon ancien serveur de photos et scripts est mort et je commence petit à petit à mettre à jour les anciens articles avec du code qui fonctionne.

Donc si vous utilisez un de mes anciens widgets qui ne fonctionne plus, il suffit d'aller à l'adresse de l'article et de recopier le code une nouvelle fois.
Voici une liste non exhaustive des articles que je viens de mettre à jour:

Vous pouvez toujours me contacter si vous avez des questions ou remarques

Widget Articles Récents avec Image

noreply@blogger.com (Soufiane Lamchaouri) — Wed, 22 Aug 2012 14:36:00 +0000

Aujourd’hui je vous présente un des meilleurs widgets du blog: Un widget qui affiche les Articles Récents avec une 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.

Update Novembre 2012

Mon serveur où j'hébergeais le script en dessous a été bloqué par mon hébergeur parce qu'il utilise trop de ressources.
J'ai corrigé le problème et désormais rien n'est hébergé sur mon serveur et vous allez ajouter la totalité du code dans votre blog.
Il faut donc mettre à jour le code présent dans votre blog...

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 type="text/javascript">function removeHtmlTag(strx,chop){if(strx.indexOf("<")!=-1){var s=strx.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i]=s[i].substring(s[i].indexOf(">")+1,s[i].length);}}strx=s.join("");}chop=(chop<strx.length-1)?chop:strx.length-2;while(strx.charAt(chop-1)!=' '&&strx.indexOf(' ',chop)!=-1)chop++;strx=strx.substring(0,chop-1);return strx+'...';}function showrecentposts(json){document.write('<table width="'+boxwidth+'" border=0 bordercolor="#FF0000" align="left" cellspacing="'+cellspacing+'" bgcolor="'+borderColor+'">');j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break;}}if("content"in entry){var postcontent=entry.content.$t;}else if("summary"in entry){var postcontent=entry.summary.$t;}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))img[i]=d;cmtext=(text!='no')?'<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>':'';var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break;}}var daystr=(showPostDate)?'<i><font color="'+acolor+'"> - ('+day+' '+m+' '+y+')</font></i>':"";posttitle=(aBold)?"<b>"+posttitle+"</b>":posttitle;var trtd='<tr><td><img src="'+img[i]+'" width="'+thumbwidth+'" height="'+thumbheight+'"/></td><td style="font-size: 12px;">'+icon+'<a href="'+posturl+'">'+posttitle+'</a> - <span style="font-size: 9px; color: #616161;'+cmtext+' </span></td></tr>';if(summaryPost==0){trtd='<tr><td><img src="'+img[i]+'" width="'+thumbwidth+'" height="'+thumbheight+'"/></td><td>'+icon+'<a href="'+posturl+'">'+posttitle+'</a></td></tr>';}document.write(trtd);j++;}document.write('</table>');}document.write("<script src=\""+home_page+"feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");</script>

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

Traducteur avec drapeaux pour 51 langues (Blogger, over-blog et Canalblog)

noreply@blogger.com (Soufiane Lamchaouri) — Sat, 11 Aug 2012 10:18:00 +0000

Voici un widget qui va permettre à vos visiteurs de traduire les pages de votre blog (blogger, over-blog, canalblog, etc) dans leur langue.
Il va traduire tous le contenu de votre blog (articles, widget, commentaires, etc) juste en cliquant sur le drapeau de la langue (pays) du français vers cette langue.

Update Novembre 2012

Si les drapeaux ne s'affichent plus, il suffit de remplacer le code présent dans votre blog par le code mis-à-jour en dessous.
Le précedent serveur est mort et j'ai hébergé les photos dans un nouveau serveur plus performant.

Ce widget utilise le "nouveau" système de traduction de Google et il peut traduire les pages de votre blog ou site en 44 langues différentes : Afrikaans, Albanais, Allemand, Anglais, Arabe, Biélorusse, Bulgare, Catalan, Chinois, Coréen, Croate, Danois, Espagnol, Estonien, Finnois, Français, Galicien, Gallois, Grec, Hébreu, Hindi, Hongrois, Indonésien, Irlandais, Islandais, Italien, Japonais, Letton, Lituanien, Macédonien, Malaisien, Maltais, Néerlandais, Norvégien, Persan, Polonais, Portugais, Roumain, Russe, Serbe, Slovaque, Slovène, Suédois, Swahili, Tagalog, Tchèque, Thaï, Turc, Ukrainien, Vietnamien et Yiddish.
Impressionnant, n’est ce pas !

Ici je ne présente que les langues suivantes : Anglais (Américain), Espagnol, Italien, Allemand, Portugais, Suédois, Danois, Russe, Arabe, Chinois, Japonais, Coréen, Serbe, Néerlandais, Finnois, Polonais et Turc.

Démonstration

Cliquez sur un drapeau pour traduire cette page:

Si vous voulez ajouter d’autres langues (Parmi les 51 langues supportés), il suffit de laisser un commentaire dans cette page et je vous donnerais le code à ajouter au widget pour avoir la traduction dans cette langue.

Configuration

Il faut juste copier-coller le code en dessous à l'endroit où vous voullez afficher les drapeaux de traduction, par exemple vous pouvez les ajouter dans un widget Blogger.

<div style="text-align:center;"><a href='http://www.leblogger.com' style='display:none;'>blogger</a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cen&hl=fr&ie=UTF8'); return false;" title="American"><img style="cursor:pointer; cursor:hand;" alt="English" src="http://4.bp.blogspot.com/-uiwXsDxC_t4/UKFufNZaWVI/AAAAAAAAFwk/D4tYfwyIeAA/s1600/usa.png" title="Translate this page to American"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cen&hl=fr&ie=UTF8'); return false;" title="English"><img style="cursor:pointer; cursor:hand;" alt="English" src="http://3.bp.blogspot.com/-l5ng_hD4OYU/UKFuUcP1VEI/AAAAAAAAFu0/kzW7iWqL0pc/s1600/england.png" title="Translate this page to English"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Ces&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="español" src="http://3.bp.blogspot.com/-WiG7rk8kdzw/UKFuVKH5XDI/AAAAAAAAFu8/Zlk1JkCOfuQ/s1600/espagne.png" title="traducir esta página al español"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cit&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="Italiano" src="http://2.bp.blogspot.com/-dZJZcc6ZksQ/UKFuXgvrH6I/AAAAAAAAFvc/dRCAk-JQX2Y/s1600/italie.png" title="Traduci questa pagina in Italiano"/></a><a href='http://www.leblogger.com' style='display:none;'>blogger</a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cde&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="deutsch" src="http://4.bp.blogspot.com/-cv4kiuVjQYI/UKFuQQSTZLI/AAAAAAAAFuQ/O_4vGF3rrIU/s1600/allemagne.png" title="diese Seite auf deutsch"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cpt&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="Português" src="http://4.bp.blogspot.com/-yJymUJWhkas/UKFubVoJ6BI/AAAAAAAAFwA/BvQweUR5m8k/s1600/portugal.png" title="Traduzir esta página em Português"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cda&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="
Oversæt denne side til dansk" src="http://1.bp.blogspot.com/-jbjGTXcIhkc/UKFuTk1GB0I/AAAAAAAAFuw/H7P03cbplc8/s1600/danemark.png" title="Dansk"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Csv&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="Översätt webbplatsen på svenska" src="http://4.bp.blogspot.com/-avEW4VpOGd0/UKFud6Tip8I/AAAAAAAAFwY/iVjgcqsVAjw/s1600/suede.png" title="Översätt webbplatsen på svenska"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Car&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="العربية" src="http://3.bp.blogspot.com/-mlrMBmuEmBQ/UKFuRAEv3cI/AAAAAAAAFuU/7OoSAbY0m-s/s1600/arabie.png" title="ترجمة هذه الصفحة إلى العربية"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Czh-CN&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="中文" src="http://2.bp.blogspot.com/-c2DUh1wkaZE/UKFuR9oRJoI/AAAAAAAAFuc/hhPVlcjOAeo/s1600/chine.png" title="翻译此页成中文"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cru&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="Русский" src="http://4.bp.blogspot.com/-ow-oVcIG49U/UKFuccOl9qI/AAAAAAAAFwE/x6KXJPl05xM/s1600/russie.png" title="Перевести эту страницу на русский"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cja&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="日本語" src="http://2.bp.blogspot.com/-yZHFbCJV3h0/UKFuYtUumSI/AAAAAAAAFvo/mqiSYFm1J-Q/s1600/japon.png" title="このページを日本語に翻訳"/></a><a href='http://www.leblogger.com' style='display:none;'>blogger</a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cko&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="한국어" src="http://1.bp.blogspot.com/-LvbsQ3MnZu8/UKFuSZIhHiI/AAAAAAAAFuo/689K-ZqAk5Y/s1600/core.png" title="이 페이지 번역가 한국"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=fr%7Csr&hl=fr&ie=UTF8'); return false;" title="English"><img style="cursor:pointer; cursor:hand;" alt="Српски" src="http://3.bp.blogspot.com/-6lTJ1D2yBvE/UKFudGVCpiI/AAAAAAAAFwQ/HKb5qxoKHn8/s1600/serbie.png" title="
Транслате тхис паге ин Сербиан"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cnl&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="Nederlands" src="http://3.bp.blogspot.com/-3dC8eAi_8lo/UKFuZsTpEiI/AAAAAAAAFvw/rf0gHaOKQPA/s1600/paysbas.png" title="Vertaal deze pagina in het Nederlands"/><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cfi&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="Suomen" src="http://1.bp.blogspot.com/-diu5uE1A0Ws/UKFuV-xIwqI/AAAAAAAAFvE/CEWNfkISl-w/s1600/finland.png" title="Käännä tämä sivu osaksi Suomen"/></a></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Ctr&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="Türkçe" src="http://4.bp.blogspot.com/-c49VbmfkC6g/UKFuevKMloI/AAAAAAAAFwc/wr1xhn2oJzM/s1600/turkey.png" title="Çevirisini Bu sayfa türk"/></a><a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cpl&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="Polska" src="http://3.bp.blogspot.com/-yJaph5KW2OY/UKFuaVqStSI/AAAAAAAAFv4/dtNZeJ3_Vqw/s1600/poland.png" title="Przetłumacz tę stronę na język Polski"/></a><div style="font-size: x-small; text-align: center;"><a href="http://www.leblogger.com/2009/07/traducteur-blogger-drapeau-widget.html" target="_blank">Le </a><a href="http://www.leblogger.com/" target="_blank">Blogger</a></div></div>

Si vous ne voulez pas utiliser tous les drapeaux:

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cen&hl=fr&ie=UTF8'); return false;" title="American"><img style="cursor:pointer; cursor:hand;" alt="English" src="http://4.bp.blogspot.com/-uiwXsDxC_t4/UKFufNZaWVI/AAAAAAAAFwk/D4tYfwyIeAA/s1600/usa.png" title="Translate this page to American"/></a><a href='http://www.leblogger.com' style='display:none;'>blogger</a>

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cen&hl=fr&ie=UTF8'); return false;" title="English"><img style="cursor:pointer; cursor:hand;" alt="English" src="http://3.bp.blogspot.com/-l5ng_hD4OYU/UKFuUcP1VEI/AAAAAAAAFu0/kzW7iWqL0pc/s1600/england.png" title="Translate this page to English"/></a><a href='http://www.leblogger.com' style='display:none;'>blogger</a>

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Ces&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="español" src="http://3.bp.blogspot.com/-WiG7rk8kdzw/UKFuVKH5XDI/AAAAAAAAFu8/Zlk1JkCOfuQ/s1600/espagne.png" title="traducir esta página al español"/></a><a href='http://www.leblogger.com' style='display:none;'>blogger</a>

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cit&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="Italiano" src="http://2.bp.blogspot.com/-dZJZcc6ZksQ/UKFuXgvrH6I/AAAAAAAAFvc/dRCAk-JQX2Y/s1600/italie.png" title="Traduci questa pagina in Italiano"/></a><a href='http://www.leblogger.com' style='display:none;'>blogger</a>

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Cde&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="deutsch" src="http://4.bp.blogspot.com/-cv4kiuVjQYI/UKFuQQSTZLI/AAAAAAAAFuQ/O_4vGF3rrIU/s1600/allemagne.png" title="diese Seite auf deutsch"/></a><a href='http://www.leblogger.com' style='display:none;'>blogger</a>

<a target="_blank" rel="nofollow" onclick="window.open('http://www.google.com/translate_p?u='+encodeURIComponent(location.href)+'&langpair=fr%7Car&hl=fr&ie=UTF8'); return false;"><img style="cursor:pointer; cursor:hand;" alt="العربية" src="http://3.bp.blogspot.com/-mlrMBmuEmBQ/UKFuRAEv3cI/AAAAAAAAFuU/7OoSAbY0m-s/s1600/arabie.png" title="ترجمة هذه الصفحة إلى العربية"/></a><a href='http://www.leblogger.com' style='display:none;'>blogger</a>

Merci de laisser vos impressions sur ce Traducteur en commentaires.

Comment utiliser les conditions si-sinon dans Blogger (if-else)

noreply@blogger.com (Soufiane Lamchaouri) — Mon, 16 Jul 2012 18:22:00 +0000

Ça fait quelque temps que je veux vous parler des conditions si/si non dans Blogger qui permettent d'afficher ou de cacher un contenu selon la page où est ce qu'on se trouve.

Dans cet article vous allez découvrir comment utiliser les conditions b:if pour donner une autre dimension à votre Blogspot.

Comment ça marche

C'est très simple, on spécifie un condition et le contenu s'affichera seulement si cette condition est vrai, exemple :

Si on se trouve dans la page d'accueil :
Afficher bouton Facebook;
Fin si

On peut aussi utiliser un autre contenu qui s'affichera si la condition est fausse, grâce au Sinon :

Si on se trouve dans la page d'accueil :
Afficher bouton facebook;
Sinon
Afficher bouton Twitter;
Fin si

Au lieu d'utiliser Sinon on peut aussi utiliser une deuxième condition, exemple :

Si on se trouve dans la page d'accueil :
Afficher bouton Facebook;
Fin si
Si on ne se trouve pas dans la page d'accueil :
Afficher bouton Twitter ;
Fin si

Le jargon Blogger

Si vous avez compris le mécanisme alors il suffit de remplacer les termes Si, Sinon, fin si ... par leur équivalents dans Blogger :

Terme en Français	Équivalent Blogger
Conditions Si...Sinon dans Blogger
si	<b:if cond='La condition'>
Fin si	</b:if>
Sinon	<b:else/>
est égal	==
est différent	!=

Les différentes conditions possibles

Malheureusement on est très limité au niveau des possiblités et on ne peut pas faire des choses compliquées comme cibler le 3ième article de la page d'accueil ou cibler les articles avec un certain libellé.
Voici la liste des conditions possibles dans Blogger que j'ai réunie en analysant le code HTML de Blogger, n'hésitez pas à laisser un commentaire pour nous signaler d'autres conditions :

Pour mieux comprendre la suite vous devez d'abord consulter ces deux articles

Cibler uniquement la page d'accueil

<b:if cond='data:blog.url == data:blog.homepageUrl'>

Le Premier article ou l'Article le plus récent

<b:if cond='data:post.isFirstPost'>

Les articles ou Items

<b:if cond='data:blog.pageType == "item"'>

Les pages statiques

<b:if cond='data:blog.pageType == "static_page"'>

Une adresse en particulier

Il suffit de spécifier l'adresse URL de la page dans la quelle vous voulez que le contenu s'affiche :

<b:if cond='data:blog.url == "Adresse de la page avec le http://"'>

Les pages Index

<b:if cond='data:blog.pageType == "index"'>

Les Archives

<b:if cond='data:blog.pageType == "archive"'>

Page d'erreur 404

<b:if cond='data:blog.pageType == "error_page"'>

La version mobile (ne fonctionne pas encore)

<b:if cond='data:blog.isMobile'>

Cibler les articles avec un certain nombre de commentaires

Utile pour, par exemple, afficher un encart de pub en bas du blog seulement si le nombre des commentaires de l'article est supérieur (respectivement égale ou inférieur) à 10

<b:if cond='data:post.numComments > 10'>

On aurait pu aussi utiliser numComments == 10 ou numComments != 10 ou même numComments < 10 pour dire inférieur à 10.

La négation

Vous avez remarqué que dans les conditions précédentes on utilisait souvent "si 1truc == 1truc" mais on peut aussi afficher un contenu lorsque la comparaison est fausse avec "si 1truc != 1truc".

Concrètement voici un condition réalisable lorsque la comparaison entre la page où on se trouve et la page d'accueil est fausse :

<b:if cond='data:blog.url != data:blog.homepageUrl'>

Comment utiliser les conditions

Dans la majorité des cas il suffit d'ajouter ce qu'on veut cacher/afficher à l'intérieur de la condition mais dans certaines situations il faut bien analyser le code avant de l'encapsuler dans une condition.
Par exemple pour utiliser une condition sur un widget il faut toujours la mettre à l’intérieur de la balise Includable sinon Blogger affichera une erreur. Exemple :

<b:widget id='HTML3' locked='false' title='Nom du widget' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "index"'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

Pour plus d'informations, lisez cet article : Afficher un Widget dans des pages specifiques du Blog

Dans certain cas il faut réunir plusieurs conditions pour arriver à un résultat :

<b:if cond='data:blog.url == "Adresse 1 "'>
<b:if cond='data:blog.url == "Adresse 2 "'>
<b:if cond='data:blog.url == "Adresse 3 "'>

contenu a afficher uniquement si on se trouve dans l'adresse 1 ou 2 ou 3

</b:if>
</b:if>
</b:if>

Surtout n'oubliez pas de toujours fermer vos conditions en ajoutant à la fin un </b:if> pour chaque <b:if... utilisé.

Comment désactiver l'intégration du profil Blogger avec Google plus

noreply@blogger.com (Soufiane Lamchaouri) — Mon, 09 Jul 2012 10:07:00 +0000

J'ai découvert récemment que l'intégration du profil Blogger avec Google+ peut rendre l'accès à gmail tout simplement impossible.
Il était donc urgent de supprimer l'association du profil Blogger au compte Google+

Heureusement la manip est très simple: Il suffit d'aller dans Draft.Blogger.com et de cliquer sur la petite icone paramètres à droite.
Le lien Rétablir le profil Blogger permet d'annuler l'association avec Google plus:

Pour je ne sais quelle raison, Google avait supprimé l'intégration de ma photo de profil dans les résultats de recherche et il a suffi que je fasse la manipulation au dessus pour que la photo revienne automatiquement...

Solutions pour mieux protéger vos paiements en ligne

noreply@blogger.com (Soufiane Lamchaouri) — Wed, 04 Jul 2012 03:30:00 +0000

Selon plusieurs études, l’insécurité sur internet a fortement augmenté depuis les 5 dernières années pour atteindre des sommets cette année. La question de sécurité sur internet est donc devenue de plus en plus essentielle pour les entreprises et les particuliers surtout concernant les paiements en ligne et donc les paiements bancaires. Les fraudes à la carte bancaire ont en effet explosé depuis 3 ans.

Pour tenter de freiner ce phénomène inquiétant, les autorités mais les entreprises extérieures tentent d’apporter des solutions à ce problème.

Une étude de l’observatoire national de la délinquance a mis en avant l’augmentation inquiétante des fraudes lors des paiements en ligne. Selon l’étude, on remarque une nette augmentation de 30% des personnes ayant été victimes d’au moins un débit frauduleux sur leurs comptes bancaires durant l’année. Ils ont ainsi été plus de 650 000 à avoir subi une fraude lors d’un paiement en ligne.
Cela peut être facilement être expliqué par l’augmentation ces dernières du E-Commerce et donc des paiements à distance notamment sur Internet. On remarque ainsi que le commerce à distance représente même plus de 60% des fraudes en France.

La fraude à la carte bancaire a représenté plus de 415 Million d’euros en 2012 selon le rapport annuel délivré par l'observatoire de la sécurité des cartes de paiement. La faute à des fraudeurs qui arrivent régulièrement à trouver des nouveaux moyens pour récupérer les données bancaires qui transitent sur Internet comme « l’Hameçonnage ».
Pour freiner la progression rapide de ce problème, des mesures de prévention sont effectuées de plus en plus souvent par les autorités et des services précis sont mis à disposition des particuliers et des sociétés.

L’augmentation de la prévention par les autorités peut dans un premier temps être mise en avant pour tenter d’enrayer les fraudes sur internet lors des paiements en ligne. Les internautes sont donc mieux informer face à ces problèmes et aux solutions existantes.
Ces solutions sont pour la plupart apportées par des entreprises extérieures qui peuvent aider les particuliers et les entreprises à garantir la sécurité de leurs données bancaires lors d’un paiement en ligne. D’ailleurs, on remarque qu’avec le développement de la cybercriminalité, le marché de la sécurité informatique est devenu l'un des secteurs les plus dynamiques.

Le nombre de société proposant ces services a ainsi plus que doublé en 10 ans. Pour s’assurer de l’authenticité d’un document et son destinataire, les banques et quelques entreprises utilisent des signatures numériques confirmant la validité du message.
De plus, la plupart des sites de paiements en ligne adoptent désormais des certificats SSL pour garantir la sécurité des paiements des utilisateurs. Délivrés par des entreprises extérieures, ces certificats assurent un cryptage des informations bancaires échangées rendant impossible une interception par un fraudeur. Enfin les particuliers peuvent également identifier des certificats de sécurité sur des sites pour s’assurer de leurs sécurités.

On remarque donc que malgré une hausse importante des fraudes concernant les paiements en ligne, des solutions sont proposées pour pouvoir garantir aux entreprises et aux particuliers des paiements en ligne sécurisée. Les entreprises et les particuliers n’hésitent plus à utiliser au maximum ces services pour se doter d’une sécurité maximum lors d’un paiement en ligne.

Bouton de partage Buffer App pour Blogger-Blogspot

noreply@blogger.com (Soufiane Lamchaouri) — Mon, 02 Jul 2012 08:00:00 +0000

Bouton de partage Buffer App pour Blogger-Blogspot

Buffer App est une superbe petit application qui permet d'organiser et ordonner la publication dans Twitter, Facebook et LinkedIn. Pour en savoir plus ou pour vous y inscrire, direction le site officiel.

Dans ce tutoriel nous allons voir comment ajouter le bouton de partage Buffer avec compteur dans Blogger ce qui permettra à vos lecteurs de publier vos articles via le service Buffer App.

<a href="http://bufferapp.com/add" class="buffer-add-button" expr:data-text="data:post.title" expr:data-url="data:post.canonicalUrl" data-via="LeBlogger" data-count="vertical">Buffer</a>
<script type="text/javascript" src="http://static.bufferapp.com/js/button.js"></script>

Remplacez LeBlogger par votre identifiant Twitter et vertical par horizontal ou none pour changer l'affichage du bouton.

Voici le résultat lorsqu'on clique sur le bouton:

Sinon je prépare un widget Blogger qui vous permettra d'utiliser une barre flotante de partage comme celle que vous voyez à gauche de cet article avec un large choix de petit boutons...

Personnaliser l'adresse URL des articles dans Blogger

noreply@blogger.com (Soufiane Lamchaouri) — Fri, 29 Jun 2012 09:49:00 +0000

On peut enfin personnaliser l'adresse URL de nos articles et ainsi programmer les articles plus facilement.
En effet Blogger a ajouté un nouvelle option l'éditeur de messages qui permet de saisir un texte qui sera utiliser pour définir l'adresse de l'article.

Ce qu'il faut savoir

Ça ne fonctionne qu'à partir de Blogger Draft (et donc en utilisant la nouvelle interface).
On ne peut pas supprimer la référence à la date (année et mois) ajoutée automatiquement automatiquement à l'URL.
On ne peut pas supprimer le .html ajouté à la fin des URLs.
Impossible de personnaliser les anciens articles.
Une fois un article publié, il devient impossible de modifier son adresse (=lien permanent)
Il semblerait qu'il n'y a pas de limitation dans le nombre de caractères qu'on peut mettre dans l'URL personnalisée.
Dans le champ de saisi de l'URL personnalisée on peut écrire des lettres, des chiffres et des tirets les autres caractères ( . / ; , ? ' ' ) sont interdits et rendent la publication et la sauvegarde des articles impossible. Les underscore _ sont ignorés.

Comment modifier l'URL des articles

C'est très simple, allez dans Blogger Draft, cliquer sur Nouveau post et vous pouvez modifier l'adresse de l'article indépendamment de son titre en cliquant sur Lien permanent dans la colonne Paramètres des posts à droite:

Conseils Référencement

Je vous ai déjà montré comment optimiser le titre et l'URL d'un article Blogger en 2010 et aujourd'hui Blogger nous permet simplement d'automatiser le processus et du même coup la possibilité de programmer les publications.

Par exemple si le titre de mon article est : Disqus - Comment utiliser un système de commentaires plus performant et avec plus d'options dans Blogger
Je ne vais mettre que les mots clés dans l'URL personnalisée : Disqus Blogger commentaires blogspot

Alors qu'est ce que vous pensez de cette nouveauté ? N'hésitez pas à en discuter dans les commentaires :)
Je sais que ce n'est pas encore au niveau de ce qui se fait dans Wordpress par exemple mais c'est un bon point de départ.

Google veut l’extension '.blog' pour Blogger

noreply@blogger.com (Soufiane Lamchaouri) — Wed, 27 Jun 2012 09:18:00 +0000

Google veut acquérir l’extension pour les nom de Domaine en .blog pour l'utiliser dans sa plateforme Blogger-Blogspot.

On peut donc imaginer quelque chose comme LeBlogger.blog au lieu de l'actuel LeBlogger.Blogspot.com

C'est super pour nous, utilisateurs de la plateforme mais Google va certainement garder cette option uniquement pour son service de blogs et il sera impossible d'utiliser un nom de domaine en .blog avec un hébergement Wordpress par exemple (au total Google veut prendre contrôle de 101 extensions, bonjour la liberté :)

Je ne suis pas sûr que le service sera gratuit mais espérant juste qu'il soit facultatif et qu'on pourra utiliser un NDD librement.

Il y a 9 demandes d’acquisition de l’extension .Blog et on ne connaîtra le vainqueur que dans quelques semaines...

GlitterBurned, galerie des plus beaux Blogs faits avec Blogger

noreply@blogger.com (Soufiane Lamchaouri) — Mon, 18 Jun 2012 16:52:00 +0000

Vous connaissez certainement Lauren Thompson puisque je vous parle souvent de son petit blog nymfont.com
Eh bien Lauren a également lancé GlitterBurned.com une superbe galerie qui liste quelques un des plus beaux blogs crées avec la plateforme Blogspot.

Allez y faire un petit tour pour voir ce qu'on peut faire avec Blogger, trouver un peu d'inspiration et pourquoi pas proposer votre BeauBlogger pour le faire découvrir à la communauté (et gagner un petit backlink) :)

Blogger va bientôt nous obliger à utiliser la nouvelle interface

noreply@blogger.com (Soufiane Lamchaouri) — Tue, 10 Apr 2012 08:38:00 +0000

Personnellement je n'aime pas la nouvelle interface de Blogger qui a été annoncée en Mars 2011 qui va devenir la version par défaut pour tous les utilisateurs de la plate-forme 'very soon' !

La nouvelle interface est certes plus moderne mais je continu de penser que l’ancienne est plus efficace et on s'y retrouvait plus facilement.

Il y a également quelques options/fonctionnalités qui n'ont pas été repris comme la possibilité de cacher dans le tableau de bord certains blogs dont on est propriétaire. Dans la nouvelle interface les blogs s'affichent par date de dernière mise à jour et je ne trouve pas où modifier cela.
Malheureusement donc nous devons commencer à nous préparer pour dire adieu au bon vieux temps :)

Insérer une image dans un article directement à partir de la webcam

noreply@blogger.com (Soufiane Lamchaouri) — Sun, 08 Apr 2012 07:44:00 +0000

Blogger nous permet désormais d'insérer une image dans un article en utilisant la webcam de notre ordinateur (c'était déjà le cas pour les applications mobiles).

Dans l'éditeur de messages Blogger il suffit de cliquer sur l’icône Insérer une image et de choisir "From your webcam" pour pouvoir prendre une photo avec la webcam et l'ajouter automatiquement dans l'article.
C'est très pratique et plutôt efficace...

... mais faudra pas encore prendre 6 mois pour traduire le 'From your webcam' en français :)

Comment personnaliser la page 'Erreur 404 page introuvable'

noreply@blogger.com (Soufiane Lamchaouri) — Thu, 05 Apr 2012 11:31:00 +0000

Blogger a ajouté de nouvelles options dans la plate-forme pour nous permettre d'améliorer et contrôler un petit peu plus le référencement de nos blogs et désormais on peut personnaliser le contenu de la page 'Erreur 404 page introuvable'

Afficher un message texte

Ici nous allons afficher un petit message pour dire au visiteur que l'adresse de la page qu'il veut visualisé est incorrecte.

Pour avoir une idée de ce que ça donne allez dans une page qui n'existe pas, comme http://www.leblogger.com/cettepagenexistepas

Pour la configuration utilisez la nouvelle version de Blogger pour aller dans Paramètres -> Préférences de recherche -> Erreur et redirections et juste à coté de Page introuvable personnalisée cliquez sur modifier puis entrez votre propre message :

Utilisez le HTML et CSS

En plus du texte vous pouvez ajouter du code HTML/CSS, par exemple vous pouvez afficher une barre de recherche, des liens et des images, ce qui donnera :

Condition Si:Sinon pour error_page

Blogger a créé une condition if:else spéciale pour détecter si on se trouve ou pas dans une page de type erreur 404 et vous pouvez utiliser cette condition pour faire ce que vous voulez, comme par exemple cacher la sidebar, changer la balise Title, utiliser du Javascript....

<b:if cond='data:blog.pageType == "error_page"'>
quelques chose ici qui ne s'affichera que dans la page d'erreur
</b:if>

Je vais essayer de créer une page d'erreur très personnalisée pour LeBlogger et je vous donnerais plus d'explications dans un prochain article :)

Si vous avez des problèmes ou des questions pour définir une page 404 personnalisé, n’hésitez pas à laisser un commentaire en bas de cette page...

Préserver votre PageRank en utilisant l'attribut noFollow

noreply@blogger.com (Soufiane Lamchaouri) — Mon, 02 Apr 2012 12:57:00 +0000

Depuis quelques temps on a la possibilité d'ajouter les attributs rel='noFollow' et target='_blank' plus facilement aux liens d'un article Blogspot.

Dans l'éditeur de messages Blogger, il suffit de cliquer sur Associer et de cocher les deux petites cases en bas et Blogger va générer un code pour le lien comme celui-ci:

<a href="http://fr.wikipedia.org/wiki/Nofollow" rel="nofollow" target="_blank">Wikipédia </a>

noFollow

Vous le savez tous, le nombre de BackLinks est très important pour le référencement d'un site/blog mais un lien qui contient l'attribut nofollow ne sera pas considéré comme BackLink par Google et les autres moteurs.

L'intérêt pour vous d'utiliser le noFollow est de réserver le PageRank de votre blog à certains liens/sites.

Par exemple si je fais un lien vers LeBlogWeb et un autre vers Wikipédia sans utiliser le noFollow, Google va diviser la valeur de mon PageRank par deux alors que moi je n'ai rien à faire de Wikipédia mais je veux faire bénéficier LeBlogWeb.com de mon PageRank.
Il suffit que je coche la case noFollow pour le lien vers Wikipédia pour qu'il ne soit pas pris en compte par les moteurs de recherche.

target='_blank'

Cet attribut permet simplement aux navigateurs d'ouvrir le lien dans un nouvel onglet ou une nouvelle fenêtre.
Il est plutôt pratique même si il est préférable d'utiliser du JavaScript pour ouvrir les liens externes...

Blogspot.fr est en place, comment résoudre les problèmes

noreply@blogger.com (Soufiane Lamchaouri) — Mon, 19 Mar 2012 13:40:00 +0000

Désormais en France si on visite un blog hébergé par Blogger et qui n'utilise pas un Nom de Domaine personnel, on sera redirigé automatiquement vers la version nationale du blog c'est à dire avec une adresse se terminant par un BlogSpot.fr au lieu de l'habituel BlogSpot.com

Pour tester ceci, allez sur le blog de Thierry Video3dgoogleearthierrylahir.blogspot.com

J'ai déjà parlé de la nouvelle politique de Google pour contourner/faciliter le blocage de contenu dans certains pays, voici l'article : Une Adresse spécifique à chaque pays pour votre Blogspot

Cette nouveauté pose quelques problèmes puisque l'adresse du blog n'est plus la même avec cette redirection mais avec une petite astuce on peut obliger les robots à ne prendre en compte que l'adresse original du blog se terminant par .com

Résoudre le problème des boutons de partage

Il suffit simplement de rechercher toute occurrence de data:post.url et la remplacer par data:post.canonicalUrl ceci va résoudre le problème des boutons de partage sur les réseaux sociaux qui n'affichent pas les bons nombres.

Vous pouvez aussi ajouter les codes à nouveau, j'ai modifié la plupart des articles de LeBlogger.com :

Si vous avez des questions, n’hésitez pas à les poser dans les commentaires...

Les affichages dynamiques sont compatibles avec les widgets Blogger

noreply@blogger.com (Soufiane Lamchaouri) — Sat, 03 Mar 2012 09:28:00 +0000

Bonne nouvelle pour les utilisateurs des affichages dynamiques, ces Templates en HTML5, CSS3 et Ajax sont maintenant compatibles avec les widgets de Blogger.

Blogger détecte automatiquement vos widgets et les affiche dans une jolie barre verticale à gauche :

Voici la liste des widgets compatibles :

Archives.
Libellés.
Profil.
Liste des blogs.
Suivre les mises à jour par e-mail.
Membres (le vieux truc de Google Friends Connect !!!)

Pour tester les affichages dynamiques, il suffit d'ajouter /view à la fin de l'adresse de votre blog, vous pouvez voir tous les widgets compatibles ici : demo.leblogger.com/view/sidebar

Sinon voici quelques articles que j'ai déjà publié sur les affichages dynamiques :

N'hésitez pas à nous dire ce que vous pensez cette nouveauté dans les commentaires...

Statistiques Google Plus à partir de l'interface Blogger

noreply@blogger.com (Soufiane Lamchaouri) — Tue, 21 Feb 2012 13:16:00 +0000

Désormais on peut connaître combien de fois nos articles ont été partagé dans Google Plus et qui les a partagé directement à partir du tableau de bord Blogger :

Il suffit d'aller dans la section Messages de votre de votre tableau de bord (nouvelle interface) et vous y trouverez un petit signe '+' avec le nombre de fois qu'un article a été partagé.
Il suffit de cliquer dessus pour voir le nom et la photo des personnes qui ont partagé vos messages.

Et n'oublions pas qu'on peut également publier les articles dans Google Plus directement à partir du tableau de bord Blogger.

Comment revenir à l'ancienne version de Blogger-Blogspot

noreply@blogger.com (Soufiane Lamchaouri) — Thu, 16 Feb 2012 09:45:00 +0000

Pour revenir à l'ancienne version, il faut d'abord utiliser www.blogger.com et non pas draft.blogger.com et ensuite dans le tableau de bord Blogger, il faut cliquer sur la petite icône paramètres et choisir Ancienne interface Blogger :

J'utilise encore l’ancienne version et même si le look est un peu vieillot, il est beaucoup plus facile d'y trouver ce qu'on cherche... mais pour combien de temps encore ?