Introduction to PHP Include Files & Web Application Introduction

Hello, and welcome back to Educator.com's Introduction to PHP course.0000

Today's lesson is a very exciting lesson, because we are going to start working0004

on our mock store Web application that we had talked about in the introductory lesson.0007

In order to do that, we are also going to learn about the topic of include statements.0012

In today's lesson, we are going to talk about, as mentioned, include statements, something known as the include path,0019

and we are going to talk about the importance of code reuse, which is an extremely important topic,0025

something known as require statements, and then, as we often do, we are going to talk about coding conventions as it relates to include and require statements.0030

And then, finally, the exciting part is: we are going to get into our introduction to our web application.0040

What is an include statement? Well, essentially, an include statement is a statement in your PHP code that allows you0049

to include the contents of one PHP file within another.0057

The included file is often referred to as the included file.0061

Now, the included file is treated as PHP code, and it gets executed accordingly.0067

Any variables that you defined in your PHP code and in your main PHP script prior to an include statement are available in the include file.0077

And any variables that you defined in the included file are also available in the rest of the main PHP script, and we will see a little more of that in a second.0084

One thing to note is that, when PHP reaches an include statement, which looks like these two statements down here,0094

it goes and fetches that file, and it starts processing it.0102

When it processes it, it enters in HTML mode, just like it does when it starts beginning to process a PHP file.0106

It assumes that everything is not PHP code, so in order for you to include PHP code in an include file,0113

you have to properly delimit the code with the PHP opening and closing tags.0120

Now, in PHP, there are two syntaxes for the include statement.0126

The first one here doesn't make use of parentheses, and the second one here makes use of parentheses.0131

They both function the same exact way; in this course, we are going to be using the one without the parentheses.0140

Let's take a look at what we might use an include file for.0148

We have a page here called includeExample.html, and it's a simple HTML page with a content section.0151

What we can do is sort of subdivide this into a header section, a footer section, and a content section.0162

What we can do is take the beginning information, or the header section of the web page, and separate it out into a separate file.0171

In this case, it is called header.html;0181

what we have done is: we have taken the beginning of this file out, and we are going to place it in a separate file here.0184

Then, what we are also going to do is take out the footer section, the end section, of the web page,0191

and we are going to include it in a file called footer.html.0196

Now, what that is going to allow us to do is: if we rename includeExample.html to includeExample.php and make use of include statements,0200

we can get the same web page.0210

What we have done here is: we have a PHP file, and it starts off with the line include 'header.html'.0212

What that is going to do is: when it reaches this line of code, it is going to go out and find header.html and process this content,0219

just as if it were already in its file to begin with.0232

Then, after it finishes the inclusion, it is going to go ahead and continue processing this as just straight HTML, which it passes on to output.0234

And then, it is going to reach another PHP tag section with another include file.0244

And what that is going to do is go and include the footer.html file, which simply contains HTML.0249

So, PHP is going to process this file, and since it's just HTML, it is simply going to output it.0254

By the time we get to the end of the file, we have the same file as here before, except it's sort of spread out in different parts over three different files.0261

And what that allows us to do (which you will see): it allows us to create a template, in that we can simply...0272

for each page, we have it look like this, with this sort of template; and every page can have the same header and the same footer,0281

and all that differentiates one page from the next is the actual content.0288

What that means is that we can go ahead and change something in, let's say, the header file--for example, maybe we have a logo at the top of the page.0295

We can change that in just the one include file, and it is going to update all of the pages.0302

If we actually go and take a look at...this is lecture 8...includeExample.html, this is what the file looks like.0308

It has a simple Content Goes Here header.0318

And if we blow this up, this is what the source code looks like.0322

Now, if we go back and we look at includeExample.php, which is the one with the include statements,0328

what we should find is that it prints out the same HTML; and if we actually go and look at the source code, the source is the same, as well.0339

Here you can see...the only difference is that, in this one, I have changed the title to .php, because it's a different file name.0351

But basically, what has happened is: in this file, PHP has inserted the contents of header.html at the beginning.0359

