Skip navigation
InnoSparkLLC - Nathan
InnoSparkLLC - Nathan Calculating status...
Currently Being Moderated

How do I use a different background image on html files built from template?

May 4, 2012 11:30 AM

Tags: #cs5 #html #template #dreamweaver #css #background_image

I am in the process of developing a website using Dreamweaver CS5. I have created a template (.dwt) and all of the style sheets (css).  I am now ready to create the html files built off the template.  Here is my dilemia though...

 

I want each of my html files to have a different background image in the footer (don't ask why - I'll try and post a link to the website once it is live and it will make sense...). 

 

In my style sheets, I have created classes for each of these various footers (example: .footerHome OR  .footerAbout, etc.....).  Now my only problem is, when I create the html files built off the template, I am unable to change the class since it is not in an editable region.  And when I try to adjust the editable region to include the entire footer, it breaks some other stuff. 

 

Of course I could scrap the template all together and just create the html files, however, the template is a huge time saver for making changes in the future that affect every page in the site. 

 

Any suggestions?  Thanks!

590 Views   3 Replies   Latest reply: InnoSparkLLC - Nathan, May 4, 2012 1:15 PM
 
Replies
  • Rik Ramsay
    Currently Being Moderated
    1. Rik Ramsay,
    May 4, 2012 11:45 AM   in reply to InnoSparkLLC - Nathan
    Report

    In your template, you can just move the comments that mark the beginning and end of the editable regions so that it encompasses your changing footer background:

    <!-- TemplateBeginEditable name="" -->

    <!-- TemplateEndEditable -->

     

    Without seeing the code, I can't tell you where to place the comments but as long as you don't remove any, or put them inside another editable/non-editable region, it should be ok.

     

    As for time-saving, you could look into Server Side Includes for your navigation and footer etc. Easier to manage than a template.

     
    |
    Mark as:
  • Nancy O.
    Currently Being Moderated
    2. Nancy O.,
    May 4, 2012 12:05 PM   in reply to InnoSparkLLC - Nathan
    Report

    Ensure you have an editable region in your Template's <head> tag.

    Use embedded CSS for page specific styles. Embedded styles trump external CSS styles.

     

    <head>

    <!-- TemplateBeginEditable name="head" -->

     

    <style type="text/css">

    #footer {background:#custom color or image...}

    </style>

     

    <!-- TemplateEndEditable -->

    </head>

     

     

     

    Nancy O.

    Alt-Web Design & Publishing

    Web | Graphics | Print | Media  Specialists 

    http://alt-web.com/

     
    |
    Mark as:
  • InnoSparkLLC - Nathan
    Currently Being Moderated
    3. InnoSparkLLC - Nathan,
    May 4, 2012 1:15 PM   in reply to Nancy O.
    Report

    Excellent!  I didn't even think of that!  I'll try this when I get home, but I think this is the answer I was needing!  Thanks much!  I'll mark your post as "Correct Answer" once I am able to test.  Thanks again!!!

     
    |
    Mark as:
Actions

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points