Help - Search - Members - Calendar
Full Version: Help - Another Beginner!
Zymic Webmaster Forums > Zymic.com Support > Zymic Free Web Templates
dziekuje
I have downloaded one of Lenny's free templates, made some mods using html kit and then uploaded it but it doesn't look the same. The picture in the header does not appear and also everything is one under the other not laid out as in the template.

Just out of curiosity I uploaded the original template and it is exactly the same layout as my modded version. What did I do wrong?

This is the first time I have ever attempted anything like this so please keep it simple for me huh.gif

Many thanks for your help

Bob
Jacob
Please post the template source code and your edited source code.
dziekuje
This is the original source code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="en" lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>YourSite</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="lib/style.css" />
<script type="text/javascript" src="lib/banner.js"></script>
</head>
<body>
<div id="content">
<h1 title="Site design by Zymic.com"></h1>
<ul id="top">
<li><a href="" id="active_top">Home</a></li>
<li><a href="">About Us</a></li>
<li><a href="">Contact Us</a></li>
<li><a href="">Forums</a></li>
</ul>
<div id="banner">
<img src="lib/banner.gif" alt="" width="596" height="120" name="placeholder" />
</div>
<div id="menu">
<h2>Main Navigation</h2>
<ul>
<li><a href="">Home</a></li>
<li><a href="">About Us</a></li>
<li><a href="">Contact Us</a></li>
<li><a href="">Forums</a></li>
</ul>
<h2>Links</h2>
<ul>
<li><a href="">Link 1</a></li>
<li><a href="">Link 2</a></li>
<li><a href="">Link 3</a></li>
<li><a href="">Link 4</a></li>
<li><a href="">Link 5</a></li>
<li><a href="">Link 6</a></li>
</ul>
<h2>Affiliates</h2>
<ul>
<li><a href="http://zymic.com">Zymic</a></li>
<li><a href="http://zymicms.com">Zymicms</a></li>
<li><a href="http://lenny.in">Lenny.IN</a></li>
<li><a href="http://omfgleet.com">OMFGLEET</a></li>
</ul>
<h2>Search</h2>
<input value="Search" name="search" size="20"
onfocus="if(this.value=='Search')this.value='';" onblur="if(this.value=='')this.value='Search';" />
<input type="submit" value="GO" class="button" />
</div>
<div id="main">
<h2>READ THE READ ME FILE!</h2>

<p>
Please read the read me file for instructions on how to setup your template, needed to know info and much more. View Read Me File
</p>

<p class="date">SUPPORT ZYMIC!</p>

<p>
Please leave all of the default copyright images. At the bottom of the template there is Zymic copyright text or images.<br />
<br />
Example: Template Designed by www.zymic.com PLEASE WHAT EVER YOU DO, DO NOT EDIT THIS OR ATTEMPT TO DELETE IT. <br />
<br />
If we find people editing the copyright, action will be taken further. This is a free template, I did create this in my spare time.. The least you can do is leave credit to our site. You can however delete the zymic affiliate buttons (88x31) which may be on the layout.
</p>

<p class="date">WANT TO REMOVE THE COPYRIGHT WITH OUR PERMISSION?</p>

<p>
If you would like to remove the copyright (design by zymic) it will cost $5. I will then either give you the copyright psd which you can then edit.
</p>

<p>Please e-mail: templates@zymic.com</p>
<p>Stating your name, e-mail address and template number.</p>
<p>I WILL THEN SEND YOU MY PAYPAL.COM address which you can then send me the $5. I will then send the photoshop file or either customize it for you, it's your choice.</p>

<blockquote>
This Template was made by <a href="http://zymic.com/forum/index.php?showuser=286">Lenny</a> of <a href="http://zymic.com">Zymic</a>. Please don't rip it or I will cry... then kill you.<br />
<br />
The header image was downloaded from <a href="http://www.sxc.hu/">stock.xchng</a><br />
<br />
The random banner script was made by <a href="http://zymic.com/forum/index.php?showuser=1280">Bread</a>. Thank him!
</blockquote>

<p class="posted"><a href="">Full Stroy</a> | <a href="">Comments [ 0 ]</a></p>

