Solved

Dreamweaver 8 - How do you create a website master template

Posted on 2009-05-12
45
778 Views
Last Modified: 2012-05-06
I have created a template for my website which consists of a header which will hold my title banner and 3 columns for the content. The 1st column has got my categories. The 2nd column will hold the changing content for each category link clicked. The 3rd column will have my newsletter signup and have spaces avaliable for advertisements.

I would like to create a master template for my site so that the header, column 1 and column 3 never change unless I modify the master template. I know this  can be done using Visual Studio but can it be done using Dreamweaver 8 and how?

I should have used a Wordpress blog to start with but was unaware of Wordpress at the time and have worked so hard on this site so I dont want to throw away my efforts.

Please help.
0
Comment
Question by:gpersand
  • 21
  • 18
  • 6
45 Comments
 
LVL 18

Expert Comment

by:Hube02
ID: 24373361
You can take a look at this, it is a pdf that covers almost everything about templates in DW

http://oreilly.com/catalog/drmweavmxtmm/chapter/ch18.pdf
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24376319
Creating a template from an existing page is pretty easy.  Just open the page in Dreamweaver and do File | Save As Template and then define your editable regions (and remove the existing content from those regions).

The caveat to all of this is that if you already have an existing site, creating a template isn't that helpful because it does not automatically attach all of the pages on your site.  Your next step is having to recreate each page from a blank document and apply the template and then copy the content from the exisiting page, then save over the original document name.  This is a huge PITA unless your site is very small.

Templates are supposed to have the ability to be applied to pages with existing content but I've found that DW is not smart enough to always know what should be overwritten and what should be kept and you end up doing a lot of tweaking in a dialog box only to undo and redo and tweak again.  It's been generally faster to create new pages and copy/paste.
0
 

Author Comment

by:gpersand
ID: 24376539
Thanks for the help but i am still slightly confused.
I have saved my main page as main.dwt and removed the central content. Am I right in saying that If i add a link to the template I will have to re-add the data in the editable regions for every page in my site.

If this is the case , then what is the point of saving as a template as I could just use my homepage and  and remove the existing content from those regions.

You mention that Dreamweaver can do the job but not very well. How is this done?
0
 
LVL 18

Expert Comment

by:Hube02
ID: 24376819
Anything that you want to be changed on every page when you edit the template needs to be outside an editable region of the template. So, if you will have a main navigation on the site and this main navigation will be identical on every page of the site then this area of the page should not be in an editable region in the template.
0
 

Author Comment

by:gpersand
ID: 24376867
I understand that, but am not sure how I should be adding the content and saving the .dwt file as a new page.

eg home.dwt >> add content to editable area >> ? (to save as a new file)

When I save the new page with the added content, what format should I save as?
If I need to modify the template again then will this new page also update with the new link?

I am creating a review site and would like all my new reviews to be accessable from the master template for every page in the site.
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24376911
>> Am I right in saying that If i add a link to the template I will have to re-add the data in the editable regions for
>> every page in my site.

Editable regions in templates usually do not contain content as updating anything in an editable region will not cause the update to be passed to the child pages.  New pages based on the template will contain that content.

>> then what is the point of saving as a template as I could just use my homepage and  and remove the existing
>> content from those regions.

Yes.  For existing sites it is sometimes easier to do that.  You lose out on the one advantage of templates, though:

The advantage to the template is in the UNEDITABLE regions.  Things like headers, footers, and navigation should be mostly static and changes few and far between.  By having those areas controlled from a template, you edit the .dwt file and save it.  The changes will be automatically applied to every page that is attached to the template.

>> You mention that Dreamweaver can do the job but not very well. How is this done?

When you apply a template to a page with existing content and layout you will be asked how to assign the existing content to regions in the Template.  This is not a well-thought out process from Adobe.
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24376922
>> eg home.dwt >> add content to editable area >> ? (to save as a new file)

No.

Make a new, blank page.  Do Modify | Apply Template to Page

Add content.  Save.
0
 

Author Comment

by:gpersand
ID: 24376988
I  tried to add the template to a blank page and recieved the attached error regarding adding a defined site. Not sure what to do here?
dwtemplate.doc
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24377032
Ah, you really are new to DW :)

The Site is the basic unit of work for Dreamweaver.  You MUST define sites before the more advanced features are available to you, including Templates, Library Items, and Server Behaviors.

Click the Manage Sites tab and follow the prompts.  Set the local site tab up completely.  You can forgo Testing Server and Remote Site initially but you may want to use DW to transfer files to the web server.  If so, then you will define the Remote Site
0
 
LVL 18

Expert Comment

by:Hube02
ID: 24377079
I have been going through the possibility of applying a new template to an existing templated site that has more than 600 pages. There is a way to do this, but complicated.

