View Full Version : Need help with coding layouts! pllz respond A.S.A.P!!!


alyson013
04-12-2006, 04:32 AM
I have these two layout that I ordered from Spilt Milk Designs, that are awesome, but I'm not so sure exactly how to code them. I feel kinda stupid for not knowing, but here are the links:
http://www.freewebs.com/narniarox/ashley.png
http://www.freewebs.com/narniarox/mande.png

If someone could PLEASE tell me how to code them (explain in detail, please) or help me code them, or code them for me or whatever. PLEASE HELP!
Thanks!!!

HeLpM3
04-12-2006, 06:07 AM
umm i will have to look @ it and write a tut on how ya code theses 2 layout for ya but first you will need an image map and try going to here (http://www.w3schools.com/css/) to learn more about the properties as for that when i write the code 4 ya i will have little notes in them to try and help ya understand :)

alyson013
04-12-2006, 03:44 PM
Thanks. I don't think I'm too sure on how to make an image map *sighs* I'm new with all this HTML stuff and CSS thingys and I'm trying to learn, but I couldn't find anywhere that showed me how to code a layout....

alyson013
04-13-2006, 03:13 AM
All right, I can't make an image map, but I can tell you links I want for them (if you can please code my layout and make an image map with it):

For the Ashley one:
Home (http://freewebs.com/all-ashley-tisdale)
Ashley (http://freewebs.com/all-ashley-tisdale/ashley.htm)
Gallery (http://coppermine.galacnet.com/all-ashley-tisdale-gallery)
Site (http://freewebs.com/all-ashley-tisdale/site.htm)
Online (http://freewebs.com/all-ashley-tisdale/online.htm)

For the other one:
Home (http://freewebs.com/perfect-miley-emily)
Miley + Emily (http://freewebs.com/perfect-miley-emily/mileyandemily.htm)
Gallery (http://coppermien.galacnet.com/perfect-miley-emily-gallery)
Site (http://freewebs.com/perfect-miley-emily/site.htm)
Online (http://freewebs.com/perfect-miley-emily/online.htm)

Thanks! I REALLY appreciate that you can code this for me!!!!!!!!!!

*Note: not all the pages are up YET, but will be up soon!*

alyson013
04-14-2006, 02:55 AM
Umm.... can some 1 PLEASE, PLEASE CODE THIS 4 ME OR TELL ME HOW TO CODE IT, OR SHOW ME A TUTORAIL ON HOW TO CODE IT??? and not in tables, please, css. thanxs!
PLEASE RESPOND, SOME1!!!

HeLpM3
04-15-2006, 02:36 AM
heres is the All Ashley Tisdale layout i will do the other ok :) hope ya help if you have any problem just tell me cause i'm not really a teacher like person and can teach others well but i can tell ya what wrongs

<html>
<head>
<style type="text/css">
body
{
background-color:#fae7c7;
scrollbar-3d-light-color:#dda382;
scrollbar-arrow-color:#dda382;
scrollbar-base-color:#fae7c7;
scrollbar-dark-shadow-color:#dda382;
scrollbar-face-color:#fae7c7;
scrollbar-highlight-color:#dda382;
scrollbar-track-color:#fae7c7;
scrollbar-shadow-color:#dda382;}

#nav
{
position:absolute;
left:160px;
top:470px;
width:220px;
height:245px;
overflow: auto;
border-bottom:1px solid #dda382;
font-family:impact;
color:#dda382;
filter: chroma(color=#fae7c7)
}

#main
{
position:absolute;
right:145px;
top:470px;
width:475px;
height:245px;
overflow: auto;
border-bottom:1px solid #dda382;
font-family:Impact;
color:#dda382;
filter: chroma(color=#fae7c7)
}
A:link
{ text-decoration: none; color:#dda382; }
A:visited
{ text-decoration: none; color:#dda382; }
A:active
{ text-decoration: none; color:#dda382; }
A:hover
{ text-decoration: none; color:#e37463; }
</style>
<title>All Ashley Tisdale</title>
</head>
<body>
<img src="ashley.png" width="1000" height="700" border="0" usemap="#map" vlign="top"/>

<map name="map">
<area shape="rect" coords="402,417,492,446" alt="Home" href="http://freewebs.com/all-ashley-tisdale/" />
<area shape="rect" coords="490,390,575,421" alt="Ashley" href="http://freewebs.com/all-ashley-tisdale/ashley.htm" />
<area shape="rect" coords="582,415,672,446" alt="Gallery" href="http://coppermine.galacnet.com/all-ashley-tisdale-gallery" />
<area shape="rect" coords="669,383,757,415" alt="Site" href="http://freewebs.com/all-ashley-tisdale/site.htm" />
<area shape="rect" coords="760,412,846,446" alt="Online" href="http://freewebs.com/all-ashley-tisdale/online.htm" />
</map>
<div id="nav" align="center"><div align="center">Navigation
<br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>


</div></div>
<div id="main"><p align="center">Main Content<br/>text text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text text
</p></div>

</body>
</html>

alyson013
04-18-2006, 03:39 AM
Okay, thanks SOOOOOO much! You have no idea how much I am thankiing you :waves: :) I am seriously like so happy... srry. just one question, how do I make it that so it doesn't scroll my layout is here (http://freewebs.com/all-ashley-tisdale) but the divisions are scrolling. How do I make them not scroll? Thanks!!!

alyson013
04-19-2006, 04:22 PM
Well, I was just hoping (wondering) if it's possible to make the layouts longer, like, extend the area where the content and navigation go, without having the scrollbar there? I could give some examples of really great sites, that I would like mine to be like: [here (http://georgie-henley.com), here (http://georgie-henley.org), here (http://ashley-tisdale.org), here (http://alyson-stoner.com), here (http://refreshing-aly.2ya.com), here (http://skandarkeynesfan.com), and here (http://hannahmontana.net)]

You see what I mean? So is it possible for there to be no scrollbar like there is on my site [here (http://freewebs.com/all-ashley-tisdale)] in the navigation and content areas?
Thanks sooooo much! I really appreaciate this!

alyson013
04-21-2006, 04:56 AM
Oh, i see! It's a part of the backgound! Well, I still can't figure out how to get it to line up! PLEASE HELP!

HeLpM3
04-21-2006, 06:05 AM
here ya go :)

<html>
<head>
<style type="text/css">
body
{
scrollbar-3d-light-color:#dda382;
scrollbar-arrow-color:#dda382;
scrollbar-base-color:#fae7c7;
scrollbar-dark-shadow-color:#dda382;
scrollbar-face-color:#fae7c7;
scrollbar-highlight-color:#dda382;
scrollbar-track-color:#fae7c7;
scrollbar-shadow-color:#dda382;}


#nav
{
position:absolute;
left:160px;
top:470px;
width:220px;
font-family:impact;
color:#dda382;
filter: chroma(color=#fae7c7)
}

#main
{
position:absolute;
right:145px;
top:470px;
width:475px;
font-family:Impact;
color:#dda382;
filter: chroma(color=#fae7c7)
}
A:link
{ text-decoration: none; color:#dda382; }
A:visited
{ text-decoration: none; color:#dda382; }
A:active
{ text-decoration: none; color:#dda382; }
A:hover
{ text-decoration: none; color:#e37463; }
</style>
<title>All Ashley Tisdale</title>
</head>
<body background="http://i26.photobucket.com/albums/c129/bigtaz1/ashleybg.png">

<img src="ashley.png" width="1000" height="700" border="0" usemap="#map" style="position:absolute;left:0px;top:0px;"/>

<map name="map">
<area shape="rect" coords="402,417,492,446" alt="Home" href="http://freewebs.com/all-ashley-tisdale/" />
<area shape="rect" coords="490,390,575,421" alt="Ashley" href="http://freewebs.com/all-ashley-tisdale/ashley.htm" />
<area shape="rect" coords="582,415,672,446" alt="Gallery" href="http://coppermine.galacnet.com/all-ashley-tisdale-gallery" />
<area shape="rect" coords="669,383,757,415" alt="Site" href="http://freewebs.com/all-ashley-tisdale/site.htm" />
<area shape="rect" coords="760,412,846,446" alt="Online" href="http://freewebs.com/all-ashley-tisdale/online.htm" />
</map>
<div id="nav" align="center"><div align="center">Navigation
<br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>


</div></div>
<div id="main"><p align="center">Main Content<br/>text text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text text
</p></div>

</body>
</html>

alyson013
04-21-2006, 07:30 AM
OMG thanks!!!!!!!!!!!!! Are you going to get the Miley and Emily one done? If it's too much I understand....
Anyways, I can't thank you enough!!!!!

lukejtharries
04-21-2006, 08:58 AM
OK first of all you need to save the following images and upload them, so right click the links and select "save target as" in IE or "save link as" in FF.

First image (ashleybg.png)
http://i4.photobucket.com/albums/y131/lukejtharries/ashleybg.png

Second image (ashleybottom.png)
http://i4.photobucket.com/albums/y131/lukejtharries/ashleybottom.png

Second part (will edit post in a sec)

lukejtharries
04-21-2006, 09:17 AM
Please Note The Title
OK first of all you need to save the following image and upload it, so right click the links and select "save target as" in IE or "save link as" in FF.
Store both in the same directory as the html pages.

First image (ashleybg.png)
http://i4.photobucket.com/albums/y131/lukejtharries/ashleybg.png


Second part: (the actual code)
<html>
<head>
<style type="text/css">
body
{
background-image: url(ashleybg.png);
background-repeat: repeat-y;
scrollbar-3d-light-color:#dda382;
scrollbar-arrow-color:#dda382;
scrollbar-base-color:#fae7c7;
scrollbar-dark-shadow-color:#dda382;
scrollbar-face-color:#fae7c7;
scrollbar-highlight-color:#dda382;
scrollbar-track-color:#fae7c7;
scrollbar-shadow-color:#dda382;}


#nav
{
position:absolute;
left:160px;
top:470px;
width:220px;
font-family:impact;
color:#dda382;
filter: chroma(color=#fae7c7)
}

#main
{
position:absolute;
right:145px;
top:470px;
width:470px;
font-family:Impact;
color:#dda382;
filter: chroma(color=#fae7c7)
}
A:link
{ text-decoration: none; color:#dda382; }
A:visited
{ text-decoration: none; color:#dda382; }
A:active
{ text-decoration: none; color:#dda382; }
A:hover
{ text-decoration: none; color:#e37463; }
</style>
<title>All Ashley Tisdale</title>
</head>
<body background="http://i26.photobucket.com/albums/c129/bigtaz1/ashleybg.png">

<img src="ashley.png" width="1000" height="700" border="0" usemap="#map" style="position:absolute;left:0px;top:0px;"/>

<map name="map">
<area shape="rect" coords="402,417,492,446" alt="Home" href="http://freewebs.com/all-ashley-tisdale/" />
<area shape="rect" coords="490,390,575,421" alt="Ashley" href="http://freewebs.com/all-ashley-tisdale/ashley.htm" />
<area shape="rect" coords="582,415,672,446" alt="Gallery" href="http://coppermine.galacnet.com/all-ashley-tisdale-gallery" />
<area shape="rect" coords="669,383,757,415" alt="Site" href="http://freewebs.com/all-ashley-tisdale/site.htm" />
<area shape="rect" coords="760,412,846,446" alt="Online" href="http://freewebs.com/all-ashley-tisdale/online.htm" />
</map>
<div id="nav" align="center"><div align="center">Navigation
<br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>
<a href="LINK">Link</a><br/>


</div></div>
<div id="main"><p align="center">Main Content<br/>text text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text texttext text text text text text text text text text text text text text text text
</p></div>


</body>
</html>
Notice the stuff in RED
I think that should do it!!