Help - Search - Members - Calendar
Full Version: My first skin...something's wrong with the code!
Forums > Resource Center > Support Center > Xanga Support > Xanga Resolved Topics
moé
Okay, now I KNOW that I did something wrong.

I have attempted to make a skin using THIS picture, and I followed the steps in the tutorial to the upmost precision.

The result?

CLICK!

...What the?

The image map is DEFINATELY on there, but it's definately not where it's supposed to be...and the blog is all the way at the bottom...? This has been fixed, too! Thank you, digital.fragrance!

(I put the image in as the background because it used to be that there were multiple images on top of each other...so I managed to fix that by doing this, but I get the feeling I wasn't supposed to touch that...<<;;) << This has been fixed! The image map now works! Thank you, lbjshaq!

LEFT TO BE FIXED:

-SCROLLBAR ITSELF; The color code is not working, I don't get what's wrong...this is what I think I'm going to need some help with...

-Extra DIV layers; those boxes aren't there for no reason! I'm hoping to fill those in with profile information on one and my subscriptions on the other, but the latter I am not so sure how to do! Any advice on either of these topics would be greatly appreciated.

vv UPDATED vv
CODE
<MAP NAME='imgmap'>
<AREA SHAPE='rect' COORDS='300,148,367,182' HREF='www.xanga.com' ALT='home'>
<AREA SHAPE='rect' COORDS='329,185,406,211' HREF='http://www.xanga.com/Private/SubscribeTo.aspx?user=angstriddenangel' ALT='subscribe'>
<AREA SHAPE='rect' COORDS='287,210,341,233' HREF='www.xanga.com/private' ALT='private'>
<AREA SHAPE='rect' COORDS='325,239,407,263' HREF='http://www.xanga.com/profile.aspx?user=angstriddenangel' ALT='myprofile'>
<AREA SHAPE='rect' COORDS='298,270,371,289' HREF='http://www.xanga.com/logout.aspx' ALT='logout'>
</MAP>


<IMG SRC='http://img.photobucket.com/albums/v227/rockstargirl007/bionicwomancopy.jpg' border=0 width=800 height=600 USEMAP='#imgmap'>


<div style="overflow: auto; width: 401px; height: 186px; margin-top: -213px; margin-left: 40px;">


<style type="text/css">
/* Bionic Woman - By AnGSTriDDenANgeL*/
body
{background-color: #ff6600;
scrollbar-arrow-color: #ffffff;
scrollbar-track-color: #ffffff;
scrollbar-shadow-color: #ff6600;
scrollbar-face-color: #ff6600;
scrollbar-highlight-color: #ff6600;
scrollbar-darkshadow-color: #ff6600;
scrollbar-3dlight-color: #ff6600;}

/* edits the date */
div.blogheader, .caption
{background-image: url();
background-repeat:no-repeat;
background-position:center;
font-family: Arial;
text-transform:none;
font-size:10px;
line-height:10px;
font-weight:bold;
color:#ffffff;
letter-spacing:2px;
background-color:#ff6600;
text-align:center;
border:1px solid #ffffff;}

.blogbody b, .standard b, p b, strong {
/* edits bolded text in your entry */
font-weight: bold;
color: #ffffff;}

input, select, textarea, iframe.htmleditor, .textfield, .button {
/* this edits the buttons, dropdowns, etc. */
border: 1px solid #ffffff;
font:normal 5px arial;
background-color: #ff6600;
font-color:#ffffff;}

table.footer TD {
/* this makes the footer at the bottom centered */
/* leave it alone unless you know what to do*/
text-align: center;}

table.left th {
/* on your menu module, this edits the title part of it */
/* like BLOGRINGS, POSTING CALENDAR, etc */
background-image: url();
background-color:none;
color: #ff6600;
font: bold 5pt arial;
text-transform: none;
text-align:center;
border: #ffffff 1px solid;}

table.left {
/* this edits the menu module */
width:180px;
color:000000;
background-color:#ff6600;
BORDER: #ffffff 1px solid;}

font,td,p,xmp
{color:#ffffff;
font-face: Farial;
font-weight:normal;
font-size:8pt;
text-align:justify;}

table.blogbody tr td {
/* this edits the left margin of blog */
width:0px;
padding-left: 0px;}

table.blogbody {
/* this edits the other the place where the  blog is */
background-color:transparent;
family-font: arial;
BORDER: #ffffff 1px solid;
width:356px;} /* <-- The width for this should be around 5-15 pixels less then the width for your blog's div layer. */

a:link
{line-height: 1pt;
font-family: arial;
font-weight:normal;
color:#ffffff;
text-transform:none;
font-size:8pt;
cursor:crosshair;}

a:active
{font-family: arial;
color:#ff6600;
text-transform:none;
font-size:8pt;
cursor:crosshair;}

a:visited
{font-family: arial;
color:#ffffff;
text-transform:none;
text-decoration:strikeout;
font-size:#pt;
cursor: crosshair;}

A:hover {font-family:arial;
color:#ffffff;
text-transform: uppercase;
cursor: crosshair;
font-weight:bold;
font-size:8pt}</style>

<!-- end code provided by createblog.com -->

<style type="text/css">
.#rblEprops{display:none;}
#pnlEnabled table, #htmleditor, #lblTimeZone,
/* width of the comment page */
{width:245px;}
.leftmoduletitlebar, .leftmoduleborder, .leftmoduleinterior, table.left, table.left TH, table.left TD, table.navigation, table.footer
{display: none;}
</style>

<!-- end code provided by createblog.com -->

<STYLE TYPE="text/css">
BODY{cursor: url(http://www3.telus.net/wilsoncheung/cursor.ani);}
a {cursor: url(http://www3.telus.net/wilsoncheung/cursor.ani);}
</STYLE>


Erm...help? TT_____TT ?
lbjshaq2345
you didnt fix it lol you have to put a pic URL here



instead of bionicwoman copy.jpg you need to host the image exactly as it is and replace that with the url i recommend photobucket
moé
QUOTE(lbjshaq2345 @ Oct 6 2005, 11:20 PM)
you didnt fix it lol you have to put a pic URL here



instead of bionicwoman copy.jpg you need to host the image exactly as it is and replace that with the url i recommend photobucket
*

Ah! Okay, I'll try doing that and see what it does. Thanks!
moé
<< That sort of made it worse...it added another image on top of it...

//EDIT\\: Okay, I removed it as the background picture, and now the imagemap works! Thank you!

Now I just have to scootch up the blog a bit....but i don't think I did anything wrong with the div layer, did I?

I probably did. ><
digital.fragrance
CODE
<div style="overflow: auto; width: 401px; height: 186px; margin-top: 380px; margin-left: 40px;">

if you want to scootch it up, play around with the "margin-top:" number.. in this case, make it smaller.
moé
QUOTE(digital.fragrance @ Oct 6 2005, 11:53 PM)
CODE
<div style="overflow: auto; width: 401px; height: 186px; margin-top: 380px; margin-left: 40px;">

if you want to scootch it up, play around with the "margin-top:" number.. in this case, make it smaller.
*

=o Thanks! That helped a lot, now it's in the right spot...I've just got to get the scrollbar working now and get the other div layers in and fill in the background...thank you so much for your help! <3
Kenado
Topic Closed.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.