Not a developer? Go to MovableType.com

MT5 Documentation

Paginating the Main Index Template

This chapter explains how to paginate the Main Index template. We will use static publishing for the first page and then use the MT-Search script to dynamically render pages 2 through n. In this way, we get the benefit of static publishing without increasing the rebuild time.

pagination.jpg

Getting and Storing Pagination Variables

Start your template by storing some information required for the pagination in some variables. Paste the snippet below into the head of the Main Index template:

 <$mt:SetVar name="per_page" value="5"$> 
 <$mt:BlogEntryCount setvar="total_entry_count"$> 
 <mt:SetVarBlock name="search_link"> 
   <$mt:CGIPath$><$mt:SearchScript$>?IncludeBlogs=<$mt:BlogID$> 
   &template_id=<$mt:BuildTemplateID$> 
   &limit=<$mt:Var name="per_page"$> 
   &archive_type=Index 
   &page= 
 </mt:SetVarBlock> 
 <$mt:GetVar name="search_link" strip="" trim="1" setvar="search_link"$>

This example creates a new page for every 5 entries. You can define your own number by changing the value of the variable "per_page". We save the total number of entries in the variable "totalentrycount" after first obtaining this number using the "MTBlogEntryCount" tag. The variable "search_link" is the URL of the search script. We left the "&page=" attribute blank so we can specify it later. The last line strips spaces and trims line breaks to create a valid URL.

Modifying the mt:Entries Tag

The search_results="1" attribute on the mt:Entries block tag indicates which mt:Entries block to use for the search.

 <mt:Entries limit="$per_page" search_results="1"> 
 <$mt:Include module="Entry Summary"$> 
 </mt:Entries>

Displaying the Pagination Navigation

pagination-chart.png

The following code will display the navigation for paginated contents. Create a template module called "Pagination", and put in the code snippet below.

 <mt:If name="total_entry_count" gt="$per_page"> 
   <div class="page-navigation"> 
   <mt:If name="search_results"> 
     <$mt:CurrentPage setvar="cur_page"$> 
     <mt:IfPreviousResults> 
       <span class="prev_page_link"><a href="<$mt:PreviousLink$>" rel="prev">&lt; Previous</a></span> 
     </mt:IfPreviousResults> 
     <mt:PagerBlock> 
       <mt:If name="__value__" eq="$cur_page"> 
         <span class="cur_page_no"><$mt:GetVar name="__value__"$></span> 
       <mt:Else> 
         <span class="page_no"><a href="<$mt:PagerLink$>"><$mt:GetVar name="__value__"$></a></span> 
       </mt:If> 
     </mt:PagerBlock> 
     <mt:IfMoreResults> 
       <span class="next_page_link"><a href="<$mt:NextLink$>" rel="next">Next &gt;</a></span> 
     </mt:IfMoreResults> 
   <mt:Else> 
     <$mt:GetVar name="total_entry_count" setvar="page_count"$> 
     <$mt:SetVar name="page_count" op="--"$> 
     <$mt:SetVar name="modulo" value="$page_count"$> 
     <$mt:SetVar name="modulo" op="%" value="$per_page"$>
     <$mt:SetVar name="page_count" op="-" value="$modulo"$> 
     <$mt:SetVar name="page_count" op="/" value="$per_page"$> 
     <$mt:SetVar name="page_count" op="++"$> 
     <mt:For var="page_no" from="1" to="$page_count"> 
       <mt:If name="__first__"> 
         <span class="cur_page_no">1</span> 
       <mt:Else> 
         <span class="page_no"><a href="<$mt:GetVar name="search_link"><$mt:GetVar name="page_no"$>"><$mt:GetVar name="page_no"$></a></span> 
       </mt:If> 
     </mt:For> 
     <span class="next_page_link"><a href="<$mt:GetVar name="search_link">2" rel="next">Next &gt;</a></span> 
   </mt:If> 
   </div> 
 </mt:If>

Let's examine what is going on here by stepping through this code in order to explain the pagination navigation:

The first mt:If conditional tag checks whether this blog has more entries (the value in the "total_entry_count" variable) than the number of entries to be displayed on an individual page (the value in the "per_page" variable). The navigation will not be displayed if the total_entry_count is smaller than the per_page value.

The next <mt:If name="search_results"> checks whether this page was processed dynamically by the mt-search.cgi script. The reason for using this conditional tag is that we have to use different template tags for the search CGI and the static Main Index.

 <mt:If name="search_results"> 
   PAGINATING TAGS for the MT-SEARCH SCRIPTS
 <mt:Else> 
   PAGINATING TAGS for the STATIC MAIN INDEX
 </mt:If>

The Pagination Navigation in the MT-Search Scripts

If the page is processed by the MT-Search scripts, the following steps will be executed in the example code.

  • Set the current page number to the "cur_page" variable,
  • Display a link to the previous page if the MTIfPreviousResults conditional is true,
  • Display a list of page numbers using the MTPagerBlock tag
  • Check whether the page number ( __value__ variable ) is the current page number (cur_page), and
    • If TRUE, wrap the number with a <spanclass="cur_page_no"></span>, and don't link to the page,
    • If FALSE, link to the page,
  • Display a link to the next page if the MTIfMoreResults conditional is true,

MTPagerBlock tag

In pages processed by the MT-Search script, we can use the "MTPagerBlock" tag to display paginated navigation. MTPagerBlock is an iterator tag that will iterate over each page of the paginated content. In each iteration, the variable "__value__" is set to the page number of the current page. Also, the "MTPagerLink" tag is set to the link for each page. The following example will display a paginated navigation in a page processed by the MT-Search script:

