Add Page Number (with First and Last Page) Navigation Link for Blogger (Blogspot) with Gadget Element and Manual Hack Legg til side Antall (med første og siste side) Navigation Link for Blogger (Blogspot) med Gadget Element og Manuell Hack

Blogger free blog publishing platform uses a pretty limited navigation features that only display “Older Posts” or “Newer Posts” link to let readers navigate and browse to other pages on homepage (index), archive, category and label pages. Blogger gratis blogg publisering plattformen bruker en ganske begrenset navigasjon funksjoner som bare viser "Eldre innlegg" eller "Nyere innlegg"-linken for å la leserne navigere og bla gjennom til andre sider på hjemmesiden (indeksen), arkiv, kategori og etiketten sider. Unlike WordPress blog that supports plugin to customize the page navigation link to numbered pages listing to make it more user friendly, Blogger, whether hosted on blogspot.com or custom domain does not have such flexibility. I motsetning til WordPress bloggen som støtter plugin-modulen for å tilpasse siden for navigering lenke til sider oppføringen for å gjøre den mer brukervennlig, Blogger, enten ligge på blogspot.com eller tilpasset domene ikke har slik fleksibilitet.

However, it’s still possible to change and replace the typical classic “Older Posts” and “Newer Posts” navigation link on Blogger blog to numbered pages navigation, as illustrated in figure below by using a CSS and JavaScript hack wrote by Mohamed Rias. Men det er fortsatt mulig å endre, og erstatte den typiske klassiske "Eldre innlegg" og "Nyere innlegg" navigasjon kobling på Blogger-bloggen til nummererte sider navigasjon, som illustrert i figuren under ved hjelp av en CSS og JavaScript hakke skrevet av Mohamed Rias.

Numbered Page Navigation for Blogger

As shown in image above, a navigation link consists of page numbers, first page, last page, next page and previous page (when applicable) is display on Blogger blog instead of the usual “Older Items” and “Newer Items” text links. Som vist i bildet ovenfor, en navigasjon koblingen består av sidetall, første side, siste side, neste side, og forrige side (når gjeldende) er visning på Blogger-bloggen stedet for de vanlige "eldre elementer" og "Nyere elementer" tekst-lenkene.

