Ajouter like box à blogger

Publié par Othmane BENTALEB à 12:29

Bismillah. Bienvenue sur Outils Blogger http://www.outils-blogger.blogspot.com/ : Outils, Astuces, Widgets, Modèles, Adsense, Seo-Référencement.

Cette fois, on va savoir comment ajouter like box à blogger (Boîte J'aime).

Outils Blogger http://www.outils-blogger.blogspot.com/ : Outils, Astuces, Widgets, Modèles, Adsense, Seo-Référencement.

Connectez-vous à votre tableau de bord Blogger et accédez à

Présentation ---> Modifier le code HTML ---> Développer des modèles de gadgets

Chercher le code : ]]></b:skin> et juste avant coller le code suivant :

.fb_like_box {
margin-top:10px;
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px;
background-color:#3B5999;
border:3px solid #2B2B2B;
margin-bottom:10px;
padding:10px 7px;
width:540px;
}
.fb_like_top {
overflow:visible;
padding:0;margin:0 0 5px;
width:349px;
height:24px;
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjawkaRtefK0HObqNTNx-Hi8UMjV-ThukqUTXGI0jbWOTESp4SJWX1CjfIG5SA6oc57p9KCIMV6krD3jya2geUnNW6xosaYLzxoaQvnUov0Lr8k6-YV-6fwWTVRvmXPxBV6OrGK0NBlhUY/") no-repeat scroll left top transparent;
}
.fb_like_top a {
height:24px;
width:114px;
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbpDhSvWZM-IektLxUq7x0bIBJ05mQnBf_K2cS7xpt3l2FRkrciMCGUhzKgXC0afikRJBIXlbSUp99XiVh7gcweebA8pA7RCuGbJbwccqVGJwk438uzSYJFArViuA4IjQcR9tjYU7P1g/") no-repeat scroll left top transparent;
display:block;
margin-left:425px;
text-indent:-5000px;
}.fb_like_button_holder {
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px;
background:none repeat scroll 0 0 #FFFFFF;
padding:12px 12px 0 12px;
width:515px;
height:42px;
}

Puis cherchez le code : <data:post.body/> et juste après coller le code suivant :

<b:if cond='data:blog.pageType == "item"'>
<div class='fb_like_box'>
<div class='fb_like_top'><a rel='nofollow' href='http://www.facebook.com/pages/Outils-Blogger/218335311527032'>Be a Fan</a></div>
<div class='fb_like_button_holder'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px;height:30px;'/>
</div>
</div>
</b:if>

Remplacer le lien en rouge par celui de votre page et enregistrer le modèle.

Outils Blogger http://www.outils-blogger.blogspot.com/ : Outils, Astuces, Widgets, Modèles, Adsense, Seo-Référencement.