HTML - Simple Template From File Help

Hi guys.I have very little html experience so I decided to work from a template. Problem is, I didn't even know how to add some of the simple stuff.

I was able to figure out how to add: a) the background b) the main header(banner) and c) a few normal pictures

I have no idea however how to add the: sidebar, menubar (where about us, etc is), or the footer. I don't know where the programming for them starts or how to add so that the show up.

In the following post I'll add my website name and code:

How would you add a template to your site with HTML.
This concept is getting very annoying and I have started arguing with someone on this subject. Please if you know how to do this please don't hesitate to tell me. Thanks in advance!!
-Levi

I'm trying to make a template for e-bay using Dreamweaver. When I use CSS, it applies everything to the whole auction, so even the e-bay things have the font as orange. I went in and changed everything to html and things look better, but I'm having a problem with the border around my images. I would like it to be the color in the background instead of black. Here is a screenshot of what I am talking about.

http://s132.photobucket.com/albums/q...screenshot.jpg

Here is the code I currently have:

<img src="http://i132.photobucket.com/albums/q14/littlestinkerstore/SSTemplate/ssimagej.jpg" width="288" height="288" border="9"></p>
<p align="center">&nbsp;</p>
<p align="center"><img src="http://i132.photobucket.com/albums/q14/littlestinkerstore/SSTemplate/ssdescriptionj.jpg" width="450" height="225" border="2"></p>

What I would REALLY like is a border around the image that is another image, a pattern used in the background, but I will be happy with a color that matches!! Thanks!

Hi, this may not be even a HTML question but...

I was wondering if there was a way to create some kind of website template, so if I wanted to add a banner or something to a page I don't have to go into each individual html file and put it in. Something like a css that everything references to and making a change in that changes all.

THX.

HI Guys,

I am making a template using Web 2.0. Everything was alright but when I opened the html files in Dreamweaver again for work. One div in the middle it showed white space.

When I viewed it in firefox, it viewed completely and there was no white space. The text was there , everything was there. I dont get it, where did the white space came from.

Also, if I view the code view, that specific div is highlighted with yellow color. Also the yellow highlighted div is showing in the design view.



I am attaching the screenshots.
Kindly help with this






Regards,
a2usmani

Hey there.

I have a blog. its called reign of uncertainty, and the url is www.confusedforeternity.blogspot.com

i am using a zigmag remedy template.

i am trying to put links in the bar, where it says "home, about me, art....". but the template automatically prefixes the blog url before the link. if i put www.deviantart.com in the xml code, it automatically becomes http://www.confusedforeternity.blogs...deviantart.com.

i am not the good at coding and i dont know why its happening.

the xml template is available he
http://www.mediafire.com/?tz3mzcgntmt

A solution will be appreciated.

Hi, total newbie to website design and I need help in getting rid of a template. I think for now all i want is to go to cPanel, then right to a HTML editor, but every choice seems to leave me with some sort of forced template.
I just switched from Sitebuilder to RVsitebuilder and was a little happier with the 'build your own' template... but still there is a template. I want to learn to design my own header, not have some preset thing....
Should I just keep messing with different builders? Try wordpress? (it's Not like i can ruin anything, there is no content up yet to worry about overwriting)
Hoping someone feels like answering this tonight

I have an older template that has a stylesheet and iframes.html I am wanting to put this into it and just havent had any luck.

<!-- MLCALC BEGIN -->
<script type="text/javascript"><!--
mlcalc_default_calculator = 'loan';
mlcalc_currency_code = 'usd';
mlcalc_amortization = 'year_nc';
//--></script>
<script type="text/javascript" src="http://www.mlcalc.com/jquery.js"></script><div style="font-weight:normal;font-size:9px;font-family:Tahoma;padding:0;margin:0;border:0;background:transparent;color:#E5E5E5;width:300px;text-align:right;padding-right:10px;" id="mlcalcWidgetHolder"><script type="text/javascript" src="http://www.mlcalc.com/widget-wide.js"></script>Powered by <a href="http://www.mlcalc.com/" style="color:#E5E5E5;text-decoration:none">Mortgage Calculator</a></div>
<!-- MLCALC END -->


I have been able to muddle it into the page but get script error. I am sure I need to provide more information. The tables on the page are just to confusing for me to work this in.

Just thought I would start off with the problem. Wasnt sure what forum to put this in either


thanks in advance for any input.

Well okay it's me again. I'm making another template.

How do I get this:
Image

To look like this:

Image

And then let me add text?

Codes:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<title>Apateezer - Home</title>

<link rel=stylesheet href="style.css" type="text/css" media=screen>
</head>

<body>
<div id="page">

    <div id="Header">

    </div>

    <div id="linkbar">

        <div id="page">
<p>test</p>
    </div>

    <div id="footer">
<p>Copyright (c) 2008 Apateezer.com <br/>
All Rights Reserved.</p>
    </div>

</div>
</body>

</html>

Code:

body {

background-color:#000000;

margin:0;

padding:0;

text-align:center;

font-family:Trebuchet MS Bold;

font-size:16px;

color:#ffffff;

}

#page {

width:960px;

margin:auto;

padding:auto;

background-image:url(images/page.png);

text-align:center;

}