To add the “new” navigation link with page number to Blogger blog, simply add in a new Page Element Gadget in the Blogger. Å legge til "nye" navigasjon kobling med sidenummer på Blogger-bloggen din, kan du legge inn et nytt sideelement Gadget i Blogger. To do so, follow the guide below: Slik gjør du ved å følge veiledningen nedenfor:

  1. Login to Pålogging til Blogger account Dashboard . konto Dashboard.
  2. Click on the Layout link for the blog that you want to modify (if you’re viewing the blog and logged in to Blogger or Google Account, just click on Customize on the Next Blog toolbar. Klikk på Layout-koblingen for den bloggen du vil endre (hvis du ser på bloggen og logget inn på Blogger-eller Google-konto, klikk på Tilpass på Neste blogg verktøylinjen.
  3. Go to Page Element tab (by default). Gå til sideelement kategorien (som standard).
  4. Click on Add a Gadget anywhere in the layout. Klikk på Legg til en gadget-overalt i utformingen.
  5. In the Add a Gadget window, select HTML/JavaScript . I Legg til en gadget-vinduet, velg HTML / JavaScript.
  6. Add the following code into the Content text field. Legg til følgende kode i innhold tekstfeltet. Title field can be left blank, or just type in any description such as “Page Navigation” to differentiate it from the rest of widgets. Tittel-feltet kan stå tomt, eller bare skriver inn noen Beskrivelsen som for eksempel "Side Navigation" for å skille det fra resten av ting.

    <style>
    .showpageArea { . showpageArea (
    padding: 0 2px;margin-top:10px;margin-bottom:10px; padding: 0 2px; margin-top: 10px; margin-bottom: 10px;
    } )

    .showpageArea a { . showpageArea en (
    border: 1px solid #505050; border: 1px solid # 505050;
    color: #000000;font-weight:normal; color: # 000000; font-weight: normal;
    padding: 3px 6px !important; padding: 3px 6px! viktig;
    padding: 1px 4px ;margin:0px 4px; padding: 1px 4px; margin: 0px 4px;
    text-decoration: none; text-decoration: none;
    } )

    .showpageArea a:hover { . showpageArea a: hover (
    font-size:11px; font-size: 11px;
    border: 1px solid #333; border: 1px solid # 333;
    color: #000000; color: # 000000;
    background-color: #FFFFFF; background-color: # FFFFFF;
    } )

    .showpageNum a { . showpageNum en (
    border: 1px solid #505050; border: 1px solid # 505050;
    color: #000000;font-weight:normal; color: # 000000; font-weight: normal;
    padding: 3px 6px !important; padding: 3px 6px! viktig;
    padding: 1px 4px ;margin:0px 4px; padding: 1px 4px; margin: 0px 4px;
    text-decoration: none; text-decoration: none;
    } )

    .showpageNum a:hover { . showpageNum a: hover (
    font-size:11px; font-size: 11px;
    border: 1px solid #333; border: 1px solid # 333;
    color: #000000; color: # 000000;
    background-color: #FFFFFF; background-color: # FFFFFF;

    } )
    .showpagePoint { . showpagePoint (
    font-size:11px; font-size: 11px;
    padding: 2px 4px 2px 4px; padding: 2px 4px 2px 4px;
    margin: 2px; margin: 2px;
    font-weight: bold; font-weight: bold;
    border: 1px solid #333; border: 1px solid # 333;
    color: #fff; color: # fff;
    background-color: #000000; background-color: # 000000;
    } )

    .showpage a:hover { . showpage a: hover (
    font-size:11px; font-size: 11px;
    border: 1px solid #333; border: 1px solid # 333;
    color: #000000; color: # 000000;
    background-color: #FFFFFF; background-color: # FFFFFF;
    } )

    .showpageNum a:link,.showpage a:link { . showpageNum a: link,. showpage a: link (
    font-size:11px; font-size: 11px;
    padding: 2px 4px 2px 4px; padding: 2px 4px 2px 4px;
    margin: 2px; margin: 2px;
    text-decoration: none; text-decoration: none;
    border: 1px solid #0066cc; border: 1px solid # 0066cc;
    color: #0066cc; color: # 0066cc;
    background-color: #FFFFFF;} background-color: # FFFFFF;)

    .showpageNum a:hover { . showpageNum a: hover (
    font-size:11px; font-size: 11px;
    border: 1px solid #333; border: 1px solid # 333;
    color: #000000; color: # 000000;
    background-color: #FFFFFF; background-color: # FFFFFF;
    } )
    </style> </ style>

    <script type=”text/javascript”> <script type="text/javascript">

    function showpageCount(json) { funksjon showpageCount (json) (
    var thisUrl = location.href; var thisUrl = location.href;
    var htmlMap = new Array(); var htmlMap = new Array ();
    var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==”.blogspot.com/”; var isFirstPage = thisUrl.substring (thisUrl.length-14, thisUrl.length )==". blogspot.com / ";
    var isLablePage = thisUrl.indexOf(”/search/label/”)!=-1; var isLablePage = thisUrl.indexOf ( "/ search / etikett /")!=- 1;
    var isPage = thisUrl.indexOf(”/search?updated”)!=-1; var isPage = thisUrl.indexOf ( "/ search? oppdatert ")!=- 1;
    var thisLable = isLablePage ? var thisLable = isLablePage? thisUrl.substr(thisUrl.indexOf(”/search/label/”)+14,thisUrl.length) : “”; thisUrl.substr (thisUrl.indexOf ( "/ search / etikett /") 14, thisUrl.length): "";
    thisLable = thisLable.indexOf(”?”)!=-1 ? thisLable = thisLable.indexOf ("?")!=- 1? thisLable.substr(0,thisLable.indexOf(”?”)) : thisLable; thisLable.substr (0, thisLable.indexOf ("?")): thisLable;
    var thisNum = 1; var thisNum = 1;
    var postNum=1; var postNum = 1;
    var itemCount = 0; var itemCount = 0;
    var fFlag = 0; var fFlag = 0;
    var eFlag = 0; var eFlag = 0;
    var html= ”; var html = ";
    var upPageHtml =”; var upPageHtml = ";
    var downPageHtml =”; var downPageHtml = ";

    var pageCount=5; var pageCount = 5;
    var displayPageNum=3; var displayPageNum = 3;
    var firstPageWord = ‘First’; var firstPageWord = 'Første';
    var endPageWord = ‘Last’; var endPageWord = 'Siste';
    var upPageWord =’Previous’; var upPageWord = 'Forrige';
    var downPageWord =’Next’; var downPageWord = 'Neste';

    var labelHtml = ‘<span class=”showpageNum”><a href=”/search/label/’+thisLable+’?&max-results=’+pageCount+’”>’; var labelHtml = '<span class="showpageNum"> <a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

    for(var i=0, post; post = json.feed.entry[i]; i++) { for (var i = 0, post; post = json.feed.entry [i]; i + +) (
    var timestamp = post.published.$t.substr(0,10); var tidsstempel = post.published. $ t.substr (0,10);
    var title = post.title.$t; var title = post.title. $ t;
    if(isLablePage){ if (isLablePage) (
    if(title!=”){ if (tittel !="){
    if(post.category){ if (post.category) (
    for(var c=0, post_category; post_category = post.category[c]; c++) { for (var c = 0, post_category; post_category = post.category [c]; c + +) (
    if(encodeURIComponent(post_category.term)==thisLable){ if (encodeURIComponent (post_category.term) == thisLable) (
    if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){ if (itemCount == 0 | | (itemCount% pageCount == (pageCount-1))) (
    if(thisUrl.indexOf(timestamp)!=-1 ){ if (thisUrl.indexOf (tidsstempel)! =- 1) (
    thisNum = postNum; thisNum = postNum;
    } )

    postNum++; postNum + +;
    htmlMap[htmlMap.length] = ‘/search/label/’+thisLable+’?updated-max=’+timestamp+’T00%3A00%3A00%2B08%3A00&max-results=’+pageCount; htmlMap [htmlMap.length] = "/ search / etikett / '+ thisLable +'? oppdatert-maks = '+ tidsstempel +' t00% 3A00% 3A00% 2B08% 3A00 & max-resultater = '+ pageCount;
    } )
    } )
    } )
    }//end if(post.category){ ) / / end if (post.category) (

    itemCount++; itemCount + +;
    } )

    }else{ ) else (
    if(title!=”){ if (tittel !="){
    if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){ if (itemCount == 0 | | (itemCount% pageCount == (pageCount-1))) (
    if(thisUrl.indexOf(timestamp)!=-1 ){ if (thisUrl.indexOf (tidsstempel)! =- 1) (
    thisNum = postNum; thisNum = postNum;
    } )

    if(title!=”) postNum++; if (title! = ") postNum + +;
    htmlMap[htmlMap.length] = ‘/search?updated-max=’+timestamp+’T00%3A00%3A00%2B08%3A00&max-results=’+pageCount; htmlMap [htmlMap.length] = "/ search? oppdatert-maks = '+ tidsstempel +' t00% 3A00% 3A00% 2B08% 3A00 & max-resultater = '+ pageCount;
    } )
    } )
    itemCount++; itemCount + +;
    } )
    } )

    for(var p =0;p< htmlMap.length;p++){ for (var p = 0; p <htmlMap.length; p + +) (
    if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){ if (p> = (thisNum-displayPageNum-1) & & p <(thisNum + displayPageNum)) (
    if(fFlag ==0 && p == thisNum-2){ if (fFlag == 0 & & p == thisNum-2) (
    if(thisNum==2){ if (thisNum == 2) (
    if(isLablePage){ if (isLablePage) (
    upPageHtml = labelHtml + upPageWord +’</a></span>’; upPageHtml = labelHtml + upPageWord + "</ a> </ span> ';
    }else{ ) else (
    upPageHtml = ‘<span class=”showpage”><a href=”/”>’+ upPageWord +’</a></span>’; upPageHtml = '<span class="showpage"> <a href="/">' + upPageWord + "</ a> </ span> ';
    } )
    }else{ ) else (
    upPageHtml = ‘<span class=”showpage”><a href=”‘+htmlMap[p]+’”>’+ upPageWord +’</a></span>’; upPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">' + upPageWord + "</ a> </ span> ';
    } )

    fFlag++; fFlag + +;
    } )

    if(p==(thisNum-1)){ if (p == (thisNum-1)) (
    html += ‘&nbsp;<span class=”showpagePoint”><u>’+thisNum+’</u></span>’; html + = '<span class="showpagePoint"> <u>' + thisNum + "</ u> </ span> ';
    }else{ ) else (
    if(p==0){ if (p == 0) (
    if(isLablePage){ if (isLablePage) (
    html = labelHtml+’1</a></span>’; html = labelHtml +'1 </ a> </ span> ';
    }else{ ) else (
    html += ‘<span class=”showpageNum”><a href=”/”>1</a></span>’; html + = '<span class="showpageNum"> <a href="/"> 1 </ a> </ span>';
    } )
    }else{ ) else (
    html += ‘<span class=”showpageNum”><a href=”‘+htmlMap[p]+’”>’+ (p+1) +’ </a></span>’; html + = '<span class="showpageNum"> <a href="'+htmlMap[p]+'">' + (p +1) + "</ a> </ span> ';
    } )
    } )

    if(eFlag ==0 && p == thisNum){ if (eFlag == 0 & & p == thisNum) (
    downPageHtml = ‘<span class=”showpage”> <a href=”‘+htmlMap[p]+’”>’+ downPageWord +’</a></span>’; downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">' + downPageWord + "</ a> </ span> ';
    eFlag++; eFlag + +;
    } )
    }//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){ ) / / end if (p> = (thisNum-displayPageNum-1) & & p <(thisNum + displayPageNum)) (
    }//end for(var p =0;p< htmlMap.length;p++){ ) / / end for (var p = 0; p <htmlMap.length; p + +) (

    if(thisNum>1){ if (thisNum> 1) (
    if(!isLablePage){ if (! isLablePage) (
    html = ‘<span class=”showpage”><a href=”/”>’+ firstPageWord +’ </a></span>’+upPageHtml+’ ‘+html +’ ‘; html = '<span class="showpage"> <a href="/">' + firstPageWord + "</ a> </ span>" + upPageHtml + '' + html + '';
    }else{ ) else (
    html = ”+labelHtml + firstPageWord +’ </a></span>’+upPageHtml+’ ‘+html +’ ‘; html = "+ labelHtml + firstPageWord +" </ a> </ span> "+ upPageHtml + '' + html + '';
    } )
    } )

    html = ‘<div class=”showpageArea”><span style=”font-size:11px;padding: 2px 4px 2px 4px;margin: 2px 2px 2px 2px;color: #000000;border: 1px solid #333; background-color: #FFFFFF;” class=”showpage”>Page ‘+thisNum+’ of ‘+(postNum-1)+’: </span>’+html; html = '<div class="showpageArea"> <span style = "font-size: 11px; padding: 2px 4px 2px 4px; margin: 2px 2px 2px 2px; color: # 000000; border: 1px solid # 333; background - color: # FFFFFF; "class =" showpage "> Side" + thisNum + 'i' + (postNum-1) + ": </ span>" + html;

    if(thisNum<(postNum-1)){ if (thisNum <(postNum-1)) (
    html += downPageHtml; html + = downPageHtml;
    html += ‘<span class=”showpage”><a href=”‘+htmlMap[htmlMap.length-1]+’”> ‘+endPageWord+’</a></span>’; html + = '<span class="showpage"> <a href="'+htmlMap[htmlMap.length-1]+'">' + endPageWord + "</ a> </ span> ';
    } )

    if(postNum==1) postNum++; if (postNum == 1) postNum + +;
    html += ‘</div>’; html + = '</ div>';

    if(isPage || isFirstPage || isLablePage){ if (isPage | | isFirstPage | | isLablePage) (
    var pageArea = document.getElementsByName(”pageArea”); var pageArea = document.getElementsByName ( "pageArea");
    var blogPager = document.getElementById(”blog-pager”); var blogPager = document.getElementById ( "blogg-personsøker");

    if(postNum <= 2){ if (postNum <= 2) (
    html =”; html = ";
    } )

    for(var p =0;p< pageArea.length;p++){ for (var p = 0; p <pageArea.length; p + +) (
    pageArea[p].innerHTML = html; pageArea [p]. innerHTML = html;
    } )

    if(pageArea&&pageArea.length>0){ if (pageArea & & pageArea.length> 0) (
    html =”; html = ";
    } )

    if(blogPager){ if (blogPager) (
    blogPager.innerHTML = html; blogPager.innerHTML = html;
    } )
    } )

    } )
    </script> </ script>

    <script src=”/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999″ type=”text/javascript”></script> <script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"> </ script>

  7. Click Save button. Klikk Lagre-knappen.
  8. Drag and drop the newly added HTML/JavaScript gadget to directly right below the Blog Posts element. Dra og slipp som nylig er lagt til HTML / JavaScript gadget til direkte rett under Blogginnlegg element. Location of Page Navigation Gadget
  9. Click on Save button to make the change effective. Klikk på Lagre-knappen for å gjøre endringen effektive.

For user who don’t want to use the Page Element widget or gadget, it’s possible to manually editing the HTML file, although it’s more difficult to do and should only be tried by blogger with technical expertise. For brukere som ikke ønsker å bruke sideelement widget eller gadget, er det mulig å manuelt redigere HTML-filen, men det er vanskeligere å gjøre og bør bare prøvd av bloggere med teknisk ekspertise.

  1. Login to Pålogging til Blogger account Dashboard . konto Dashboard.
  2. Click on the Layout link for the blog that you want to modify (if you’re viewing the blog and logged in to Blogger or Google Account, just click on Customize on the Next Blog toolbar. Klikk på Layout-koblingen for den bloggen du vil endre (hvis du ser på bloggen og logget inn på Blogger-eller Google-konto, klikk på Tilpass på Neste blogg verktøylinjen.
  3. Go to Edit HTML tab (there is no need to expand widget templates). Gå til Rediger HTML-kategorien (det er ikke nødvendig å utvide widget-maler).
  4. Search for the following line: ]]></b:skin> Søk etter følgende linje: ]]></b:skin>
  5. Copy the following CSS code and paste or append the code above the line: Kopier følgende CSS-koden og lime eller føye til koden ovenfor linjen:

    .showpageArea {
    padding: 0 2px;margin-bottom:10px;margin-top:10px;
    }

    .showpageArea a {
    border: 1px solid #505050;
    color: #000000;font-weight:normal;
    padding: 3px 6px !important;
    padding: 1px 4px ;margin:0px 4px;
    text-decoration: none;
    }

    .showpageArea a:hover {
    font-size:11px;
    border: 1px solid #333;
    color: #000000;
    background-color: #FFFFFF;
    }

    .showpageNum a {
    border: 1px solid #505050;
    color: #000000;font-weight:normal;
    padding: 3px 6px !important;
    padding: 1px 4px ;margin:0px 4px;
    text-decoration: none;
    }

    .showpageNum a:hover {
    font-size:11px;
    border: 1px solid #333;
    color: #000000;
    background-color: #FFFFFF;
    }

    .showpagePoint {
    font-size:11px;
    padding: 2px 4px 2px 4px;
    margin: 2px;
    font-weight: bold;
    border: 1px solid #333;
    color: #fff;
    background-color: #000000;
    }

    .showpage a:hover {
    font-size:11px;
    border: 1px solid #333;
    color: #000000;
    background-color: #FFFFFF;
    }

    .showpageNum a:link,.showpage a:link {
    font-size:11px;
    padding: 2px 4px 2px 4px;
    margin: 2px;
    text-decoration: none;
    border: 1px solid #0066cc;
    color: #0066cc;
    background-color: #FFFFFF;
    }

    .showpageNum a:hover {
    font-size:11px;
    border: 1px solid #333;
    color: #000000;
    background-color: #FFFFFF;
    }

  6. Next, search for the following line of code in the template’s HTML code: Deretter søker du etter følgende kode i malen HTML-kode:

    <b:section class='main' id='main' showaddelement='no'>
    <b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
    </b:section>

    Note: The ‘no’ after “showaddelement” can be ‘yes’ for some bloggers. Merk: "Nei" etter "showaddelement" kan være "ja" for enkelte bloggere.

  7. Add and append the following JavaScript code right after the </b:section> line: Legg til og føyer til følgende JavaScript-koden rett etter </ b: delen> linje:

    &lt;script type=&quot;text/javascript&quot;&gt; <script type="text/javascript">

    function showpageCount(json) { funksjon showpageCount (json) (
    var thisUrl = location.href; var thisUrl = location.href;
    var htmlMap = new Array(); var htmlMap = new Array ();
    var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==&quot;.blogspot.com/&quot;; var isFirstPage = thisUrl.substring (thisUrl.length-14, thisUrl.length )==". blogspot.com / ";
    var isLablePage = thisUrl.indexOf(&quot;/search/label/&quot;)!=-1; var isLablePage = thisUrl.indexOf ( "/ search / etikett /")!=- 1;
    var isPage = thisUrl.indexOf(&quot;/search?updated&quot;)!=-1; var isPage = thisUrl.indexOf ( "/ search? oppdatert ")!=- 1;
    var thisLable = isLablePage ? var thisLable = isLablePage? thisUrl.substr(thisUrl.indexOf(&quot;/search/label/&quot;)+14,thisUrl.length) : &quot;&quot;; thisUrl.substr (thisUrl.indexOf ( "/ search / etikett /") 14, thisUrl.length): "";
    thisLable = thisLable.indexOf(&quot;?&quot;)!=-1 ? thisLable = thisLable.indexOf ("?")!=- 1? thisLable.substr(0,thisLable.indexOf(&quot;?&quot;)) : thisLable; thisLable.substr (0, thisLable.indexOf ("?")): thisLable;
    var thisNum = 1; var thisNum = 1;
    var postNum=1; var postNum = 1;
    var itemCount = 0; var itemCount = 0;
    var fFlag = 0; var fFlag = 0;
    var eFlag = 0; var eFlag = 0;
    var html= &#39;&#39;; var html ='';
    var upPageHtml =&#39;&#39;; var upPageHtml ='';
    var downPageHtml =&#39;&#39;; var downPageHtml ='';

    var pageCount=5; var pageCount = 5;
    var displayPageNum=3; var displayPageNum = 3;
    var firstPageWord = &#39;First&#39;; var firstPageWord = 'Første';
    var endPageWord = &#39;Last&#39;; var endPageWord = 'Siste';
    var upPageWord =&#39;Previous&#39;; var upPageWord = 'Forrige';
    var downPageWord =&#39;Next&#39;; var downPageWord = 'Neste';

    var labelHtml = &#39;&lt;span class=&quot;showpageNum&quot;&gt;&lt;a href=&quot;/search/label/&#39;+thisLable+&#39;?&amp;max-results=&#39;+pageCount+&#39;&quot;&gt;&#39;; var labelHtml = '<span class="showpageNum"> <a href = "/ search / etikett /' + thisLable + '? & max-resultater = & # 39; + pageCount +'">';

    for(var i=0, post; post = json.feed.entry[i]; i++) { for (var i = 0, post; post = json.feed.entry [i]; i + +) (
    var timestamp = post.published.$t.substr(0,10); var tidsstempel = post.published. $ t.substr (0,10);
    var title = post.title.$t; var title = post.title. $ t;
    if(isLablePage){ if (isLablePage) (
    if(title!=&#39;&#39;){ if (tittel !=''){
    if(post.category){ if (post.category) (
    for(var c=0, post_category; post_category = post.category[c]; c++) { for (var c = 0, post_category; post_category = post.category [c]; c + +) (
    if(encodeURIComponent(post_category.term)==thisLable){ if (encodeURIComponent (post_category.term) == thisLable) (
    if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){ if (itemCount == 0 | | (itemCount% pageCount == (pageCount-1))) (
    if(thisUrl.indexOf(timestamp)!=-1 ){ if (thisUrl.indexOf (tidsstempel)! =- 1) (
    thisNum = postNum; thisNum = postNum;
    } )

    postNum++; postNum + +;
    htmlMap[htmlMap.length] = &#39;/search/label/&#39;+thisLable+&#39;?updated-max=&#39;+timestamp+&#39;T00%3A00%3A00%2B08%3A00&amp;max-results=&#39;+pageCount; htmlMap [htmlMap.length] = "/ search / etikett / '+ thisLable +'? oppdatert-maks = '+ tidsstempel +' t00% 3A00% 3A00% 2B08 % 3A00 & max-resultater = '+ pageCount;
    } )
    } )
    } )
    }//end if(post.category){ ) / / end if (post.category) (

    itemCount++; itemCount + +;
    } )

    }else{ ) else (
    if(title!=&#39;&#39;){ if (tittel !=''){
    if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){ if (itemCount == 0 | | (itemCount% pageCount == (pageCount-1))) (
    if(thisUrl.indexOf(timestamp)!=-1 ){ if (thisUrl.indexOf (tidsstempel)! =- 1) (
    thisNum = postNum; thisNum = postNum;
    } )

    if(title!=&#39;&#39;) postNum++; if (tittel !='') postNum + +;
    htmlMap[htmlMap.length] = &#39;/search?updated-max=&#39;+timestamp+&#39;T00%3A00%3A00%2B08%3A00&amp;max-results=&#39;+pageCount; htmlMap [htmlMap.length] = "/ search? oppdatert-maks = '+ tidsstempel +' t00% 3A00% 3A00% 2B08% 3A00 & max-resultater = '+ pageCount;
    } )
    } )
    itemCount++; itemCount + +;
    } )
    } )

    for(var p =0;p&lt; htmlMap.length;p++){ for (var p = 0; p <htmlMap.length; p + +) (
    if(p&gt;=(thisNum-displayPageNum-1) &amp;&amp; p&lt;(thisNum+displayPageNum)){ if (p> = (thisNum-displayPageNum-1) & & p <(thisNum + displayPageNum)) (
    if(fFlag ==0 &amp;&amp; p == thisNum-2){ if (fFlag == 0 & & p == thisNum-2) (
    if(thisNum==2){ if (thisNum == 2) (
    if(isLablePage){ if (isLablePage) (
    upPageHtml = labelHtml + upPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;; upPageHtml = labelHtml + upPageWord + "</ a> </ span> ';
    }else{ ) else (
    upPageHtml = &#39;&lt;span class=&quot;showpage&quot;&gt;&lt;a href=&quot;/&quot;&gt;&#39;+ upPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;; upPageHtml = '<span class="showpage"> <a href="/">' + upPageWord + "</ a> </ span> ';
    } )
    }else{ ) else (
    upPageHtml = &#39;&lt;span class=&quot;showpage&quot;&gt;&lt;a href=&quot;&#39;+htmlMap[p]+&#39;&quot;&gt;&#39;+ upPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;; upPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">' + upPageWord + & # 39; </ a> </ span> ';
    } )

    fFlag++; fFlag + +;
    } )

    if(p==(thisNum-1)){ if (p == (thisNum-1)) (
    html += &#39;&amp;nbsp;&lt;span class=&quot;showpagePoint&quot;&gt;&lt;u&gt;&#39;+thisNum+&#39;&lt;/u&gt;&lt;/span&gt;&#39;; html + = '<span class="showpagePoint"> <u>' + thisNum + "</ u> </ span>" ;;
    }else{ ) else (
    if(p==0){ if (p == 0) (
    if(isLablePage){ if (isLablePage) (
    html = labelHtml+&#39;1&lt;/a&gt;&lt;/span&gt;&#39;; html = labelHtml +'1 </ a> </ span> ';
    }else{ ) else (
    html += &#39;&lt;span class=&quot;showpageNum&quot;&gt;&lt;a href=&quot;/&quot;&gt;1&lt;/a&gt;&lt;/span&gt;&#39;; html + = '<span class="showpageNum"> <a href="/"> 1 </ a> </ span>';
    } )
    }else{ ) else (
    html += &#39;&lt;span class=&quot;showpageNum&quot;&gt;&lt;a href=&quot;&#39;+htmlMap[p]+&#39;&quot;&gt;&#39;+ (p+1) +&#39; &lt;/a&gt;&lt;/span&gt;&#39;; html + = '<span class="showpageNum"> <a href="'+htmlMap[p]+'">' + (p +1) + "</ A> </ span> ';
    } )
    } )

    if(eFlag ==0 &amp;&amp; p == thisNum){ if (eFlag == 0 & & p == thisNum) (
    downPageHtml = &#39;&lt;span class=&quot;showpage&quot;&gt; &lt;a href=&quot;&#39;+htmlMap[p]+&#39;&quot;&gt;&#39;+ downPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;; downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">' + downPageWord + & # 39; </ a> </ span> ';
    eFlag++; eFlag + +;
    } )
    }//end if(p&gt;=(thisNum-displayPageNum-1) &amp;&amp; p&lt;(thisNum+displayPageNum)){ ) / / end if (p> = (thisNum-displayPageNum-1) & & p <(thisNum + displayPageNum)) (
    }//end for(var p =0;p&lt; htmlMap.length;p++){ ) / / end for (var p = 0; p <htmlMap.length; p + +) (

    if(thisNum&gt;1){ if (thisNum> 1) (
    if(!isLablePage){ if (! isLablePage) (
    html = &#39;&lt;span class=&quot;showpage&quot;&gt;&lt;a href=&quot;/&quot;&gt;&#39;+ firstPageWord +&#39; &lt;/a&gt;&lt;/span&gt;&#39;+upPageHtml+&#39; &#39;+html +&#39; &#39;; html = '<span class="showpage"> <a href="/">' + firstPageWord + "</ a> </ span> "+ UpPageHtml + '' + html + '';
    }else{ ) else (
    html = &#39;&#39;+labelHtml + firstPageWord +&#39; &lt;/a&gt;&lt;/span&gt;&#39;+upPageHtml+&#39; &#39;+html +&#39; &#39;; html =''+ labelHtml + firstPageWord + "</ a> </ span>" + upPageHtml + '' + html + ' ; ';
    } )
    } )

    html = &#39;&lt;div class=&quot;showpageArea&quot;&gt;&lt;span style=&quot;font-size:11px;padding: 2px 4px 2px 4px;margin: 2px 2px 2px 2px;color: #000000;border: 1px solid #333; background-color: #FFFFFF;&quot; class=&quot;showpage&quot;&gt;Page &#39;+thisNum+&#39; of &#39;+(postNum-1)+&#39;: &lt;/span&gt;&#39;+html; html = '<div class="showpageArea"> <span style = "font-size: 11px; padding: 2px 4px 2px 4px; margin: 2px 2px 2px 2px; color: # 000000; grensen : 1px solid # 333; background-color: # FFFFFF; "class =" showpage "> Side" + thisNum + 'i' + (postNum-1) + ' ;: </ Span> "+ html;

    if(thisNum&lt;(postNum-1)){ if (thisNum <(postNum-1)) (
    html += downPageHtml; html + = downPageHtml;
    html += &#39;&lt;span class=&quot;showpage&quot;&gt;&lt;a href=&quot;&#39;+htmlMap[htmlMap.length-1]+&#39;&quot;&gt; &#39;+endPageWord+&#39;&lt;/a&gt;&lt;/span&gt;&#39;; html + = '<span class="showpage"> <a href="'+htmlMap[htmlMap.length-1]+'">' ; + endPageWord + "</ a> </ span> ';
    } )

    if(postNum==1) postNum++; if (postNum == 1) postNum + +;
    html += &#39;&lt;/div&gt;&#39;; html + = '</ div>';

    if(isPage || isFirstPage || isLablePage){ if (isPage | | isFirstPage | | isLablePage) (
    var pageArea = document.getElementsByName(&quot;pageArea&quot;); var pageArea = document.getElementsByName ( "pageArea");
    var blogPager = document.getElementById(&quot;blog-pager&quot;); var blogPager = document.getElementById ( "blogg-personsøker");

    if(postNum &lt;= 2){ if (postNum <= 2) (
    html =&#39;&#39;; html ='';
    } )

    for(var p =0;p&lt; pageArea.length;p++){ for (var p = 0; p <pageArea.length; p + +) (
    pageArea[p].innerHTML = html; pageArea [p]. innerHTML = html;
    } )

    if(pageArea&amp;&amp;pageArea.length&gt;0){ if (pageArea & & pageArea.length> 0) (
    html =&#39;&#39;; html ='';
    } )

    if(blogPager){ if (blogPager) (
    blogPager.innerHTML = html; blogPager.innerHTML = html;
    } )
    } )

    } )
    &lt;/script&gt; </ script>

    &lt;script src=&quot;/feeds/posts/summary?alt=json-in-script&amp;callback=showpageCount&amp;max-results=99999&quot; type=&quot;text/javascript&quot;&gt;&lt;/script&gt; <script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"> </ script>

  8. Click on Preview button to ensure that no code error been found. Klikk på Forhåndsvisning for å sikre at ingen koden feil er funnet. No effect on the navigation hack can be seen though. Ingen effekt på navigeringen skår ses om.
  9. Click on Save Template to save the change. Klikk på Lagre mal for å lagre endringen.

Customization and Modification Tilpassing og modifikasjon

  1. For user who is not using blogspot.com domain (using self-hosted domain name), modify the .blogspot.com and 14 (13 characters of domain name + 1) in the line of var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==&quot;.blogspot.com/&quot;; accordingly. For brukere som ikke bruker blogspot.com domene (ved hjelp av selvtillit vert domenenavnet), modifisere. Blogspot.com og 14 (13 tegn i domenenavnet + 1) i linje med var isFirstPage = thisUrl.substring (thisUrl.length -14, ThisUrl.length )==". blogspot.com / "; tilsvarende.
  2. The value in the line of var pageCount =5; determines the number of posts to be shown on each page. Verdien på linje med var pageCount = 5; bestemmer antall poster som skal vises på hver side.
  3. The value in the line of var displayPageNum = 3; defines the number of page links in the navigation bar to be displayed (eg 1 - 2 - 3). Verdien på linje med var displayPageNum = 3; definerer antallet siden koblinger i navigasjonsfeltet skal vises (f.eks 1 - 2 - 3).
  4. User who knows CSS and Java Script can customize the code to their likings. Brukeren som vet CSS og Java Script kan tilpasse koden til sin likings.

Source 1 Kilde 1 and og Source 2 Kilde 2

IMPORTANT : This is a machine translated page which is provided "as is" without warranty. VIKTIG: Dette er en maskin oversatt side som er levert "som den er" uten garanti. Machine translation may be difficult to understand. Maskinen oversettelse kan være vanskelig å forstå. Please refer to Vennligst henvis til original English article original engelsk artikkel whenever possible. når det er mulig.

Share and contribute or get technical support and help at Dele og bidra eller få teknisk støtte og hjelp på My Digital Life Forums My Digital Life Forums .



9 Responses to “Add Page Number (with First and Last Page) Navigation Link for Blogger (Blogspot) with Gadget Element and Manual Hack” 9 Responses to "Legg til side Antall (med første og siste side) Navigation Link for Blogger (Blogspot) med Gadget Element og Manuell Hack"

  1. JK
    October 19th, 2008 10:14 19 oktober, 2008 10:14
    1

    Everything OK. Alt OK. But while trying this found some problems. Men mens du prøver dette funnet noen problemer. For example, when I click on ‘next’ page, some times it shows the same page, especially after 6th or 7th page. For eksempel, når jeg klikker på "neste" side, noen ganger viser den samme siden, spesielt etter 6te eller 7nde siden. I think it is because of the script used. Jeg synes det er på grunn av skriptet brukes. It is not as smooth as wordpress navigation - Jkwebtalks Det er ikke så myk som WordPress navigasjon - Jkwebtalks

  2. zigunawan
    October 23rd, 2008 09:43 23 oktober, 2008 09:43
    2

    my blogs is still in classic blogger, could this treat i used to my blog? mine blogger er fortsatt i klassisk Blogger, kan dette behandler jeg brukte til min blogg?

    And how to showing the page number on wordpress, the page number plugin just only support up to 2.5 version. Og hvordan du viser sidenummer på WordPress, siden mange programtillegg bare bare støtte for opptil 2.5-versjonen. is there any idea? er det noen ide? or just waiting for plugin the new version release? eller bare venter på programtillegg den nye versjonen utgivelse?

    thanks! takk!

  3. moonlightafridi
    November 13th, 2008 18:10 13 november, 2008 18:10
    3

    not working ……. ikke fungerer ... ....
    coz I did the same as u written above . coz jeg gjorde det samme som u skrevet ovenfor.
    but no page numbering could be shown . men ingen side nummerering kan bli vist.

  4. moonlightafridi
    November 13th, 2008 18:37 13 november, 2008 18:37
    4

    I’ve done now ……… Jeg har gjort nå ... ... ...
    page’s number are shown in my blog side nummer vises i bloggen min
    but How to arrange pages in my blog ? Men hvordan å ordne sidene i bloggen min?

  5. zigunawan
    November 15th, 2008 02:52 15 november, 2008 02:52
    5

    not work on my blogspot! ikke fungerer på min blogspot! may I wrong place the code? kan jeg feil sted koden?

  6. zigunawan
    November 15th, 2008 06:34 15 november, 2008 06:34
    6

    it’s work now on my Free cell phone theme Det er arbeidet nå på mitt Gratis mobiltelefon tema ! !
    but sometime, there,s an error like this men en gang, det er en feil som dette
    “No posts match your query.” "Ingen innlegg samsvarer med spørringen.
    is there any solution! er det noen løsning!

  7. lasse Lasse
    November 21st, 2008 04:23 21 november, 2008 04:23
    7

    This doesnt work at all for me. Dette doesn't fungere i det hele tatt for meg. Nothing changes at all. Ingenting endres i det hele tatt.

  8. Ravi
    November 22nd, 2008 05:49 22 november, 2008 05:49
    8

    Its not working for me, I copied the code above and I am using the new blogger. Dens ikke fungerer for meg, jeg kopierte koden ovenfor, og jeg bruker den nye Blogger. Could yoou please help me on this. Finner yoou kan du hjelpe meg på denne.

    Ravi

  9. Ravi
    November 23rd, 2008 19:21 23 november, 2008 19:21
    9

    It’sa Leora Ka Bal solution. Det er en Leora Ka Bal løsning.

Leave a Reply Legg igjen en Svar

You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> Du kan bruke disse kodene: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime = ""> <em> <i> <q Cite=""> <strike> <strong>

Subscribe to comments feature has been disabled. Abonner på kommentar-funksjonen er deaktivert. To receive notification of latest comments posted, subscribe to Å motta varsel om siste kommentarer postet, må du abonnere på My Digital Life Comments RSS feed My Digital Life Kommentarer RSS-feed or eller register to receive registrere deg for å motta new comments in daily email digest. nye kommentarer i de daglige e fordøye.
Custom Search

New Articles Nye artikler

Incoming Search Terms for the Article Innkommende søkeord for artikkelen

page navigation numbers blogger Page Navigation tall Blogger - --