.jpg)
Il y a 2 ans
décembre 28, 2012
Pour obtenir cette effet de page sur blogger au lieu de l'ancien système
"message plus ancien" et "plus récent" suivez ces différentes étapes
"message plus ancien" et "plus récent" suivez ces différentes étapes
Étape 1:
-connectez vous sur votre compte blogger puis allez dans présentation puis sur modifier le code HTML
ATTENTION !
Sauvegarder en téléchargeant le modèle dans son intégralité (en cas de soucis)Grâce à la touche CTRL+F
- Localiser cela:
- Puis collez ceci juste avant:
.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
border:1px solid #CCCCCC;
margin:0 3px;
padding:3px 7px;
text-decoration:none;
}
.showpageNum a:hover {
background-color:#CCCCCC;
border:1px solid #CCCCCC;
}
.showpagePoint {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:#CCCCCC none repeat scroll 0 0;
border:1px solid #CCCCCC;
color:#333333;
margin:0 3px;
padding:3px 7px;
text-decoration:none;
}
.showpageOf {
margin:0 3px 0 0;
padding:3px 7px;
text-decoration:none;
}
.showpage a {
border:1px solid #CCCCCC;
padding:3px 7px;
text-decoration:none;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link, .showpage a:link {
color:#333333;
text-decoration:none;
}
Ensuite Sauvegarder votre modèle
Étape 2
- Retourné sur Présentation puis Ajouter un Gadget
- HTML/JAVA SCRIPT
- Dans ce Gadget collez le code suivant:
var home_page_url = location.href;
var pageCount=2;
var displayPageNum=4;
var upPageWord ='Précédent';
var downPageWord ='Suivant';
function showpageCount(json) {
var thisUrl = home_page_url;
var htmlMap = new Array();
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';
for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);
var title = post.title.$t;
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}
if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'&max-results='+pageCount;
}
}
itemCount++;
}
for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}
fFlag++;
}
if(p==(thisNum-1)){
html += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
if(p==0){
html += '<span class="showpageNum"><a href="/">1</a></span>';
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
}
}
if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}
}
if(thisNum>1){
html = ''+upPageHtml+' '+html +' ';
}
html = '<div class="showpageArea"><span class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;
if(thisNum<(postNum-1)){
html += downPageHtml;
}
if(postNum==1) postNum++;
html += '</div>';
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");
if(postNum <= 2){
html ='';
}
for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}
if(pageArea&&pageArea.length>0){
html ='';
}
if(blogPager){
blogPager.innerHTML = html;
}
}
function showpageCount2(json) {
var thisUrl = home_page_url;
var htmlMap = new Array();
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';
var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';
var thisUrl = home_page_url;
for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);
var title = post.title.$t;
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}
if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'&max-results='+pageCount;
}
}
itemCount++;
}
for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}
fFlag++;
}
if(p==(thisNum-1)){
html += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
if(p==0){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
}
}
if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}
}
if(thisNum>1){
if(!isLablePage){
html = ''+upPageHtml+' '+html +' ';
}else{
html = ''+upPageHtml+' '+html +' ';
}
}
html = '<div class="showpageArea"><span class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;
if(thisNum<(postNum-1)){
html += downPageHtml;
}
if(postNum==1) postNum++;
html += '</div>';
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");
if(postNum <= 2){
html ='';
}
for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}
if(pageArea&&pageArea.length>0){
html ='';
}
if(blogPager){
blogPager.innerHTML = html;
}
}
</script>
<script type='text/javascript'>
var thisUrl = home_page_url;
if (thisUrl.indexOf("/search/label/")!=-1){
if (thisUrl.indexOf("?updated-max")!=-1){
var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"));
}else{
var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"));
}
}
var home_page = "/";
if (thisUrl.indexOf("?q=")==-1){
if (thisUrl.indexOf("/search/label/")==-1){
document.write('<script src="'+home_page+'feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" ><\/script>')
}else{document.write('<script src="'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&callback=showpageCount2&max-results=99999" ><\/script>')
}
}
</script>
Étape 3
- Changez les éléments en bleu à votre convenance exemple:
Changez le 4 en chiffres que vous voulez cela correspond au nombre de pages a affiché en bas
Changez le Suivant en NEXT
Merci beaucoup! De tout les codes que j'ai essayé seul le votre fonctionne! Merci.
RépondreSupprimerMais de rien
RépondreSupprimerd'autre code HTML pour embellir votre blog sont à venir ici n'hésitez pas a repassé
et a laissé votre blog je pourrais le mettre dans les blog amis !
encore merci
Bonjour, Merci beaucoup pour ce code, par contre est-il possible de modifier la taille des numéros et l'espacement entre eux ?
RépondreSupprimerMerci
Bonjour, alors j'ai cherché une solution pour toi (je te tutoie) vue que j'ai remarqué que nous avons le même age lol alors j'ai vue ton blog tu la bien intégrés mais logiquement il est d'origine censés être espacé de façon plus espacé c'est parfois les templates qui impact sur le widget mais cela dit je t'ai trouvé une solution pourrais te plaire.
RépondreSupprimerPS: je l'ai moi même ajouté comme tu peux le voir ici il fonctionne
PS2: j'ai mis ton blog dans les amis :p
PS3: je ferais paraitre ce type de code en article car posté le code HTLM directement dans le commentaire ne marche pas et je mettrais en avant les modifications possibles dans l'article
(couleurs taille etc etc)
hello Oh c'est super sympa, merci beaucoup
RépondreSupprimertu me dira si tu arrive sur la nouvel version et si tu aime :p
RépondreSupprimerce sera publié sur cette page ? Merci en tt cas
RépondreSupprimerc'est déjà fait :) tu la sur l'accueil si tu veux c'est
SupprimerNumérotation de page sur blogger 2
Je suis vraiment désolée, je ne comprends pas très bien, dans mon cas je veux juste espacer les chiffres par rapport à ce que j'ai déjà, je ne veux pas de cadre autour de chaque chiffre ni d'autres couleurs...
SupprimerJustement comme je le disais (sur le premier code il y'a justement des cadres autour)
Supprimermais les templates (c'est a dire les modèles choisis modifie cela (retire le cadre et colle un peu le numéro des pages))
(donc non sur celui là ce n'est pas possible mais tu peu utilisé le nouveau et rendre le cadre transparent par rapport a ton propre fond par exemple)
ah, je viens donc de supprimer les codes de la première version à la fois ds le css et dans le widget et j'ai juste ajouté un widget avec le nouveau code mais ça ne marche pas :(
SupprimerLogiquement si tu a supprimé l'ancien dans le css et dans le widget sauvegarde et ensuite suis la manipulation pour le second code
Supprimeret si tu veux remplace les 191970 par le mot transparent et dit moi si sa marche et si ça te convient mieux :)