#header {

width:780px;

height:123px;

background-image:url(images/header.png);

clear:both;

}

#linkbar {

width:780px;

height:66px;

background-image:url(images/linkbar.png);

clear:both;

}

#footer {

width:780px;

height:51px;

background-image:url(images/footer.png);

clear:both;

}

PLease help.

here is the template.

it's coded badly since I used photoshop and dreamweaver since I dont really know how to code.

the only thing I need to do is add a div tag in the body thats white and another div tag for the footer with that color. ive been messing with it but i cant get it. i end up messing the whole template up.

could someone please help me with those 2 spots please?

Ok, so I just made my first website template in GIMP. I finally get it done and watch a few tutorials on "cutting and slicing) and I get the code and it wont work on the website! Im using www.weebly.com to host the site.
Heres the code that GIMP gave me after cutting and slicing...

<img src="ThreePeatTemp2.png" width="780" height="1000" border="0" usemap="#map" />

<map name="map">
<!-- #$-:Image map file created by GIMP Image Map plug-in -->
<!-- #$-:GIMP Image Map plug-in by Maurits Rijk -->
<!-- #$-lease do not edit lines starting with "#$" -->
<!-- #$VERSION:2.3 -->
<!-- #$AUTHOR:Jalen -->
<area shape="rect" coords="183,182,282,228" href="http://threepeatgaming.weebly.com/index.html" />
<area shape="rect" coords="326,185,447,251" href="http://threepeatgaming.weebly.com/50s-for-sale.html" />
<area shape="rect" coords="491,185,595,252" href="http://threepeatgaming.weebly.com/about-us.html" />
<area shape="rect" coords="641,186,755,252" href="http://threepeatgaming.weebly.com/contact-us.html" />
<area shape="rect" coords="5,2,154,96" href="http://threepeatgaming.weebly.com/index.html" />
<area shape="rect" coords="8,297,85,317" href="http://threepeatgaming.weebly.com/why-us.html" />
<area shape="rect" coords="8,326,86,344" href="http://threepeatgaming.weebly.com/our-goal.html" />
<area shape="rect" coords="9,351,147,372" href="http://threepeatgaming.weebly.com/how-to-buy-a-50.html" />
</map>

Please, any help is really appreciated! I honestly dont know what info you need to help me figure this out, but please if you can help ask.

-Jalen

im having trouble finding a free website template for a game site if anyone knows any websites that would be a big help

Hi,

Im had my site redesigned by a designer a while ago, it was working fine till a couple of weeks ago. When the site loads the logo and and links load for a couple of seconds and disappear. My site address is www.broadway-engraving.co.uk.

If anyone can help it would be much appiciated. The code for the template is below.

Thanks
Ashley

HTML Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>


