• Web Design (WordPress, Joomla, etc.)

  Pagination without using a database or cms?

  Posted by Jessica Chapman on October 11, 2011 at 11:59 pm

  Hi guys!

  I’m having a hard time trying to get my head around the best way to have pagination on a static html website (with php includes). Unfortunately I don’t have enough time to learn how to use a database or cms for this website – it needs to finished soon for school. 🙁

  – There are 80 student profiles.

  – I am using the <?php include ‘example.php’?> command to load the header and footer in each student page.

  – Each student page has it’s own jquery slideshow, along with some written content.

  On each student page, I would like to have pagination. Similar to this approach would be really awesome:
  https://tympanus.net/codrops/2009/11/17/jpaginate-a-fancy-jquery-pagination-plugin/

  But really, I’m not fussed, just as long as I can have some numbers which link to each page through a script or something.

  Basically, I want an easier approach than having to manually link every button on each student profile page to go to the next/previous student pages.

  Does anyone have any ideas/suggestions how I could go about doing this?

  I would be so very very grateful for any help! 😀

  Demetri Tashie replied 14 years, 6 months ago 3 Members · 2 Replies
• 2 Replies

• 

  Curtis Thompson

  October 20, 2011 at 9:08 pm

  hello…

  any pagination will need to be aware of a start and end number to render itself – if you knew that or could render that in a separate page, you could do an iframe (not so glamorous) or a php include in the specific pages that shows the page controls and numbers….

  hard to give a more detailed suggestion w/o knowing more about your project…

  sitruc
• 

  Demetri Tashie

  November 19, 2011 at 4:04 am

  hi jessica,

  if this response is not too late, i have some suggestions. i don’t see why this can’t be done with a combination of php includes and javascript.

  it is hard to tell from your description if this is what you meant, but i would certainly consider the student’s pages being includes also. then through javascript you can have the button clicks load in a new, and correct, student page, as well as change the copy on the home page to take care of your ‘pagination’.

  you can see a real simple working example here

  the main html page just has 5 divs:
  a header and footer div which load in content via php includes
  there is a div to contain the ‘page number’/pagination information
  a div for the actual page content to load into via php includes,
  and a div for the buttons

  some pretty simple javascript in the header changes the contnet div and the page number div via innerHTML

  there are other ways, but i just made an array to hold all the page content incudes ( this would be your student page information)

  and just as Curtis suggests, there is a variable there which is used to keep track of/be aware of what page is laoding in/ what page number it is. then going to a next or previous student page would be easy.

  this is the javascript i used. i didn’t bother to put any limits on the button clicks to keep them from going beyond their bounds, and i only have 3 actual pages in the array – therefor you will see ‘undefined’ in the content area div for pages missing from the array.
  var i=1;

  var myArray= new Array();
  myArray[1]="<?include('main1.php');?>";
  myArray[2]="<?include('main2.php');?>";
  myArray[3]="<?include('main3.php');?>";

  function next()
  {
  ++i;
  document.getElementById("pageNum").innerHTML= "Page "+i+""
  document.getElementById("main").innerHTML= myArray[i];
  }

  function prev()
{
--i;
document.getElementById("pageNum").innerHTML= "Page "+i+""
document.getElementById("main").innerHTML= myArray[i];
}
  anyway, i hope this helps or gives you ideas opn how you can make it work for you. if you need anything exaplained, just ask.

Reply to this Discussion! Login or Sign Up