Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home › Forums › CSS › CSS and Templates

  • This topic is empty.
Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • December 1, 2011 at 12:45 pm #35419
    goaltech
    Member

    Hi, New here and love the site. It helped me build my first CSS site. One thing I started to realize is…. In my years of going from PSD to HTML with Dreamweaver I always used templates to update my sites.

    My question is. What is the best or fastest way for me, a newbie, to CSS update the site? PHP include? I followed the Photoshop to CSS tut by Chris but it stops after the site is built. I am looking for advice, bookmarks, tuts, anything to get me back up and running. I also admit I am looking for the easiest way. I am not planning on building huge commercial sites.

    Any help would be great, thank you.
    Paul

    December 1, 2011 at 1:23 pm #91681
    TheDoc
    Member

    I don’t really know what your question is! Could you explain this a little more:

    What is the best or fastest way for me, a newbie, to CSS update the site?

    December 1, 2011 at 2:15 pm #91684
    standuncan
    Member

    Agreed, you should re-state your question a littler more clear.

    If you’re asking how to update the CSS to your site, open your external CSS document/file and make your changes there. As long as you have that CSS file linked in every “page” it wil update all your “pages”.

    December 2, 2011 at 8:24 am #91741
    goaltech
    Member

    Sorry for the confusion. What the best way to update parts of the site to be reused on multiple pages? With Dreamweaver and using tables, I would use the template feature. What is best when working with CSS?

    Thank you

    December 2, 2011 at 12:23 pm #91755
    standuncan
    Member

    I ‘think’ I get what you’re asking, but still not quite sure.

    If you’re asking how to update multiple pages at once using CSS, (instead of using Dreamweaver templates), basically you just use classes where you need them. For instance, if your home page is one layout, but all your interior pages are another, I would use <body class=”interior”> on all the interior pages. Then you use your .interior selection in your CSS and make any changes specific to those pages. An easy way to build that, is once you get your first interior page complete, just save as a new file name and replace the content and continue.

    December 2, 2011 at 12:26 pm #91757
    TheDoc
    Member

    Every page should be linking to the same CSS file. Changes made to the CSS file will then propagate to all of the pages in your site.

    It doesn’t sound like that’s what you’re talking about though. It sounds like you are talking about PHP includes (where you can simply include a common section of a template. You could do something like this:

    December 2, 2011 at 1:19 pm #91762
    goaltech
    Member

    I am having trouble explaining. I have a index/home page with several images that are hyper links to inner pages. These images would be on every page, similar to a header is on every page. If I need to change the image then I would need to go in and change all 50 pages one at a time. Is there a way to batch process this?

    December 2, 2011 at 1:34 pm #91763
    standuncan
    Member

    What @TheDoc said:

    If you include a file like what he posted on every page you want those images on (lets call it “content.php” for now), then when you want to change one of the images you open up “content.php” and make the change there once. It automatically changes on all the pages that file is included on.

    To make sure this works you will need to have all your “pages” or files with this include need a .php extension, and you need to make sure your hosting server allows php, (more than likely Linux server running Apache).

    December 2, 2011 at 6:01 pm #91783
    brentwpowell
    Member

    To further expound on @TheDoc and @standuncan said, it would go something like this:

    Take for example this really simple html markup. For all intents and purposes, this would be an “index.html” page.


    

    
Page Title - Site Name
    

    

    

    


    

    Site Name

    

    


    


    

    Page Title

    

    Some content that probably matters would go here

    


    


    
© 2011 Your Awesome Company - (012) 234-5678

    All that would really ever change in this document would be the “stuff” between the opening and closing section tags, with the header and footer sections being constant throughout. To make our header and footer “template” regions, we would create three new php files, header.php, index.php and footer.php.

    This is what the header.php file would look like:


    

    
Page Title - Site Name
    

    

    

    


    

    Site Name

    The footer.php:


    
© 2011 Your Awesome Company - (012) 234-5678

    The magic then happens in the index.php where you would do just as @TheDoc said and include the two php files we just created.
    It would look like this:

        
    


    

    Page Title

    

    Some content that probably matters would go here

    Notice that we called for the header.php and footer.php parts. You can expand this as far as you want. When you need to add a new page, just make sure to include you header and footer files, give it a new name (eg. about.php) and you all of a sudden have an instant template. Hope this helps you @goaltech!

    December 5, 2011 at 8:41 am #91910
    goaltech
    Member

    This is what I was looking for. Thank you to @brentwpowell, @TheDoc and @standuncan. I assume this can be done with any section of a site. If you know of any good tutorials on this please let me know. Something that explains it a simple as you did here. Thank you very much.

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The forum ‘CSS’ is closed to new topics and replies.