<script language="JavaScript">
function MM_preloadImages() 
{
//v3.0
  var d=document; if(d.images)
  {
   if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0)
	{
	 d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];
	}
	}
}

function MM_swapImgRestore() 
{
 //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) 
{
 //v4.0
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) 
  {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);
	}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && document.getElementById) x=document.getElementById(n); return x;
}

function MM_swapImage() 
{
 //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];
   }
}
//-->
</script>
<title>{title}</title>
<META name="description" content="{description}">
<META name="keywords" content="{keywords}">.
<META name="title" content="{title}">
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<LINK REL="STYLESHEET" type="text/css"  HREF="templates/{templatenum}/style.css">
<link href="http://www.broadway-engraving.co.uk/main.css" rel="stylesheet" type="text/css">



		
</head>
<!--DO NOT REMOVE THESE LINES#-->

<SCRIPT LANGUAGE="JavaScript" src="script.js"></SCRIPT>
<!--DO NOT REMOVE THESE LINES#-->
<script language="JavaScript">
<!--
//-->
</script><body {onload}  onLoad="MM_preloadImages('karton.gif','homon.gif','proon.gif','aboon.gif','teron.gif','prion.gif','seron.gif','cont.gif','mykarton.gif','conton.gif')">
<!--DO NOT REMOVE THIS JAVASCRIPT OBJECT#-->
{jscript} 
<!--DO NOT REMOVE THIS JAVASCRIPT OBJECT#-->
<div class="topanelbelowboder"><table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="460" height="200" align="left" valign="top" background="logo-sample3--red-style-gra.jpg"><a 
                                href="http://www.broadway-engraving.co.uk/TROPHIES-Football.html"></a><img src="logo-sample3--red-style.jpg" width="354" height="203" alt="Sports Trophies Shop London"></td>
    <td width="160" height="200" align="left" valign="middle" background="logo-sample3--red-style-gra.jpg"><table width="160" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td class="botomnavcolor"><a href="{f3index}">Home</a>&nbsp;&raquo;&nbsp;<a href="viewcart.cgi">View&nbsp;Cart&nbsp;&raquo;</a></td>
      </tr>
    </table></td>
    <td width="358" height="200" align="right" valign="top" background="logo-sample3-blue-gra-1px.jpg"><table width="300" height="100" border="0" align="left" cellpadding="2" cellspacing="0">
      <tr>
        <td class="toppanel"><a href="{f3products}">Products</a></td>
        <td class="toppanel"><a href="{f3faq}">Faq</a></td>
      </tr>
      <tr>
        <td class="toppanel"><a href="{f3about}">About&nbsp;Us</a></td>
        <td class="toppanel"><a href="{f3search}">Search</a></td>
      </tr>
      <tr>
        <td class="toppanel"><a href="{f3terms}">Terms</a></td>
        <td class="toppanel"><a href="{f3contact}">Contact</a></td>
      </tr>
      <tr>
        <td class="toppanel"><a href="{f3privacy}">Privacy</a></td>
        <td class="toppanel"><a href="{f3orderstatus}">Order&nbsp;Status</a></td>
      </tr>
    </table></td>
  </tr>
  
  <tr>
    <td colspan="2" align="left" valign="top"></td>
  </tr>
</table>
</div>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="150" align="left" valign="top"><table width="150" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="150" height="10"><img alt="Sports Trophies London" src="navigation-menu.gif" width="150" height="23"></td>
      </tr>
      <tr>
        <td width="150"> <!--MENU-->
                  {menu} 
                  <!--MENU-->
                  &nbsp; 
                  <script>
if (document.layers) {
} else {
//      document.write("<BR>");
}
</script>
                  <img src="clear.gif" border=0 width="9" height="4"> 
                  <script>
