The Method of Zblog to Realize Automatic Pagination of Long Articles

web front end ten thousand seven hundred and sixteen 12 years ago (2012-05-28)

This long article auto pagination provides two pagination methods:

First, according to the number of characters in the article, this number can be set by yourself, but there is a disadvantage, that is, if there is a picture on the page, it will be interrupted, and the content behind will not be displayed. The advantage is that it is convenient and suitable for lazy people;

Second, when writing an article, add the [Next=Page] pagination mark (remove the=sign) where pagination is required. Using this method, you can avoid interruptions caused by images. The disadvantage is that you need to add it manually zblog When writing an article, the paging flag inserted in the visual editing status is invalid. You must switch to the "source code" status to insert it. Those who work hard will have to work hard. Hehe

Let's talk about the next step:


1: Open with DW and other web editing software theme Find the following line of code in b_article-single.html in the template folder under the style folder:

 <#article/content#>

That is, the code that displays the content of the article. Change this code to the following code:

 <DIV id="article"></DIV>     <xml id="xmlArticle">          <Article>           <Info>            <Content>                 <! [CDATA[<#article/content#>]]>           </Content>           </Info>          </Article>      </xml> <script language="JavaScript" src="<#ZC_BLOG_HOST#>script/Autopage.js" type="text/javascript"></script>

Note: The following JS calls must be available, otherwise an error will be reported after the web page is opened, or the content cannot be displayed. (The call in the header has not been tried, and it seems that an error will be reported. Put it here to avoid affecting the opening speed of other pages)

2: Copy the following code, save it as Autopage.js, and upload it to the SCRIPT folder in the root directory of the website space (Other folders can also be used, but the above call path should also be adjusted accordingly)

Note: The coding mode of this JS code should be UTF8, otherwise it will appear Garbled code

 //Number of words displayed per page PageSize=5000;     //Paging mode flag=2;// 1: Auto pagination according to the number of words 2: pagination according to [NextPage] //Default Page startpage = 1;     //Navigation display style 0: general 1: direct 3: drop-down TopShowStyle = 1;     DownShowStyle = 0;     var currentSet,CutFlag,TotalByte,PageCount,key,tempText,tempPage;     key="";     currentSet=0;     var Text=xmlArticle.selectSingleNode("//Content").text;     TotalByte=Text.length;     if (flag==1)    {        PageCount=Math.round(TotalByte/PageSize);         if(parseFloat("0."+TotalByte%PageSize)>0){         if(parseFloat("0."+TotalByte%PageSize)<0.5){          PageCount=PageCount+1;           }        }        var PageNum=new Array(PageCount+1);         var PageTitle=new Array(PageCount+1);         PageNum[0]=0;         PageTitle[0]="";                var sDrv1,sDrv2,sDrv3,sDrv4,sFlag;         var sDrvL,sTemL;         var sTem1,sTem2,k;         sFlag=0;                for(j=1;j<PageCount+1;j++){         PageNum[j]=PageNum[j-1]+PageSize;          PageTitle[j]="";          //alert(j);          sDrv1="<br>";          sDrv2="<BR>";          sDrv3="<Br>";          sDrv4="<bR>";          sDrvL=sDrv1.length;          for(k=PageNum[j];k<=TotalByte;k++){          sTem1=Text.substring(PageNum[j]-sDrvL,k);           sTemL=sTem1.length;           sTem2=sTem1.substring(sTemL-sDrvL,sTemL)          if (sTem2==sDrv1 || sTem2==sDrv2 || sTem2==sDrv3 || sTem2==sDrv4)          {           sFlag=sFlag+1;            PageNum[j]=k;            break;           }         }         if (PageNum[j]>TotalByte)         {          break;          }        }        if (j<PageCount)        {         PageNum.length=j;          PageCount=j        }        if (PageCount>1&&sFlag>1&&PageCount<sFlag)        {         PageCount=sFlag+1;         }    }    else{    //Manual paging     var j,sFlag,PageCount,sText;         var sTitleFlag;         var PageNum=new Array();         var PageTitle=new Array();         PageSize=0;         j=1;         PageNum[0]=-10;         PageTitle[0]="";          sFlag=0;         sText=Text;         do        {         sText=Text.substring(PageNum[j-1]+10,TotalByte);          sFlag=sText.indexOf("[NextPage");         if (sText.substring(sFlag+9,sFlag+10)=="=")         {          sTitleFlag=sText.indexOf("]",sFlag);           PageTitle[j]=sText.substring(sFlag+10,sTitleFlag);          }         else{          PageTitle[j]="";          }         if (sFlag>0)         {          PageNum[j]=sFlag+PageNum[j-1]+10;          }         else{          PageNum[j]=TotalByte;          }         j+=1;         }        while (PageNum[j-1]<TotalByte);         PageCount=j-1;     }    function text_pagination(Page){        var Output,Byte;         if(Page==null){Page=1;}        Output="";        //Show body     if(Page==0) {    //Non pagination      tempText=Text;         }        else{    //Pagination      if (flag==1)    //Auto pagination      {          tempText=Text.substring(PageNum[Page-1],PageNum[Page]);           }         else{    //Manual paging       if (PageTitle[Page-1].length==0)          {           tempText=Text.substring(PageNum[Page-1]+10,PageNum[Page]);           }          else{           tempText=Text.substring(PageNum[Page-1]+11+PageTitle[Page-1].length,PageNum[Page]);           }         }        }          //Layout content           Output=Output+"<div id=world>";         Output=Output+tempText;         Output=Output+"</div>";         Output=Output+"<br>";         Output=Output+"<div align=center>";         Output=Output+Article_PageNav(DownShowStyle,Page);         Output=Output+"</div>";               article.innerHTML = Output;         if (Page>1)        {         document.location.href='#top';         }    }    function Article_PageNav(ShowStyle,Page){    //Paging code display function //Parameter is calling style, 0=simple style, 1=standard style     var temp="";         if (ShowStyle==0)    //Simple Style     {         tempPage=Page;          if(TotalByte>PageSize){           if (Page-4<=1){           temp=temp+"<font face=webdings color=#999999>9</font>";            if (Page<=1){temp=temp+"<font face=webdings color=#999999>7</font>";}else{temp=temp+"<a href=javascript:text_pagination("+(Page-1)+")><font face=webdings>7</font></a>";}           if (PageCount>10){            for(i=1;i<8;i++){             if (i==Page){              temp=temp+"<font color=red>"+i+"</font> ";              }else{              temp=temp+"<a href=javascript:text_pagination("+i+") >"+i+"</a>"+" ";              }            }           temp=temp+" ...";            }           else{            for(i=1;i<PageCount+1;i++){             if (i==Page){              temp=temp+"<font color=red>"+i+"</font> ";              }             else{              temp=temp+"<a href=javascript:text_pagination("+i+") >"+i+"</a>"+" ";              }            }           }           if (Page==PageCount){temp=temp+"<font face=webdings color=#999999>8</font>";}else{temp=temp+"<a href=javascript:text_pagination("+(Page+1)+")><font face=webdings>8</font></a>";}           if(PageCount<10){temp=temp+"<font face=webdings color=#999999>:</font>";}else{temp=temp+"<a href=javascript:text_pagination("+PageCount+")><font face=webdings>:</font></a>";}          }          else if(Page+4<=PageCount){          temp=temp+"<a href=javascript:text_pagination(1)><font face=webdings>9</font></a>";           temp=temp+"<a href=javascript:text_pagination("+(Page-1)+")><font face=webdings>7</font></a>";            if (PageCount>10){            temp=temp+"..";             for(i=Page-4;i<Page+4;i++){             if (i==Page){              temp=temp+"<font color=red>"+i+"</font> ";              }             else{             temp=temp+"<a href=javascript:text_pagination("+i+") >"+i+"</a>"+" ";              }            }            temp=temp+" ..";            }           else{            for(i=1;i<PageCount+1;i++){             if (i==Page){              temp=temp+"<font color=red>"+i+"</font> ";              }             else{             temp=temp+"<a href=javascript:text_pagination("+i+") >"+i+"</a>"+" ";              }         }        }        if (Page==PageCount){temp=temp+"<font face=webdings color=#999999>8</font>";}else{temp=temp+"<a href=javascript:text_pagination("+(Page+1)+")><font face=webdings>8</font></a>";}           temp=temp+"<a href=javascript:text_pagination("+PageCount+")><font face=webdings>:</font></a>";           }          else{           temp=temp+"<a href=javascript:text_pagination(1)><font face=webdings>9</font></a>";            temp=temp+"<a href=javascript:text_pagination("+(Page-1)+")><font face=webdings>7</font></a>";            temp=temp+".."          for(i=Page-2;i<PageCount+1;i++){            if (i==Page){             temp=temp+"<font color=red>"+i+"</font> ";             }            else{             temp=temp+"<a href=javascript:text_pagination("+i+") >"+i+"</a>"+" ";             }           }           if (Page==PageCount){temp=temp+"<font face=webdings color=#999999>8</font>";}else{temp=temp+"<a href=javascript:text_pagination("+(Page+1)+")><font face=webdings>8</font></a>";}           temp=temp+"<font face=webdings color=#999999>:</font>";           }         }         else{          temp=temp+"<font color=red>1</font> ";          }    Temp=temp+"<a href=javascript: text_pagination (0)>Show All</a>"     }        else if (ShowStyle==1)    //Standard Style     {    If (TotalByte>PageSize) {if (Page!=0) {if (Page!=1) {temp=temp+"<a href='# top' onclick=javascript: text_pagination ("+(Page-1)+")><font color=3366cc>[Previous]</font></a>";}}}      for (i=1;i<PageCount+1 ;i++ )         {          if (Page==i)          {           temp=temp+"<font color=800000>["+i+"]</font>  ";           }          else{           temp=temp+"<a href='#top' onclick=javascript:text_pagination("+i+")><font color=3366cc>["+i+"]</font></a>  ";           }         }         temp=temp+"<a name='foot'></a>";     If (TotalByte>PageSize) {if (Page!=0) {if (Page!=PageCount) {temp=temp+"<a href='# top' onclick=javascript: text_pagination ("+(Page+1)+")><font color=3366cc>[Next]</font></a>";}}} Temp=temp+"<a href=javascript: text_pagination (0)><font color=3366cc>Show All</font></a>"     }        else if (ShowStyle==2)    //Drop Down Menu Style     {         temp=temp+'<select>'         for (i=1;i<PageCount+1 ;i++ )         {          if (Page==i)          {    Temp=temp+"<option value='"+i+"' selected style='color: red '>Page"+i+"       }          else{    Temp=temp+"<option value='"+i+"'>Page"+i+";           }          if (PageTitle.length!=0)          {           temp=temp+':'+PageTitle;           }          temp=temp+"</option>";          }         temp=temp+"</select>";         }        return (temp);     }    //Default Page text_pagination(startpage);