It inserted the content that was in the main file, which was includeTest.php, and then it outputted the footer information contained in footer.html.0369

As you see, it has the desired effect of creating the same web page.0385

You may have noticed that, in the include statement, it is the include--0396

the statement begins with the word include, and then a file name specified in between quotes.0402

And what that does is: that tells PHP which file to include.0410

One thing to note is that the file name specified can also have an absolute or relative path preceding the file name.0416

What that does is: that tells PHP exactly where the file is located on your computer, or on your web server, so that it will know where to find the file.0428

Now, if the path is specified, PHP is going to go and look at the exact location you specify, whether it's through an absolute path or a relative path.0436

And if it can't find the file, it is going to issue a warning at that include statement; but then it is going to continue processing the rest of the file.0446

The other alternative is if a path is not specified...which...if we look at our example, we didn't specify a path; we just have the file name.0455

Because it resides in the same directory, we actually could have done ./, which means the current directory, and that would have been a relative path.0465

If a path is not specified, PHP searches for the file in locations specified by the include_path directive in php.ini.0478

We talked a little bit about the php.ini file in a previous lesson; basically, that is the main configuration file for PHP.0488

There is a directive in there called include_path, and it lists all of the directories,0496

when you use an include statement, that PHP should search--that Search should search to find the files it is looking for.0501

If it can't find the file in those directories specified by include_path, then it finally looks in the running script's current directory,0508

which is what happened in our case, and loads the file.0517

Now, if it can't find the file in any of those locations, it does the same thing as if a path were specified.0521

It is going to issue a warning that the file couldn't be found, and then it is going to continue to process the script.0527

So, as you can see here, we have just used the file name for our include; we used header.html.0536

What happened was: when PHP went to process this, because no path was specified, it went out;0550

it went to the include_path directive; it searched all of the directories in there for this file; and if it couldn't find it in there,0556

it looked in the current directory, which is where it was; it was hiding in the same directory as includeExample.php.0565

Code reuse--one of the great things about using include files is: it facilitates a programming concept known as code reuse, which is extremely important.0577

What that allows you to do is: it allows you to place redundant and/or common HTML or PHP code in separate include files,0588

and then include them in as many pages as needed.0598

What that does is: that allows you to put the same content that is in maybe five different pages all in one file.0601

So, in order to update all of the different pages, you only update one file.0607

Now, that is great, because it increases your efficiency, because instead of...0611

Let's say you wanted to change maybe a link in the header section of a web page.0615

Instead of having to go up and manually update the HTML for maybe five different files, you simply update it in the include file.0620

And if the include file is included in all those pages, they automatically receive the update,0627

so it reduces the amount of time it takes to update your website.0633

The other advantage it has is that it is going to reduce the number of opportunities for errors to occur,0636

because, let's say, you have to go and update the link in five different files; that gives you five opportunities to maybe misspell...0642

maybe it's a really long link, so you might have five opportunities to misspell the link.0648

In our case, or in the case of using an include file, you only have to update it in one spot, so there is one chance for a mistake.0653

And also, if you do make a mistake, you only have to update it in that one file to change it.0659

Let's look at an example of how we can make use of code reuse to our advantage.0665

What we can do is: we have header.html, and this is the header.html file we were just using;0673

and let's say we want to include a style sheet to all the pages.0682

Let's say this was the header file for five different pages.0686

We have a style sheet that I have created called includeExample.css, which has one simple CSS directive in it.0691

And so, what we can do is go back to our include file...first, let's take a look again at what the page looks like; refresh it; it says Content Goes Here.0698

When we apply the CSS to it, it should turn red.0710

If we go ahead and include the CSS file, and we save it, now when we go to view the page again, we can see that it turns red.0714

And if you look at the page source, we can see that that link tag was added to the header of our page.0745

Now, this would be great if, let's say, we had a hundred different pages in our website,0752

and we wanted to add a style sheet to be used for all of them.0757