This is what we are doing. First we needed to ensure that any editable regions in the old template have and exact match in the new template. So if there is a editable region named "Content" in the old template, then we make sure we have created an editable region in the new template with that exact name where we want this information to be placed in the new design.

the next part is a workaround, but it seems to work. With no files open we do a "Find and Replace"

Find:<!-- InstanceBegin template="/Templates/OldTempalte.dwt"

Replace: <!-- InstanceBegin template="/Templates/NewTemplate.dwt"

Once this is done you open the new template, make a minor change and save the template. DW will then apply the new template to all the site pages that where using the old template and since all the old editable regions are duplicated the content transfers without any difficulty.

This may not always be a solution, depending on how the original template was put together, but in this case it worked because the only thing that was in an editable region in the old template was the page content with no html structure that needed to be removed.
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24377101
>> I have been going through the possibility of applying a new template to an existing templated site

Hube02,

That method works with existing templates only. Take a site with NO template code at all and try to add a newly created template to it if you ever want to spend a fun evening :)
0
 
LVL 18

Expert Comment

by:Hube02
ID: 24377435
I've done that too, luckily only on small sites, but there was a site with 100 or so pages last month where I needed to create each new page and then copy and paste the content by hand from each old page to the new page. Talk about tedious, mind numbing work...
0
 

Author Comment

by:gpersand
ID: 24377909
Im not at my home pc at the moment an do not have Dreamweaver or my site files on this one. Thanks for all the help. I will get back to you in the morning uk time.

My site is currently just a template with no content yet. I have the content in word docs.

Not sure how to label the "content" region in my template though so I can use it throughout my site?
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24377930
>> Not sure how to label the "content" region in my template though so I can use it throughout my site?

You are still misunderstanding how Templates work.  I suggest you get home and play with it.

The Editable Region is just an area that you can alter once the Template is successfully applied to the page.  All regions not marked as editable will be locked out from the DW interface.

So it doesn't matter what you label it so long as the label is unique.
0
 

Author Comment

by:gpersand
ID: 24378031
Sorry for not understanding properly. i am very new to this side of dreamweaver.

Imagine  a 3 column site. The central editable column is blank. How do I label the blank region?
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24378065
Select the div for the center column in the .dwt file and do Insert | Template Objects | Editable Region
0
 

Author Comment

by:gpersand
ID: 24378078
Thank you.
0
 

Author Comment

by:gpersand
ID: 24382293
Morning all,

I have now defined a site for my. Not sure I have done it properly though. I have attached a doc with screenshots of what I did. Please confirm that this is correct.
In screenshot 1 I am asked to add in a site name which I used SeoSite. I have put this in the "site" folder I recieved when I bought this template online. Is this ok or should I have selected this "site" folder that holds the original eg index.html, index1.html files.


Also I have inserted a "editable region". To do this I placed the cursor in the top left part of the blank editable column and  selected Insert>Template Object>Editable region. I have named it "EditRegion1".
Within the code it appears as:
<!-- TemplateBeginEditable name="EditRegion1" -->EditRegion1<!-- TemplateEndEditable -->
 <p>&nbsp;</p>
 <p>&nbsp;</p>
etc

The code above for the editable region is different to what described by Hube02:
Find:<!-- InstanceBegin template="/Templates/OldTempalte.dwt"
Replace: <!-- InstanceBegin template="/Templates/NewTemplate.dwt"


There is no reference to the .dwt file in the code that appeared for me.
Not sure why this is. Please can someone help here.

Also do I add an end point for the editable region in the bottom right side of the blank central column?



Do I also need to add an editable                                                       
0
 

Author Comment

by:gpersand
ID: 24382331
sorry forgot to attach the doc.
dwtemplate.doc
0
 
LVL 18

Expert Comment

by:Hube02
ID: 24383529
That site definition should get you started.

The template code that I referred to will be in the pages based on the template when you create them. I was giving an example of how to change a template site wide when you already have a template.

The end point for the editable region is already there. When you create a page based on this template the text inside the two comments will be editable. In this case "EditRegion1"

<!-- TemplateBeginEditable name="EditRegion1" -->EditRegion1<!-- TemplateEndEditable -->
0
 

Author Comment

by:gpersand
ID: 24383565
How do I link an entry based on the template to another page based on the template?

eg if in the left hand column i have a link called "dreamweaver 8 review".
How do I link this to a templated page with the review content in the editable region.

Just going to lunch but will be back in less than an hour. Thanks again for the help.  
0
 
LVL 18

Expert Comment

by:Hube02
ID: 24383758
I'm not exactly sure I get your meaning.

To create a new page based on a template do:

File->New