if (document.layers) {
} else {
//      document.write("<BR>");
}
</script></td>
      </tr>
      
        <tr>
          <td>&nbsp;</td>
        </tr>
        <td width="150">&nbsp;</td>
      </tr>
      
    </table></td>
    <td width="10" height="100%" align="left" valign="top" bgcolor="#A01E20">&nbsp;</td>
    <td width="100%" align="left" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
      
      <tr>
        <td bgcolor="#FFFFFF" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
            <tr>
              <td valign="top"><table width="100%"
        border="0"
        cellpadding="2"
        cellspacing="0"
        height="70%"
        valign="top">
                  <tr>
                    <td b1gcolor="#FFFFFF" align="left" valign="top" width="100%" height="21"><!--Actual Content Table Cell-->
                        <!--Content-->
                      {content} {intro}
                      <!--Content-->
                      <!--Actual Content-->                    
					  </td>
                  </tr>
                  <tr>
                    <td colspan="1" align="center" valign="bottom">&nbsp;</td>
                  </tr>
              </table></td>
            </tr>
            
            <tr>
              <td width="99%" valign="bottom" height="100%" align="right"><font class="addressfontcolor">
                <!--COMPANY MAILER--->
                <!--PLEASE DO NOT REMOVE THE FOLLOWING LINE-->
                {companyinfo}
                <!--COMPANY MAILER--->
              </font></td>
              </tr>
        </table></td>
        </tr>
    </table></td>
    <td width="6" align="left" valign="top" bgcolor="#A01E20">&nbsp;</td>
    <td width="163" align="left" valign="top"><table width="150" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="150" height="20"><img alt="Sports Trophies and Gifts" src="cart-contents.gif" width="151" height="23"></td>
      </tr>
      <tr>
        <td height="20">{jscart}</td>
      </tr>
      <tr>
	  
        <td width="150" height="20">{randomft} {randomsp} {randomrp} </td>
      </tr>
     <tr>
        <td width="151" height="20">&nbsp;</td>
      </tr>
      <tr>
        <td width="151" height="20">&nbsp;</td>
      </tr>
	  <tr>
        <td width="151" height="20">&nbsp;</td>
      </tr>
      
    </table></td>
    <td width="19" align="left" valign="top" bgcolor="#A01E20">&nbsp;</td>
  </tr>
</table>
<div class="botomupperboder"><table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="14%">&nbsp;</td>
    <td width="69%"><table width="600" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td width="600" height="41" background="botom-navigation-panel.png" class="botomnavcolor">&nbsp;&nbsp;&nbsp;&nbsp;<a href="{f3index}">Home</a>&nbsp;|&nbsp;<a href="{f3products}">Products</a>&nbsp;|&nbsp;<a href="{f3about}">About&nbsp;Us</a>&nbsp;|&nbsp;<a href="{f3contact}">Contact&nbsp;Us</a>| <a href="{f3privacy}">Privacy&nbsp;Policy</a>&nbsp;| <a href="viewcart.cgi">View&nbsp;Cart</a>&nbsp;|&nbsp;<a href="{f3search}">Search</a>&nbsp;|&nbsp;<a href="{filename}#">Links</a></td>
      </tr>
    </table></td>
    <td width="17%">&nbsp;</td>
  </tr>
</table></div>

</body>
  </table>
</html>

I am a musician not a computer genius. That said, I refuse to be one of the many people that avoid computers to avoid having to learn anything new. I'm trying.

I took on a DIY project. I downloaded an html5 template and tried to do a redesign of my bands website.

Well, long story short. I got the thing finished only to discover I had created a compatibility issue with IE. The original template worked just fine in all browsers... not anymore. It now looks like poop in IE (at least 7,8, and 9).

So rolling the dice here... Not sure what's more appropriate when asking for help... to post a long bunch of code or to give the website knowing that you can view the source. I didn't see a sticky on the topic... but you never know....

Ok, opting for a link. My site is: http://www.arisenfromnothing.com/afnhome.html

Here is the (mostly) working template before I finished:
http://www.arisenfromnothing.com/demothing.html

Hello,
I am making a template for a website and now with a lot of updates being done I was hoping to create a template thats based on a table structure with just the center portion to change depending on the link that was pressed to access that page. Can this be done with an HTML script? Basically it is like the forum page here where the top portion stays the same just the portion below changes.