Now, our next step is to turn this into several pages and get a website content started. And to do that, we are going to use a feature in Dreamweaver called “Templates”. With the template, I will be able to start up a web page with most of the work done and all I have to do is fill in the content that is specific to the page.
We can take any page we have developed and make into a template. In fact, we want to do exactly what we have done so far and that is layout a fairly generic page. We have got placeholder elements where we are going to adding our content.
I am actually ready to change that content to match the specifics of each page where are building. So, let us make our template by going up to the file menu and choosing “Save as template”.
The template is going to be associated directly with the site and since this is our first template, you can see that it says “No template so far”. I will just give the template a name and I will call it “Main Pages”.
We can also put whatever description we like and here I will just type base template. We will click save and then we have got a template. Now, it is going to move this template to a special folder called “Templates” within our site. So, it is already prompting us to update any links inside the pages, we will just click “Yes”.
You can see the template’s folder was created in our site. It now includes our main pages template and you can see that our document is changed to main pages with a DWT extension. That stands for Dreamweaver Template.
Now, we saved our template but there is one more thing we will need to do to set this template up properly and that is what we need to divide the content on a page into one or two categories.
The first category contains items that will be repeated on multiple pages in our website. Now, obviously this is going to include this like the logo, the branding at the top, a lot of the navigation system, and even the border elements.
The second category will be things that will change from page to page. These areas where the content varies, we are going to mark as editable areas inside the template. We will do that by selecting the content. I will just grab the placeholder content in the main section and up in the insert tab under the common header, we have a template section. If I pull that down, you will notice that we can use that to mark the editable region.
I will just click, it will ask us for a name for the region and I am going to call this one “Main Content”. I will click “OK” and you can see a little board up here around the content we have selected.
Now, I am going to do the same thing over our left content area. I will select the content and using the template, editable region feature, I will mark that as a second editable region. I will call that “Left Content”.
Now, I am going to try this out. So, everyone understands what these editable regions that are going to do for us. So, let us save our template and let us runs to the process of making a new page from our template.
I am go up to the file menu and I will choose “New” just like normal. But this time instead of making a basic HTML page which will give me a blank page, I will go over the template’s tab and you can see our site. And in the right side of the window, you can see our brand new main pages template that we just created.
We have got a thumbnail showing us what this template looks like and that description that we typed in when we made it. I will just select that template and click “Create”. Now, you can see that obviously instead of getting a big blank page, we have a page with all of those table elements and all the graphics loaded right on into it.
Now, as I move my cursor around the page, you will see the big “No” sign in those areas, and that is because we did not mark those areas as editable. If I move my cursor down into the sections mark left content and main content. You can see that I can make my changes there.
Now, in essence what we have done is we have created a page that we are going to edit it in two places. If we need to make any changes to conte