Link to home
Start Free TrialLog in
Avatar of The_King
The_King

asked on

Including Text Files directly into HTML Documents

Is there an efficient way to include HTML code which repeats throughout my website and hold the code in a text file. I have seen a way by linking javascript files. However the HTML Code is so large this method makes things less maintainable as the HTML need to much modification to be a javascript string.

Any suggestions would be greatly appreciated

Thanks in advance
Avatar of Bustarooms
Bustarooms
Flag of United States of America image
server side includes will do the trick...if your web server supports them
ASKER CERTIFIED SOLUTION
Avatar of COBOLdinosaur
COBOLdinosaur
Flag of Canada image
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of Bustarooms
Bustarooms
Flag of United States of America image
that's awesome cd&
Avatar of seanpowell
seanpowell
Flag of Canada image
You've returned! What caused the change of heart?
Avatar of The_King
The_King

ASKER

COBOLdinosaur that code is very nice and works nearly exactly as i need. However After including my first include file everything on the page gets pushed about 3/4 of a page down. However this doesn't happen after i include my footer file. Have you any ideas how to fix this.


My HTML is like this (if you need to see anything else just say and ill post it)


html>
<head>
      <meta http-equiv="Content-Type" content="text/html">
      <LINK REL="stylesheet" Type="text/css" href="stylesheets\excss.css">
      <script language="javascript" src="inc.js"></script>
</head>

<body>

      <Div id="Header">&nbsp</Div>

<script>
      include("Header","Header.inc");
</script>

      <H2>Bibliography</H2>
      <p class="links"><a href="http://www.wired.com/news/digiwood/0,1412,60222,00.html">http://www.wired.com/news/digiwood/0,1412,60222,00.html</a></p>
      <p class="links"><a href="http://arstechnica.com/archive/news/1065153546.html">http://arstechnica.com/archive/news/1065153546.html</a></p>
      <p class="links"><a href="http://www.theregister.co.uk/content/6/33166.html">http://www.theregister.co.uk/content/6/33166.html</a></p>
      <p class="links"><a href="http://www.ananova.com/news/story/sm_824916.html">http://www.ananova.com/news/story/sm_824916.html</a></p>
      <p class="links"><a href="http://news.bbc.co.uk/1/hi/magazine/3117505.stm">http://news.bbc.co.uk/1/hi/magazine/3117505.stm</a></p>
      <p class="links"><a href="http://www.bbc.co.uk/dna/h2g2/A157178">http://www.bbc.co.uk/dna/h2g2/A157178</a></p>
      <p class="links"><a href="http://www.noolearning.ac.uk/burks/foldoc/24/76.htm">http://www.noolearning.ac.uk/burks/foldoc/24/76.htm</a></p>
      <p class="links"><a href="http://scitsc.wlv.ac.uk/~c9818573/MM/web%20page/main.html">http://scitsc.wlv.ac.uk/~c9818573/MM/web%20page/main.html</a></p>
      <p class="links"><a href="http://www.espico.co.uk/mpeg2d1.htm">http://http://www.espico.co.uk/mpeg2d1.htm</a></p>
      <p class="links"><a href="http://http://www.mp3-mac.com/Pages/Books1.html">http://http://www.mp3-mac.com/Pages/Books1.html</a></p>
      <p class="links"><a href="http://www.erg.abdn.ac.uk/ip-dvb/archive/msg00118.html">http://http://www.erg.abdn.ac.uk/ip-dvb/archive/msg00118.html</a></p>

      <Div id="Footer">&nbsp</Div>

<script>
      include("Footer","footer.inc");
</script>      
</body>
</html>




Thanks in advance
Avatar of seanpowell
seanpowell
Flag of Canada image
What's in header.inc?
Avatar of The_King
The_King

ASKER