<div id="copyright">
Copyright &copy; 2005 <a href="">Yoursite.com</a> | Desgin by <a href="http://zymic.com/forum/index.php?showuser=286">Lenny</a> of <a href="http://zymic.com">Zymic</a>
</div>

</div>
</div>
</body>
</html>


And this is my modded code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="en" lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Bob Lejkowski</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="lib/style.css" />
<script type="text/javascript" src="lib/banner.js"></script>
</head>
<body>
<div id="content">
<h1 title="Site design by Zymic.com"></h1>
<ul id="top">
<li><a href="" id="active_top">Home</a></li>
<li><a href="">Spare</a></li>
<li><a href="">Spare</a></li>
<li><a href="">Spare</a></li>
</ul>
<div id="banner">
<img src="lib/banner.gif" alt="" width="596" height="120" name="placeholder" />
</div>
<div id="menu">
<h2>Main Navigation</h2>
<ul>
<li><a href="">Home</a></li>
<li><a href="">About Us</a></li>
<li><a href="">Contact Us</a></li>
<li><a href="">Forums</a></li>
</ul>
<h2>Links</h2>
<ul>
<li><a href="">http://www.makeuseof.com/</a></li>
<li><a href="">http://lifehacker.com/</a></li>
<li><a href="">http://www.jamendo.com/en/</a></li>
<li><a href="">http://amiestreet.com/</a></li>
<li><a href="">http://for-free-on-internet.com./</a></li>
<li><a href="">http://www.flo-joe.co.uk/</a></li>
<li><a href="">http://delicious.com/polskibob/</a></li>
</ul>

<h2>Search</h2>
<input value="Search" name="search" size="20"
onfocus="if(this.value=='Search')this.value='';" onblur="if(this.value=='')this.value='Search';" />
<input type="submit" value="GO" class="button" />
</div>
<div id="main">
<h2>My site to help me find things!</h2>

<p>
This is a site which I have created to help me to find things
quickly. I may also post things which I find interesting
annoying or funny

The links on the right are sites which I check regularly.
Anybody interested in anything different can check my links
on delicious. Here you will find links to cumputer sites, and
teaching and studying English as well as other sites I have
found interesting in the past and present

<p><img alt="owl_book (7K)" src="../owl_book.gif" height="360" width="345" />
<p>
<p>
<p>
<p>
<p>
<p>

<div id="copyright">
Copyright &copy; 2005 <a href="">Yoursite.com</a> | Design by <a href="http://zymic.com/forum/index.php?showuser=286">Lenny</a> of <a href="http://zymic.com">Zymic</a>
</div>

</div>
</div>
</body>
</html>

The original page can be viewed at dziekuje.zzl.org but it looks perfect in html kit!

Thank you

Bob

PS apologies for block letters but hopefully easier to see breaks.
Jacob
I have found out what your issue is.

You have forgot to upload the stylesheet. You need to upload the "style.css" file into a directory called "lib" . This will fix the issue and apply styles to your site.

This will fix your issue.

Edit: Sorry, got bored an decided to fix your issue for you. I used your modded code as the index. You page at: http://dziekuje.zzl.org/ is now working as it should.
( a new password has also been emailed to you )
dziekuje
Many many thanks for your help NaRzY, It certainly looks much better. I will try to find out how to include the owl picture which is part of it later. Should I have included this pic in the .css file too?

Will await new password

Bob
lawny
first create a directory named images in the root folder and add your image then link to it using code like

CODE
<img src"http://dziekuje.zzl.org/images/myimage.jpg" alt="" />
dziekuje
Thank you lawny as well for your advice - I will try later. For anybody who is very new like me it may be worth having a look at this site. It seems fairly slow and step by step in explaining html - will try css later!

http://www.html.net/
dziekuje
Thank you both NaRzY and lawny I have now got my website looking like I want it to for the moment.

I also found this page helpful explaining a little more about getting the picture in and resizing it

http://www.mediacollege.com/internet/html/...e-tag.html#size

Bob happy.gif
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2012 Invision Power Services, Inc.