- Setting Up the Project 3:31
- Using PHP Code on Our Site 3:09
- A Simple PHP Example 1 objective
- Including the Header 5:32
- Including the Footer and Adding Additional Pages 3:19
- Basic PHP and Including Files 5 questions
- Using Variables for the Title Tag 3:24
- Working with _GET Variables 5:10
- Variables and Conditionals 6 questions
- Adding Active States to the Navigation 4:29
- Variables and Conditionals 3 objectives
Preview
Video Player
00:00
00:00
Adding Active States to the Navigation
4:29We can use conditionals and variables to make further changes to the HTML output on different pages. In this video, we’ll add a new variable and use a conditional to check its value in our main navigation menu.
Great job.
You've created a header and a footer,
0:00
used variables and conditionals to make
the site easier to build and maintain.
0:03
There is one final thing that we
want to add to our navigation.
0:07
We'll use conditionals again
in our header file and
0:10
get the appropriate link underlined.
0:13
Let's go into WorkSpaces and
take a look at header.php.
0:16
I've coded the CSS file to underline links
in the navigation with a particular class,
0:20
a class of on.
0:24
Adding the class to our navigation link
will make our links underlined, but
0:27
we can't just add this class in plain html
or the link would underline on every page.
0:30
Instead, we need to add it
with PHP in a conditional.
0:35
We need a variable that tells
us what section we're in.
0:39
If we're in the book section,
we can add the class to the books link.
0:43
Let's open up catalog.php and
create a variable for this.
0:46
Right after this line where we assign
page title, a value of full catalog,
0:51
we're going to add $section = null for
0:56
default, because by default, we're not
showing any of our specific categories,
1:03
we're just showing the full catalog, so
we don't need anything to be underlined.
1:09
Remember to use the single equals
sign here when assigning a value.
1:13
We also need to change that
variable in our conditional block.
1:17
In our book section let's add a variable
here and assign it a value of books.
1:21
And movies, we'll add it again
1:31
with the value of movies and
finally in music.
1:37
We'll add section again
with a value of music.
1:44
Back in our header.php file,
1:50
we can write a conditional to check
the value of the section variable.
1:53
Let me give you a word of caution.
1:57
It can get a little confusing
writing PHP code that
1:58
conditionally generates the piece of HTML.
2:01
In a case like this, I would recommend
adding the plain HTML that you want first,
2:03
before writing the PHP code.
2:09
So right now, we have on here.
2:12
So we're going to add our PHP code.
2:15
Open our php block, and we're going
to start by just echoing out, space, on,
2:17
in quotes and with a semicolon,
and close out our PHP.
2:25
Now we want to add our conditional.
2:32
So, we'll add if, $section, and we
2:34
want to make sure we use our double equal
sign because we're doing a comparison,
2:39
equals "books",
then we want to echo out our on.
2:44
Now let's copy all of this and
paste it into movies
2:55
and change this to movies,
paste it here and
3:02
change it to music and finally paste it
into suggest and change it to suggest.
3:08
The last one checks if the section
variable has a value of suggest.
3:16
Then we wanna mark this link as active.
3:20
Of course we also have to set that
variable on the suggest page,
3:23
so let's open suggest and let's assign the
variable right after our page title again.
3:25
$section equals suggest.
3:30
Great.
3:35
Now, even though we're not using underlining
in our navigation for the index page,
3:36
we need to add the variable there,
as well, to prevent errors.
3:40
So open index.php and
assign a value of null.
3:43
Index dot php, $section equals null.
3:47
Great, now let's save all of these pages.
3:53
Now we'll go into our browser and
refresh the page.
3:57
And we see that books is underlined.
4:00
We click movies, music and suggest.
4:03
And when we click on back to our
homepage nothing is underlined.
4:08
We're making some great
progress on our media library.
4:13
We have three different
web pages in place.
4:16
And we've learned about variables and
conditionals.
4:18
We'll spend some time on the catalog
itself in the next set of videos.
4:21
Populating some of the actual data and
playing with arrays.
4:25