Ajouter pages navigation à blogger

Libellés : Widgets Blogger

Publié par Othmane BENTALEB à 22:03

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 pages navigation à blogger.

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

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 :

.showpageArea {
font-family:verdana,arial,helvetica;
color: #000;
font-size:11px;
margin:10px;
}

.showpageArea a {
color: #000;
text-shadow:0 1px 2px #fff;
font-weight: 700;
}

.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
border:1px solid #919106;
-webkit-border-radius:3px;-moz-border-radius:3px;
background: #ddd url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk6nxrFr_qdKdvLbqO2uCWC3ueYZ4hIvKiuASuFLxTdBqWyuKhy2dQ9hb1qR6HtBLAXM_KymafZS2pMGL1z26KGTljjASUj1Yt1XI4K8D2Rv6QMr-MzbfN6ZAWcnHYjAzvddeu5oIvS5s/s400/wp2.jpg) 0 -50px repeat-x;
}

.showpageNum a:hover {
border:1px solid #aeae0a;
background: #ccc url(ttp:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk6nxrFr_qdKdvLbqO2uCWC3ueYZ4hIvKiuASuFLxTdBqWyuKhy2dQ9hb1qR6HtBLAXM_KymafZS2pMGL1z26KGTljjASUj1Yt1XI4K8D2Rv6QMr-MzbfN6ZAWcnHYjAzvddeu5oIvS5s/s400/wp2.jpg) 0 -25px repeat-x;
}

.showpageOf{
margin:0 8px 0 0;
}

.showpagePoint {
color:#fff;
text-shadow:0 1px 2px #333;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
-webkit-border-radius:3px;-moz-border-radius:3px;
border:1px solid #919106;
background: #666 url(ttp:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk6nxrFr_qdKdvLbqO2uCWC3ueYZ4hIvKiuASuFLxTdBqWyuKhy2dQ9hb1qR6HtBLAXM_KymafZS2pMGL1z26KGTljjASUj1Yt1XI4K8D2Rv6QMr-MzbfN6ZAWcnHYjAzvddeu5oIvS5s/s400/wp2.jpg) 0 0 repeat-x;
text-decoration: none;
}

 Maintenant chercher le code : </body> et juste avant coller le code suivant :

&lt;script type='text/javascript'&gt;
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=4;
var upPageWord ='Prev';
var downPageWord ='Next';
&lt;/script&gt;
&lt;script src='https://sites.google.com/site/outilsblogger/page-navigation/pagenavigation.js' type='text/javascript'&gt;&lt;/script&gt;

var postperpage=7; Nombre de posts sur chaque page
var numshowpage=4; Nombre de numéros qui seront aficher dans le widget

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