recent news

A common practice when creating sites using PHP is to create a header.php file which contains the (guess what) header of the pages. That makes it easy to update the menu or the includes throughout the site very easily. However, for SEO purposes, it is desirable to have an individual title in each page. The problem is that the title tag is within the common header.

What can be done? Turns out that the solution is pretty easy.

Within your header.php use this for a title tag:

<title><?php echo $pageTitle; ?></title>

In individual pages set the pageTitle variable before including the header.php file:

<?php
$pageTitle = “my page’s title”;
include ‘header.php’; ?>

Your website probably has a menu. When you click on a menu item and navigate to that page you need that menu item to remain highlighted to indicate to the user where they are. In this post we’ll examine a couple of ways to do and to NOT do that.

Introduction:
To achieve this effect on your menu you need to define a css rule with the style you need. Then you need to apply this rule to the active menu item.

Let’s see an example. Suppose that this is your menu:

<ul>
<li><a href=”/”>HOME</a></li>
<li><a href=”page1.php”>Page1</a></li>
<li><a href=”page2.php”>Page2</a></li>
<li><a href=”page3.php”>Page3</a></li>
<li><a href=”page4.php”>Page4</a></li>
</ul>

You want to give your active menu item a blue background. You can use a css rule like this:

.active {
background-color:blue;
}

Then if you are in page2 above you can modify the code to style that menu item:

<li class=”active”><a href=”page2.php”>Page2</a></li>

However, this means that each page must have different html for the menu, since the active menu item must have the. What are your options here?

1) Put a different copy of the menu code in each page, adding the to the respective menu item as appropriate. Please DON’T ever do that. This makes it a nightmare to make even a slight change to the menu, to change eg the link of one menu item.

2) Use some php code which inserts the text on the page as appropriate, eg.

<li <?php if(strripos($_SERVER['REQUEST_URI'], “page2.php”) ) {echo “class=’active’”;} ?> ><a href=”page2.php”>Page2</a></li>

This is often the best approach.

3) Some times you may need to use some logic that requires more info than just the request uri. Maybe it’s the category a post belongs to in WordPress, which wouldn’t be available at the time the menu is included. For these cases there is a stronger weapon available. It’s called Javascript. Just insert this block in each page you need and use it to set the class you need on the elements that you need.
<script type=”text/javascript”>
var element = document.getElementById("page2");
element.className = element.className + ” active”;
</script>

This of course assumes that you’ve given the id “page2″ to an element in your menu:

<li id=”page2″><a href=”page2.php”>Page2</a></li>