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