CODEWITHSUNDEEP
html
RRaney
RRaney

Reputation: 31

Includes for Common html

I am trying to find a method of including common html statements into my html pages. In the example below I have the same "Footer Section" and "Bulletin" in all of my pages for a site. I know that it does not seem like much but I would like to keep all of the statements in the "Footer Section" and "Bulletin" in a seperate file and find some way of including them in all of the pages. I know that I can write directly into the page using javascript but I would like these in all pages for browsers that do not have scripting enabled as well. I have thought that a 'link' might do this but it cannot be used in the body. I know that this example may not seem like much but I would like to know if and how I could do it before I start making more complex web sites.

Thanks Raney

Original: MyPage.html

<body class = "Screen">
    <div class = "Page">
        <div class = "Header Section">
        </div>
        <div class = "Content Section">
        </div>    
        <div class = "Footer Section">
            <div class = "EMail">
                <a href = "mailto:Support [[email protected]]
                          ?subject=Inquiry">
                    [email protected]
                </a>          
            </div>        
            <div class = "Organization">
                <ul>
                    <li>Company</li>
                    <li>City, ST</li>
                    <li>(123)456-7890</li>
               </ul>
            </div>        
            <div class = "Copyright">
                Copyright &copy;
                2007 Company.<br>
                All rights reserved.        
        </div>
    </div>
    <noscript>
        <div class = "Bulletin"
             id    = "Notice">
            <b>Notice:</b> This Web-Page uses Active scripting!  
            Active scripting is not enabled in your web browser.
        </div>
    </noscript>
</body>

I would like to move common statements to seperate files.

File: MyFooter.html

<div class = "Footer Section">
    <div class = "EMail">
        <a href = "mailto:Support [[email protected]]
                  ?subject=Inquiry">
            [email protected]
        </a>          
    </div>        
    <div class = "Organization">
        <ul>
            <li>Company</li>
            <li>City, ST</li>
            <li>(123)456-7890</li>
        </ul>
    </div>        
    <div class = "Copyright">
        Copyright &copy;
        2007 Company.<br>
        All rights reserved.        
</div>

File: MyBulletin.html

<noscript>
    <div class = "Bulletin"
         id    = "Notice">
        <b>Notice:</b> This Web-Page uses Active scripting!  
        Active scripting is not enabled in your web browser.
    </div>
</noscript>

Then in my MyPage.html file have some way to include the others.

<body class = "Screen">
    <div class = "Page">
        <div class = "Header Section">
        </div>
        <div class = "Content Section">
        </div>
        <<Some way to Include: MyFooter.html>>    
    </div>
    <<Some way to Include: MyBulletin.html>>    
</body>

Upvotes: 1

Views: 206

Answers (6)

RRaney
RRaney

Reputation: 31

A little more checking and I did not like the single noscript.html page.

I did find exactly what I needed with Java Server Pages. Just use terms like "include file" to include a file.

Upvotes: 0

Delan Azabani
Delan Azabani

Reputation: 81404

You can use

  • JavaScript with AJAX requests and DOM insertion
  • server-side includes (SSI)
  • any other server-side processing, such as with a Python, PHP or C# application

Upvotes: 0

Felix Kling
Felix Kling

Reputation: 816512

If you only want to generate static sites, have a look at jekyll: http://jekyllrb.com/

You set up your files according to a certain directory structure and run jekyll on it. It processes the files and generates the HTML pages.

Upvotes: 0

Shadow Wizard
Shadow Wizard

Reputation: 66388

You can use <iframe> for your simple case:

<div class = "Content Section">
</div>
<iframe src="MyFooter.html"></iframe>

Using CSS you can style the frame so it will have no borders, fixed size etc..

Upvotes: 1

Brett Walker
Brett Walker

Reputation: 3576

HTML desn't allow this. You are requiring a dynamic web site. There are many frameworks/solutions for this out there. Take your pick.

Upvotes: 0

SLaks
SLaks

Reputation: 887469

You should use a server-side templating language, such as ASP.Net.

You can then include other source files on the server, or use more sophisticated techniques such as master pages.

Upvotes: 0

Related Questions