We simply would (let's blow this up a little bit, so you can see it) add this one line to our include file, and it's going to go ahead and update all of our pages.0760

That is the benefit of code reuse.0770

Now, there is an analog to the include statement known as the require statement.0777

Require statements work exactly as the include statement does.0781

It takes the contents of the file that's specified and includes it and processes it in the current script.0784

The only difference is that, if it cannot find the file, a fatal error occurs that halts the execution of the script0791

wherever the require statement that caused the error happened.0801

And so, that is different from the include statement in that the include statement will issue a warning, but it will continue processing the script.0805

Require statements have two forms as well, and they both look the same as the include statement.0813

One is with parentheses; one is without; and it's the same format you use to require...the require statement,0819

and then, you simply include the file name that you want to have included.0826

There is a lot of debate in the PHP community as to when to use the require statement versus an include statement.0833

Some say that any file that is absolutely necessary for your web application to run--0839

you should use a require statement, because your application should fail if it doesn't have the necessary parts.0844

On the other hand, with an include statement, because it doesn't have a fatal error that halts the execution of the script,0851

there are ways in PHP that we'll learn about later where you can handle the errors, so you can do a more graceful exit,0860

instead of just having a fatal error message appear on your screen.0864

That is actually the convention that I prefer to use--the include statement rather than the require--0868

because it allows you, if an error does occur, if you can't find the include file,0874

to put out a message that says "We are having trouble with the website right now," as opposed to a very terse PHP message.0880

Let's go back and take a look at our file.0888

Let's say, for example, in includeExample.php, we misspell the name of the header file to include.0893

So, if we go and reload this file, we can see that we get a warning.0900

It is basically saying that it couldn't find the file we tried to include, which was called header1.html.0908

But as you can see, it went ahead and it processed the content and continued to process the script and output the content in the footer.0915

So, if we look at the source, we can see that this up here...these first couple of lines are HTML generated by PHP, describing the error.0921

But then, you can see that the content section was output, as well as everything that was in footer.html.0934

Now, on the other hand, if we were to go back to this file and we were to use a require statement instead0940

(and again, we are going to have header1.html as the file, which is an incorrect file--it's not the real file name--so it's going to cause an error),0951

and we go back and browse the page now, all we get is a fatal error.0958

If you notice, the rest of the file does not get processed; the content does not show, and the footer does not show.0963

So, all we have in our source is the PHP error message.0969

And so, what that does is: it doesn't allow you to be able to handle the error and maybe output something that looks a little nicer0976

than this very terse error that would be confusing to the user.0985

As always, we talk about coding conventions as they relate to the different things we learn about in a particular lesson.0995

In this course, we are going to have different kinds of include files.1002

We are going to have files that might only include HTML, files that are just PHP code, and files that contain a mixture of both.1005

The convention we are going to use in this course is: any include file that just has HTML is going to have an HTML extension.1014

And, as you can see in our include files, they were all HTML, and so we had the .html extension.1023

If a file contains only PHP code, it is going to have a .php extension.1031

And if it contains a mixture of HTML and PHP, it is going to have a .phtml extension.1040

And basically, this is just a convention that makes it easier to understand, when you see an include file, what is actually contained in the include file.1045

For example, if it has a .php or a .phtml extension on it, we know that there is executable PHP code in there.1054

So, if we are getting an error in our application, we can know to look in those files to possibly find out the source of an error,1063

whereas, if it's just an include file with .html, assuming we follow the convention of only including HTML in our .html include files,1069

we know that we don't have to look there for PHP errors.1078

The other thing that we use in this course is: we always use the non-parentheses version of both the include and require statements.1083

Taking a look at how you can use the .phtml and .php extensions for include files...I created a file called header.php,1090

which outputs the same HTML as included in the original header.html, except it does so using echo statements.1103

If we go back to our includeExample.php file, and instead of having header.html, we put header.php (I'll change this back to include),1117

PHP is going to include this new header.php file, instead of the HTML file.1134

If we go back to our browser, and we browse includeExample.php, we can see, we get the content as expected.1140

And if we view the page source, we can see that it has both the header information that is in the new header.php,1147

the content in our main page, and then the content of the footer.html file.1154

Actually, let me blow that up a little bit for you.1159

This is the header.php output.1161

The other option is: we can use a .phtml file; I have created a header.phtml file to replace, again, header.html.1168

In this case, it is a combination of HTML code with some PHP code intermixed.1179

This is not a particularly useful example, but it's just to illustrate the point of having PHP intermingled with HTML in an include file.1185

It's just a simple echo statement that echoes the name of the file to include in the title tag.1193

If we go back to includeExample.php, change this to .phtml, and run the page (reload the page), you should get the same thing.1199

It turns out, we do; and if we go and look at the page source, everything is as expected,1210

with the header information now being drawn from header.phtml file, as opposed to header.html file.1216

Now, we are going to talk about what I think is the most exciting part of this lesson and the course--1233

the web application we introduced in our very first lesson.1239

It's a mock store web application, and today, we are going to start building up that web application.1243

We are going to make use of the include statement that we learned about today.1248

Basically, our web application that we are going to be building up--we are going to store it in the directory intro2php/web_app.1254

We are going to store it in that directory, which is under the document root.1265

This is different from storing it in lecture_8, for example, as we have been doing for the other code examples; we are going to keep it separate.1268

The other thing that we are going to do is: every time we update the web app, we are going to add1275

a new directory called version-x.x into this folder right here,1279

where x.x represents a new version number--a major and minor version number--something like 1.0, 2.0, 2.1.1287

When we do that, we are going to copy the entire contents of the whole previous version1297

into the new versions folder, and then update the files accordingly.1302

So, anything like images, CSS files--anything that would be common to all the different versions--we are still going to copy them over.1307

And the reason for that is: it makes it easier, as far as the directory structure.1316

We could actually have a common, for example, Images folder, and reference that in each of the different versions.1321

But for the sake of keeping things simple, we are going to re-copy everything each time we create a new version.1327

In version 1.0 for our app, it is just a simple HTML website; and we are going to show you that in a minute.1334

And then, what we are going to do is: we are going to use include statements to make the website template-based,1341

to take advantage of having HTML that is common to multiple pages on the website and placing it in one include file,1347

so when we make changes, we only have to make changes in one spot; and that is going to be version 2.0.1356

The other thing we are going to do is: in version 2.1, we are going to create a variable in each PHP page1363

that is going to allow us to add a custom title tag to each page.1373

Let's take a look at that.1379

I just want to open up the files for version 1.0; so let me close all these.1386

Before we get into the code for that, let's take a look at what it looks like.1401

We have a web app directory that we have created in the intro2php directory.1406

We go to version 1.0; and the main page for our web app is going to be called store.html, or eventually, store.php.1412

The reason it is not called index.php or index.html, which is the common case for the default file in the directory,1421

is because then we wouldn't get to see this directory listing right here, because Apache is configured by default in XAMPP1428

to automatically show index.html or index.php.1436

And because, for the purposes of teaching, we want to be able to individually access the different files--we want to be able to see this directory structure--1441

I have created the main file to be called something other than index.html--in this case, store.html.1448

We click on this; this is what our basic store looks like at first: Welcome to the Store Web Application!1455

And basically, it has a header section where, eventually, we will put a logo and some other things.1463

It has a content section, and it has a footer, which we commonly see in most websites, with a copyright statement and a link to the home page.1469

The store, in this case, sells a couple of different items; and right here, you can click on the different items that are available.1481

You will be able to see information about the item: you have the name, the item number, the price, an image about it, and a description.1488

And right now, in this basic version, we have just three products.1496

Now, if we go and look at the code for this, this whole website was just coded in pure HTML--just flat HTML.1505

So, every page--there is no PHP in any of the pages; they all have .html extensions.1516

All the links to the different pages are .html links, and this is what the entirety of the web pages look like.1522

Unfortunately, you can't see the whole page at once on this screen;1533

but when you are able to download the source code for this, you will be able to browse through the main file.1537

And what you will be able to see is that this is the store home page, and then each item, or each product in the store--1541

we have created a page called item- and then the item number; so for example, this one is called item-1001.html.1548

For each item, we have created their own HTML page.1558

What you can notice by looking at the website is that, when we go to the different item pages and the homepage,1565

a lot of what you see, is the same: the header is the same on all the pages; the footer is the same on all the pages.1575

So, we can make use of include files to help us out with that.1580

Now, we are going to look at version 2, which is going to use include files.1587

Let's load up the pages in our browser...and the PSPAD...and browse back to version 2.0.1597

And now, we can see that, in this case, because we are going to be using include files, each of the pages are going to be PHP pages.1613

And as you can see, we have a PHP page created for each item: item-1001, 2001, and 3001; and the main page is called store.php.1621

This website is going to look exactly the same as it did before; however, we are going to make use of include files.1633

What we can do is: if we go back and look at the new store.php page, we can see, at the very beginning here, we have an include statement.1642

And that is going to include a file called header.html, which basically is...1651

everything before the content section of the web page has been extracted into header.html.1657

And also, by the way, this is a relative link, and so we are storing all of our include files in a file called includes, and so, this is how we reference that.1665

Basically, it says that from the current directory, we go into the include folder and load header.html.1677

Now, if we look at header.html, this is simply the HTML that is common to the beginning of all of the pages in our website, placed in one file.1683

And as you can see, it ends where the content begins.1693

Likewise, you can see, at the bottom, we have an include statement that says include footer.html.1697

If we go and look at footer.html, it basically starts with the content...1705

it outputs all of the HTML from where the content ends, all the way to the closing HTML tag.1708

You can't see all of it on the screen at the same time,1716

but everything in between the first include statement and the footer include statement is the content of the page.1718

So, this is actually the content of our store homepage.1724

Now, we have done the same thing for each of the different items.1729

For example, item-1001.php--we include the same header file; we include the same footer file.1732

And then, we just have the HTML that outputs information about the product that we are going to be using--the product that the page is showing.1740

And we have that for each of the three different pages.1754

This is how we make use if include files so that, if we wanted to make one change to header.html, it would show up on all the different pages.1764

For example, right now we have this placeholder for store name--just a generic placeholder.1773

What we can do is: we can update the header.html file with the name of our store--we can give it some name of our choosing,1779

and it is going to update all of the different pages on our website.1786

That is an example of code reuse; so let's go to header.html, and this section--there is a table layout.1790

This website uses a table layout, and in the table with the ID header is where we have the store's name.1800

We are going to replace the placeholder "Store Name" with the name of the store; so for example, we are going to call it Educator.com store.1808

Then, we save it and go back and look at our web application and reload the page.1817

Now, we have updated the name of the store, and it is going to update the name on every single page.1823

So, as you can see, when we go to all the different pages, they all now have a newly-updated title.1831

Now, one thing that you may have noticed is that, in the header.html include file, in the title tag, it has Store WebApp as the title.1840

So, every page in our website right now that we go to--you can see up here--is titled Store WebApp.1850

In the beginning...at the tab at the top of your browser that shows the name of the page--right now, that outputs1857

what is in the title tag; they all say the same thing right now, which is OK for the first homepage--it makes sense--Store WebApp.1863

But for each additional page, we might want to have something where the name of the page is, for example, the name of the item.1869

Right now, because they all use the same header.html file, they all are going to have Store WebApp output as their title in the browser.1876

So, we are going to move on to the next version, where we are going to change that functionality (I'll close all these).1887

I'm going to load up the files from version 2.1, and let's take a look at what 2.1 is going to look like.1902

We go to version 2.1 and click on store.php; now, this name hasn't been changed, because we haven't updated it in this new version,1918

but we could update that, just as we have before.1927

And you can see, for the homepage, it says Store WebApp as the title of the page.1931

And now, for each of the individual product pages, it actually lists the product name as the title in your web browser.1937

And you may or may not be able to see that; but if you run the example at home, you will be able to see,1948

in the tab or at the top of your web browser, that each page has its own name that it has been given as a title.1952

We have the LCD Television title and the Baseball Bat title.1960

Now, how do we accomplish that? Well, let's look at, for example, item-1.php, which is the 100% cotton T-shirt.1966

What we can do is: at the beginning of the PHP file, before we include the header, we can define a variable called title,1978

which is what we will want to set as the title of the web page in the title tag.1990

Now, because the title tag is contained in our include file, we are going to have to have code within the include file1995

that is going to be able to take this variable, extract the title from it, and output it.2004

So, what that means is that our include file is going to have to change to a file that contains PHP code and HTML.2009

So, we are going to create a new header file called header.phtml, which means that it contains both PHP and HTML.2017

And, if we take a look at that, it turns out that the entire file is the same, except,2024

in the title tag, instead of having the name Store WebApp hard-coded into the title, we have a PHP echo statement2029

that simply echoes the output of the variable title, which we had set in the beginning of our script.2037

Now, one thing that is important here is that title has to be defined or declared before the include statement.2047

If we had defined it down here on this line instead, it is not going to work, because the include file won't know about it yet.2055

Because PHP processes things from the top to the bottom, when it reaches the include statement,2062

it only knows of variables that were declared previously in the file.2068

So, if we instead had moved it down here, the include file is not going to know about it.2072

And if we go back and look at our PHP page for the T-shirt, you will see that what it does is outputs an error as the title of the web page,2080

because PHP doesn't know about that variable; it says it's an undefined variable.2091

That is one thing that is very important: where you define the variable in your file.2096

And so, by using that, creating a title variable, before we go to the includeHeader.phtml statement,2105

we can create a custom title for each of our web pages.2113

If we look at item-2001, we can see, we have a 42'' LCD Television as the title; for item-3001, we use Baseball Bat.2115

And so, what that does is allows us to have, again, a custom title.2126

That ends what we are going to do with the web application today.2137

It is a first start, and we went from a basic plain HTML website to a template-based website, where we learned how to use code reuse,2141

and also were able to interact with some variables within the include files.2152

Now, I want to talk about the homework challenge for this lesson.2157

Basically, I am going to have you mimic some of the things that we did in the lesson today.2161

I'm going to have you create a web page containing both a header, a footer, and a content section.2167

Now, the header could be anything that you want--it could be a logo,2174

or it could be something at the top of the page that is the name of, let's say, your store that you are defining.2177

The footer can contain something like a copyright notice.2183

Create the file in the lecture_8 folder of intro2php.2186

And then, what I want you to do is do what we did here,2193

which is extract out the parts of the file that would be common to multiple web pages on that website.2195

So, the header--for example, the name of the store--would be common to all of the web pages.2202

You are going to extract that out to a file called header.html; you are going to extract out the footer content to footer.html.2206

And then, create a new PHP version of your web page that uses the include statements for the header.html and footer.html,2214

and has the content included in the middle.2223

And when you view the new PHP page in your web browser, you should be able to verify, if everything is done correctly,2226

that the HTML source code of the PHP generated by the PHP page is the same as that of your original .html web page.2234

Then, go ahead and create two other PHP web pages using the same format of2245

an include for the header, some content, and an include statement for the footer.2250

And then, what I want you to do is go ahead to the header file, header.html, and make a change--in this case, add a logo of some kind.2256

Using an image tag, you can add a logo; and when you make the change to header.html and you go ahead and view all of the other pages,2267

you should see that the logo updates on all of the different pages.2274

That demonstrates the importance of the code we use being in include files.2278

We are using the same code in multiple places, so we only have to update it in one spot.2284

Then, you should get a little experience with the differences between require and include.2289

I'm going to have you make the mistake of renaming the header file in one of your include statements,2294

so you can see the warning it generates, and you can see how it continues processing the file.2302

And then, we are going to have you change that include statement to a require statement2305

to see how that causes a fatal error that halts the execution of the script.2309

And you can see the difference between the two, and that is a way to sort of see them in action.2313

That ends today's lecture; thank you for watching Educator.com, and I look forward to seeing you next time.2318