Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.
Start a free Basic trial
to watch this video
Great, now we need to add pagination links so we can navigate between the pages. I want to add these links both above the results and below the results. But I don’t want to repeat the code, so I’m going to move this code into a variable called $pagination and move it up into the initial code block.
Example Code
$pagination = "<div class=\"pagination\">";
$pagination .= "Pages: ";
for ($i = 1;$i <= $total_pages;$i++) {
if ($i == $current_page) {
$pagination .= " <span>$i</span>";
} else {
$pagination .= " <a href='catalog.php?";
if (!empty($search)) {
$pagination .= "s=".urlencode(htmlspecialchars($search))."&";
} else if (!empty($section)) {
$pagination .= "cat=".$section."&";
}
$pagination .= "pg=$i'>$i</a>";
}
}
$pagination .= "</div>";
-
0:00
Back in the catalog.php file,
-
0:06
Directly before the unordered list, we're gonna add our pagination links.
-
0:10
We'll start with a new div.
-
0:11
We'll give this a class of pagination.
-
0:18
Then we'll add Pages, with a colon.
-
0:23
Next we need to add some code to show our pages and links.
-
0:26
We can use a while loop to create a count of numbers
-
0:29
that are less than the total number of pages.
-
0:32
Let's start by opening our php block.
-
0:41
First, we need an incremental variable.
-
0:44
Will name this i, we'll set it to zero initially.
-
0:49
Then we can do a while ($i < $total_pages) {.
-
1:03
Then we need to add one to i every time we loop.
-
1:08
We could use, I equals I plus one.
-
1:13
Or we could simplify this.
-
1:16
I plus equals one.
-
1:19
Or we can simplify this it even further.
-
1:24
I plus plus.
-
1:26
All of these options do the same thing.
-
1:29
The last one is the most common way of adding a single number to an integer, so
-
1:33
we use that.
-
1:35
Speaking of common practice, usually you'll see these three lines
-
1:38
combine into a single statement using for instead of while.
-
1:42
We'll move i = 0 into our for,
-
1:47
including the semi colon.
-
1:53
We then add i plus plus to the end separated by a semi colon.
-
2:01
We don't need a semi colon at the end.
-
2:04
The only difference in writing a statement this way
-
2:06
is that adding one to the i variable won't happen until the end of the loop.
-
2:11
So when working with the i variable within the loop,
-
2:14
our first loop through I will be equal to zero.
-
2:18
We want to start with page one.
-
2:21
So we'll change our initial value to one.
-
2:26
We also need to change our comparison.
-
2:29
We'll change it to less-then or equal-to total pages.
-
2:34
If i is less than or equal to our total pages, we want to enter our loop.
-
2:41
Now, what do we want to do in the loop?
-
2:42
Well, that depends on what page we're on.
-
2:45
So let's start with the conditional.
-
2:48
If i is equal to our current page,
-
2:56
then we just want to echo out i.
-
3:00
We'll surround this by a span tag.
-
3:06
We can leave our single variable right in our double quotes.
-
3:13
If it's not equal to our current page, then we want to link to that page.
-
3:18
So we're going to echo a link.
-
3:25
We're going to link to our catalog page but
-
3:28
we need to know if we're on a category page or not.
-
3:31
So add a conditional.
-
3:41
If it's set, then we want to make sure our link links to that category page.
-
3:54
And we finish with an ampersand.
-
3:57
Finally we'll add our page number.
-
4:02
Well use I for that and we'll close out our link.
-
4:06
We'll use I for the display again and are a tag.
-
4:09
A couple things to clean up, let's finish our if else statement.
-
4:16
And let's add a space at the beginning of our numbers, just so they're separated.
-
4:22
Now we're ready to check this out in our browser.
-
4:26
Great, now we see all the pages and we can navigate between those pages.
-
4:35
I want to add these links both above the results and below the results.
-
4:39
So let's go back to our page.
-
4:42
I don't want to repeat this code so let's add it to a variable name pagination.
-
4:53
We're gonna put this up in our initial php block.
-
5:06
Because there are quotes within this quote,
-
5:09
we need to escape them using our slash quote.
-
5:18
We'll use .= for concatenation.
-
5:24
We don't need our php tag here since we're already in our php block.
-
5:30
Let's also remove the closing tag here.
-
5:35
Instead of echo we're going to use pagination .=.
-
5:52
Add our final closing div and our pagination variable is ready to go.
-
6:01
We can clean this up a little here, and now let's display it where we want.
-
6:16
We want to echo pagination.
-
6:21
Above our on ordered list.
-
6:27
And also below, let's save this page and refresh our browser.
-
6:36
Great, our pagination links are above our results and below our results.
-
6:42
Fantastic job.
-
6:44
We've cleaned up our calls to the database so
-
6:46
that we're only pulling the information we need.
-
6:49
We've limited the number of results per page so
-
6:52
we don't overwhelm visitors to our catalog.
-
6:54
And we've set up linking between pages, both for our full catalog and for
-
6:59
our category pages.
-
7:01
You are ready for our final feature.
-
7:03
Search capabilities.
You need to sign up for Treehouse in order to download course files.
Sign up