HEADER.INC


      <a name="top"></a>
      <table width=100% height=100% border=2>
      <tr height=5%>
            <td colspan="3">
                  <H1>Multimedia And The Internet!</H1>
            </td>
      </tr>
      <tr height="10%" >
            <td width="15%">
            <img align="right" src="images\fire.gif" />
            </td>
            <td width="70%">
                  <applet code="tinyHScroll.class" width="100%" height="30">
                        <param name="BGRED" value="168" />
                        <param name="BGGREEN" value="255" />
                        <param name="BGBLUE" value="255" />
                        <param name="FGRED" value="34" />
                        <param name="FGGREEN" value="34" />
                        <param name="FGBLUE" value="255" />
                        <param name="BACKGROUND" value="" />
                        <param name="DELAY" value="10" />
                        <param name="FONTNAME" value="Tahoma" />
                        <param name="FONTSIZE" value="20" />
                        <param name="YPOS" value="25" />
                        <param name="DIRECTION" value="0" />
                        <param name="MESSAGE" value="Jim Is Buzzing!" />
                  </applet>
            </td>
            <td width="15%">
            <img align="left" src="images\fire.gif" />
            </td>
      </tr>
      <tr>
            <td colspan=3>
                  <center>
                        <applet code="tinyHScroll.class" width="70%" height="30">
                              <param name="BGRED" value="34" />
                              <param name="BGGREEN" value="34" />
                              <param name="BGBLUE" value="255" />
                              <param name="FGRED" value="168" />
                              <param name="FGGREEN" value="255" />
                              <param name="FGBLUE" value="255" />
                              <param name="BACKGROUND" value="" />
                              <param name="DELAY" value="10" />
                              <param name="FONTNAME" value="Tahoma" />
                              <param name="FONTSIZE" value="20" />
                              <param name="YPOS" value="25" />
                              <param name="DIRECTION" value="1" />
                              <param name="MESSAGE" value="THE MENU SYSTEM WILL BE HERE!" />
                        </applet>                  
                  </center>
            </td>
      </tr>
      <tr height="80%">
            <td width="15%">
            </td>
            <td width="70%" valign="top">






FOOTER.INC





            </td>
            <td width="15%">
            </td>
      </tr>      
      <tr height="5%">
            <td colspan="3">
                  <br />
                  <center>
                  <a href="#top" >Back To Top</a>
                  </center>
            </td>
      </tr>
      </table>
Avatar of The_King
The_King

ASKER

I think the problem is that the table opens inside the Div tag and the /Div is before the close of the table.

Have you any idea how i can achieve a way around this?

thanks
Avatar of seanpowell
seanpowell
Flag of Canada image
Your original table is set to a height of 100% and the last row is set to 80%. Those will cause you problems depending on what height you're asking the table to be 100% of...

If you remove them, and try and specify heights according to the content, you should be okay...
Avatar of seanpowell
seanpowell
Flag of Canada image
In your example:
<Div id="Header">&nbsp</Div>
<script>
     include("Header","Header.inc");
</script>

the div is being closed "before" the include, so you should be okay with that.
Avatar of The_King
The_King

ASKER

The table is ok when the code isnt being loaded.

when i turn on the table borders the code after the include in the html is underneath the table.

I think the code is pasted inside the div tags with the html?

and as it opens a table and row and column which it doesnt close. makes the div tag close out of order.
Avatar of COBOLdinosaur
COBOLdinosaur
Flag of Canada image
Because you are working inside a table structure, any include whether it is client side like this or server side it going to impact the rendering of the table.  Height as a percentage is no valid HTML, though most browsers will try to figure how to size the element, but anytime there is dynamic content you will get some unpredictable results with height 100%.  I have found it is generally bes to let the browser optimize height itself, or where I really need to control it I give it a fixed value in pixels that the browser can override if it has to.

George,

No change of heart; just covering the 3000 for the month.

Cd&
Avatar of The_King
The_King

ASKER

WOW

nice thanks.

works perfect.

thanks again.

yipppeeeeee!!!
Avatar of seanpowell
seanpowell
Flag of Canada image
>>No change of heart; just covering the 3000 for the month.
Darn - I miss your input... would be nice to have you around again.
Avatar of COBOLdinosaur
COBOLdinosaur
Flag of Canada image
Glad we could help.  Thanks for the A. :^)

George,

I post just as much as ever; just doing most of it on small sites where it has not been turned into a game.

Cd&