<mt:PagerBlock> 
  <a href="<$mt:PagerLink$>"><$mt:GetVar name="__value__"$></a> 
</mt:PagerBlock>

Displaying Previous/More Results

You can also display "Previous" and "Next" links in the navigation. Have a look at this example code:

 <mt:IfPreviousResults> 
   <a href="<$mt:PreviousLink$>">Previous</a> 
 </mt:IfPreviousResults> 
 <mt:IfNextResults> 
   <a href="<$mt:NextLink$>">Next</a> 
 </mt:IfNextResults>

mt:IfPreviousResults and mt:IfMoreResults are conditional tags that check whether the current search results have previous (or more) results. If they come up as TRUE, you can display "Previous" and "Next" links using the MTPreviousLink or MTNextLink tags.

Checking the Current Page

In a page proccessed by the MT-Search scripts, the "MTCurrentPage" tag is set to the the current page number. It is somewhat similar to the variable "__value__" in an mt:PagerBlock iteration, and it can be used to change the styling of the current page number in the pagination navigation.

 <$mt:CurrentPage setvar="cur_page"$> 
 <mt:PagerBlock> 
   <mt:If name="__value__" eq="$cur_page"> 
     TEMPLATES FOR THE CURRENT PAGE
   <mt:Else> 
     TEMPLATES FOR OTHER PAGES
   </mt:If> 
 </mt:PagerBlock>

Paginated Navigation in Static Pages

In this example we use static publishing for the first page. Since the "MTPagerBlock" tag can be used only in template code that is processed by the MT-Search script, we have to implement the pagination navigation for the static page in a different way. The mt:For tag is used here to create a loop to display the pagination. Examine the following code:

   <$mt:SetVar name="per_page" value="5"$> 
   <$mt:BlogEntryCount setvar="total_entry_count"$> 
   <mt:SetVarBlock name="search_link"> 
     <$mt:CGIPath$><$mt:SearchScript$>?IncludeBlogs=<$mt:BlogID$> 
     &template_id=<$mt:BuildTemplateID$> 
     &limit=<$mt:Var name="per_page"$> 
     &archive_type=Index 
     &page= 
   </mt:SetVarBlock> 
   <$mt:GetVar name="search_link" strip="" trim="1" setvar="search_link"$> 

   <$mt:GetVar name="total_entry_count" setvar="page_count"$> 
   <$mt:SetVar name="page_count" op="--"$> 
   <$mt:SetVar name="modulo" value="$page_count"$> 
   <$mt:SetVar name="modulo" op="%" value="$per_page"$>
   <$mt:SetVar name="page_count" op="-" value="$modulo"$> 
   <$mt:SetVar name="page_count" op="/" value="$per_page"$> 
   <$mt:SetVar name="page_count" op="++"$> 
   <mt:For var="page_no" from="1" to="$page_count"> 
     <mt:If name="__first__"> 
       <span class="cur_page_no">1</span> 
     <mt:Else> 
       <span class="page_no"><a href="<$mt:GetVar name="search_link"><$mt:GetVar name="page_no"$>"><$mt:GetVar name="page_no"$></a></span> 
     </mt:If> 
   </mt:For> 
   <span class="next_page_link"><a href="<$mt:GetVar name="search_link">2" rel="next">Next &gt;</a></span>

The following steps will be executed in the example code=

  • The "mt:BlogEntryCount" tag is used to assign the total number of entries to the variable "total_entry_count".
  • Next, we generate the URL of the MT-Search scripts that will be used to render pages 2 through N, and set it as a variable "search_link". Please refer to this page for the search parameters.
  • Next, variables are created called "page_count" and "modulo". These will be used to loop through the pages to paginate by the "per_page" variable.
  • In the final loop we then display the number and the link of each page.

Including This in Your Own Templates

Let's wrap up by including the pagination module in your Main Index template.

  1. First paste the variable snippet (explained in "Getting and Storing Pagination Variables") into the head of the Main Index template.
  2. Then create a new template module called "Pagination", and save the example code explained in "Displaying the Pagination Navigation".
  3. Finally, include the module in the Main Index Template.

    <$mt:Include module="Pagination"$>

You will now see the pagination appear at the bottom of the entries. You can also add the following CSS to make the navigation look neater.

 .page-navigation { 
     line-height : 2em; 
 } 
 .prev_page_link, .next_page_link, .page_no, .cur_page_no { 
     padding : 2px 4px; 
     border : 1px solid #cccccc; 
 } 
 .cur_page_no { 
     background-color : #666666; 
     color : #ffffff; 
 }

In the next chapter we will explain how to paginate the category archives and the comment list.

Acknowledgment

This document was originally written and contributed by Hajime Fujimoto, translated by Jun Kaneko, and edited by Maarten Schenk.

Back

3 Comments

michael webster

michael webster on November 24, 2010, 4:00 a.m. Reply

I used this and liked it.

A couple points about installing it.

  1. You need to add in your wrap-up the part about adding the modifying the mt:entry tag.

  2. I found that I had to keep consistent the number of entries as specified in the general settings and what I set the per page search result to, in 1.

  3. Not entirely sure where to put the CSS and the corresponding , I am guessing that you put them around ?

  4. If I have say 20 posts, but I only want 5 of them showing, with the previous and next button, how do I do that? Looking forward to the category archive pagination.

Thanks for this.

frederic@safea.fr

frederic@safea.fr on December 29, 2010, 2:39 a.m. Reply

Isn’t there an error on the last line pagination module template ?

2” seems to have not been invited

digimortal716

digimortal716 on March 3, 2011, 5:34 a.m. Reply

Has anyone figured out how to limit the amount of pagination links in the search result? This method is neat, but it isn’t particularly useful without a way to set a limit calls.

Leave a Comment