Click the "Templates" tab and DW will show you a list of all the sites that you have set up. Select the current site from the list and DW will show you a list of templates available on that site. Choose the template you want to use for the new page.

Once you save this page you can create a link to it in your navigation and enter the content for that page into the editable region.
0
What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

 

Author Comment

by:gpersand
ID: 24384811
"To create a new page based on a template do:
File->New
Click the "Templates" tab and DW will show you a list of all the sites that you have set up. Select the current site from the list and DW will show you a list of templates available on that site"

I access this location but even though I can see the site "SeoSite" i created. there are no .dwt template file avaliable.

Lets start over again to avoid any confusion. Below are the steps I have taken:
-Purchased a html website template online. The website files are store in a folder called "site" that sits on my c:\.
-This "site" folder contains the index.html files, style.css file and a folder for images and one for notes

How I created the template:
-Opened my index.html homepage. (It has a header banner and 3 columns for content)
-I removed the content from the middlecolumn and added an "editable region" on the top left of it.
-I now save the page as a template called index.dwt within the "site" folder  

How I created DW site :
-Open DW - on initial startup screen (where you can choose to open recent items etc)
-Site - New Site
-Site name = site
-http://www.mydomain.com/site
(not sure if this is correct - please let me know)
-I select the option NOT to use server technology  (i just accepted the default)
-edit local copies on my machine so I can upload later
-local route folder - c:\mastersite

Are the above steps correct?
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24387444
>> I now save the page as a template called index.dwt within the "site" folder  

No.  You should have a new folder under the site folder called Templates and the dwt goes in there.

>> How I created DW site
>> http://www.mydomain.com/site

The above should probably be just http://www.mydomain.com/
0
 

Author Comment

by:gpersand
ID: 24390045
I have tried both  the above but still no luck.

When I try to open the new template from the "site" I created it says "no items" in the Site column.

Any thoughts



0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24390252
You still have some misconfiguration and/or misunderstanding of how Templates work in DW.  Can you post a screenshot of your Files Panel?

0
 

Author Comment

by:gpersand
ID: 24392666
Not sure what you mean by files panel?
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24392685
Open Dreamweaver and take a screenshot.  I want to see if the Templates folder exists in your site.
0
 

Author Comment

by:gpersand
ID: 24392686
Ok I have attached the panel screenshot.
dwsitepanel.doc
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24392689
Then, open your Site definition and take a screenshot of that so I can see the local site configuration.
0
 

Author Comment

by:gpersand
ID: 24392693
Can't find the site definition. Can you point me in the right direction please.
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24392696
>> Ok I have attached the panel screenshot.

You define the local folder to be in My Documents/Unnamed Site.  That's probably not correct.  Edit the site definition and put the correct folder in there.
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24392701
>> Can't find the site definition. Can you point me in the right direction please.

You found it once :)

Site | Manage Sites | Edit
0
 

Author Comment

by:gpersand
ID: 24392720
Sorry , not use to the Dreamweaver terms yet.

I have pointed to the c:\site\templates folder and I can see the template now the site panel although when I do File|new|template the template does not appear. See attached
0
 

Author Comment

by:gpersand
ID: 24392722
Um the file did not attach. here it is again.
dwsitepanel.doc
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24392801
>> although when I do File|new|template the template does not appear

Do File | New to get a blank page.

Then do Modify | Apply Template
0
 

Author Comment

by:gpersand
ID: 24392812
Done. But the template still does not appear. See attached.
dwsitepanel.doc
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24392834
OK, your local site folder is still wrong.  You don't want to be in the Templates folder as the local site root. You want to be one level higher.

Q:\Master Web Site\site\
0
 

Author Comment

by:gpersand
ID: 24392881
Thanks my template now appears although it looks nothing like how my website should be as none of the images are linked to the "Templates" folder, i believe.

If I open the template normally from Q:\Master Web Site\site\ it looks like my website template should be.

How can I correct this. I have attached a screenshot of what the template looks like when I open through File|New|template and when I just open the template normally File - open - Q:\master web site\site\indexr.dwt


dwsitepanel.doc
0
 
LVL 70

Accepted Solution

by:
Jason C. Levine earned 500 total points
ID: 24396074
This is a consequence of the incorrect setups you had prior to now.  By making the Template folder the local site root before now, you set the paths in the document up one way and we need it to be another.

Now that your Local Site is defined correctly, open the DWT and check all of the paths for images, CSS files, and links.

Everything should be "../whatever" to indicate the DWT is one level down from the site root.  Just relink everything.

When done, save the template, close the DWT file and follow the steps above.

"How can I correct this."

I'm noticing a tendency on your part to come to a halt at every step.  This isn't brain surgery :)  A little experimentation with the interface will go a long way in helping you understand how DW expects things to be done.  Is there a reason for your hesitation?  Knowing will help me tailor my answers better to your skill level.
0
 

