PHP Includes for Non-Developers

By July 31, 2008 Wordpress

I usually will not write tutorials as there are many great ones available on any given topic; but this one I have not often seen, and would have loved to have known about it along time ago.

Any HTML/CSS web designer who doesn’t know PHP can certainly make good use of this PHP include statement. PHP includes are very useful for making global changes on smaller HTML/CSS websites, just as CSS is a tool to easily make global changes to styles and layouts.

code

Here is an example scenario: A client has a 30 page HTML/CSS website that they need built and do not want to mess with a content management system. This means that every time you need to make a change while building the site in a area such as the header, navigation, sidebar or footer you will need to update 30 pages; or if the client wants an item updated after the side is done you may need to update 30 pages.

Not fun.

PHP includes are useful with areas that are consistent through the entire website such as a header, navigation, sidebar, footer or any other area that is repeated.

The PHP include is put in place of, lets say, all of the code that makes up the navigation. This code is then placed into a single php file which the php include will reference. Then every time you need to update the navigation, you will simply need to make the changes in that single php file, and the site will update globally!

Put generically, what happens is the line of code that is the PHP include replaces the area in the HTML page that you want to be able to update. Here is the magic line of code:



This will make more sense with an example. Let say we just finished coding the HTML/CSS index page template that we are going to use for every page of a site.

HTML/CSS index template code:


 





    Your Page





    

Here is the body.

Lets start with changing the header into a PHP include statement. In the root directory of the site create a folder called ‘includes’. This is where we will put all of the individual files that get included organized. Take the code for the header out of the template and paste into a new file called ‘header.php’, save into the ‘includes’ folder. The replace the code in the template file that was the header with:



Repeat this for all areas you want as includes. If we continued on with this for the navigation, sidebar and footer we would end up with only the content area in the actual
index.html file:






	

Here is the body.

If your index page is a .html or .htm file you will need to save it as .php.

If you have 2 different versions of say, the header, then you just create a second header, call it ‘header2.php’ and reference that file on the pages that require the different header.

How this works is that the browser reads the include function, access the file and prints the HTML code in place of the php function. So if you were to view the source of the index.php page in the browser it would appear without any php and just the HTML

Some things to watch out for:

  • You will need to save all your HTMl pages as .php
  • If the site already exists and there are inbound links, or has SEO ranking, you will need to do a URL rewrite in the .htaccess file to redirect index.html to index.php (there are plenty of tutorial on .htaccess url rewrites)
  • The server will need to have php enabled

Now, you will obviously need to think about what items you want to place in a include and those that you dont. In the above example the title tags are part of the header include. For SEO and user interface purposes you would want each page to have their own. I personally leave the title tags in the original file.

I credit my college Trevor Sheridan for teaching me this little gem. I use it all of the time on smaller, non-CMS sites as they save tons of time building the site and after when the site needs updating.

Download source files here.

more info on includes

About Wordpress Sherpa

I am Sherpa. I heart mountains, permaculture, awareness, sustainability, local food, and Wordpress websites. I code, design, fix, update, migrate, host everything wordpress. Find me on Facebook or .

6 Comments

  • Lbug says:

    Thanks for that, I think my site is desperately in need of this – it’s a killer having to update every single page individually.

  • admin says:

    Glad to hear this helped Lbug!

  • David says:

    hi great article, i have a question though.. should i keep the meta description in every file along with the title tag or is it ok to put meta descriptions, tags and everything else in the header.php?

  • admin says:

    Depends – if the meta is identical for each page then you will want to keep it in the included file where the rest of your head tags are. If this info needs to be different for each page then no, you will need to leave the head tags on each of the pages. This also applies to page titles; if you want to have each page with a separate title you need to be sure the title tags are left on each page.

    Bret

  • David says:

    thanks for the fast response bret! im setting up a store for my cousins shop, there could be a good 100+ plus pages worth of products but im using romancart rather than complicated e-commerce software. i noticed you say its useful for “smaller html websites” however mine is going to end up large but i just want it to be easy to update the header area, sidebar and footer in one file as opposed to editing hundreds. you think this technique will work ok for this?

  • admin says:

    Hey David. The reason why I say it is better for smaller sites is that, in my opinion, larger sites (30+ pages) that you do not want to maintain should be built on some CMS platform. That is the only reason – the includes will work great on a 100+ page site if the client does not wish to implement a CMS.

    Cheers,
    B