Author Comment

by:gpersand
ID: 24409401
I guess my understanding of how this site works may be the case. As I pay for this service I guess the benefit I see to myself is that I do not have to do much work myself but am paying for the knowledge of others. I assumed the experts in this site are competing with each other for the points so are willing to answer any questions. I do not want to offend anyone on this site but  I have a very busy job, one 3 year old boy at home and my wife is pregnant again at the moment. Unfortunately we/she had a miscarriage last year after 23 weeks of pregnancy so this time round I am keeping her bed-ridden and I have taken on all the responsibilty of looking after my son and maintaining our household (i feel like a sleep deprived drone most of the time at the moment and have lost a fair bit of weight) . My wife is currently on sick leave from work under the doctors recomendation. Money will be very tight once I begin having to pay £1400($2100) for nursery for both children hence my urgency to get this businesses up and running as soon as possible.  If I had any time I would save my money and research how to use the product myself but unfortunately I do not. Do you not think that someone else in my position may benefit from this post in the future which may add to the ongoing success of this site? Because I am so busy at home I am tring to get my website built at work in my lunchbreak and the few minutes I get free here and there. I will quickly test and then get back to the expert who will hopefully point me in the right direction and I will therefore award them some points as their benefit. An I wrong in having this outlook? Maybe im on the wrong site and offending people here? Can you recommend any other sites where I can pay for all types of I.T. support without offending anyone?
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24409494
First off, calm down. You didn't offend me.  I merely wanted to know why it appeared you were stopping after each little step.

>> I guess the benefit I see to myself is that I do not have to do much work myself but am paying for
>> the knowledge of others.

That's not a completely correct assessment of how we do things here.  If you don't want to do the work, you would be better off hiring a consultant to come around and fix your problem.   What you pay for here is the ability to ask unlimited questions but all of the Experts are volunteers and are not paid and we have jobs and families too.  You can have my knowledge but we have gone about as far as we can go with this one question and I cannot config your setup for you.  You need to be able to apply what you've learned here to your machine.

>> Do you not think that someone else in my position may benefit from this post in the future which may add to the
>> ongoing success of this site?

The problem with this post is that has been answered to great extent.  I cannot reach through the intertubes and configure your machine for you...at some point there has to be a minimum responsibility on your part to take the information given, digest it, and apply it to your specific instance.  DW Templates are not hard to use provided the Local Site is set up correctly and setting up a Site is well covered in the DW help files, in previously asked questions here, and all over the internet.  Every basic DW tutorial will start with a site definition section.  

0
 

Author Comment

by:gpersand
ID: 24409730
Its not that I dont want to do any work. I usually try my best and then ask a question when I get stuck.  If I am unsure of terms etc in the future, I will do a quick search on the net first so it don't come across as too much of a lazy sod. I do really appreciate all the help I recieve from this sites community.

I have played around with the folder settings for the images but no luck getting the format right. The closest I have got is adding my images folder to my Templates folder but even though the images appear the categories are halfway down the page. How annoying. Anyway I think I better give up on this project before I waste too much time learning DW. Im gonna start over using a Wordpress blog. Much easier administration and the templates already set up for me. I guess thats why most websites are moving toward wordpress these days and of course because the search engine love them.

Thanks again for the help.
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24413829
>> The closest I have got is adding my images folder to my Templates folder

No.

Site Root
        Templates
              template.dwt
        images
        otherfolders
        page.html
0
 

Author Comment

by:gpersand
ID: 24420370
That was the default setup that didnt work.

Then as I mentioned above I put the images folder in the templates folder which put the images back where they should have been but messed up the format completely.

Jason, I really appreciate your efforts but I think Wordpress is the way forward for me. If I keep at DW I will be annoying the experts here with all sorts of questions regarding inserting video and comments for my posts etc,etc,etc.

I have found a great Wordpress theme that has blown me away and matches everything I need for my site and more.   Its really easy to use and I have just swapped around the images and videos with my own. I just need to add my reviews now and im ready to rock. I think i'll leave DW to the experts as I do not have time to learn it properly.  Thanks again.
0

Featured Post

What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

Join & Write a Comment

Using SQL Scripts we can save all the SQL queries as files that we use very frequently on our database later point of time. This is one of the feature present under SQL Workshop in Oracle Application Express.
"In order to have an organized way for empathy mapping, we rely on a psychological model and trying to model it in a simple way, so we will split the board to three section for each persona and a scenario and try to see what those personas would Do,…
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
Wufoo.com provides powerful tools for surveying targeted groups, and utilizing data from completed surveys to find trends, discover areas of demand or customer expectation, and make business decisions on products or services.

708 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now