Help - Search - Members - Calendar
Full Version: how do i make a skin?
Forums > Resource Center > Graphics Help > Graphics Help Resolved Topics
roxylindseygirl
i'm new to all this...and i've been looking through all the xanga skins that you guys have made, and they're all SOOO GOOD!! but i have no idea how to make them....cry.gif is there anybody who can kinda explain it to me?
Kathleen
Since you're a beginner, I suggest that you base yours on someone else's skin, but completely change it. What you see in the Skins section are called "CSS sheets" or "Style sheets" Once you become an official member, you can use the Xanga preview thing found in Xanga Tools, where you can put your skin there, see how it looks, and can edit from there without having to go to your real Xanga. You can use all the scripts provided here as well to add to your skin. I hope that helps...
Fireshrieker
heres the basic skin starter code:

CODE
<!-- begin code provided by createblog.com -->
<style type="text/css">
body {
background-color: #000000;
scrollbar-arrow-color: #B991C9;
scrollbar-track-color: #FFFFFF;
scrollbar-shadow-color: #B991C9;
scrollbar-face-color: #B991C9;
scrollbar-highlight-color: #B991C9;
scrollbar-darkshadow-color: #000000;
scrollbar-3dlight-color: #000000;
}

//blogringdocument.write
.left, .blogbody, table.footer, .standard, .leftmodulefontcolor, td, p {
/* edits main text */
font:normal 11px arial;
line-height:10px;
color:black;
letter-spacing:0px;
text-align:justify;
}

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

div.blogheader, .caption {
/* edits the dates */
font-family:Arial;
text-transform:uppercase;
font-size:14px;
line-height:10px;
font-weight:bold;
color:#C991AE;
letter-spacing:0px;
background-color: #000000;
text-align: left;
}

a:link, .footernav.link, a.footernav:link, a.footernav:active {
/* edits all links */
color:#B991C9;
font:normal 11px arial;line-height:10px;
text-decoration: none;
}

//blogring.document.write
a:visited, a.footernav:visited,  {
/* edits the links that the user has visited */
color:#B991C9;
font:normal 11px arial;
line-height:10px;
text-decoration: none;
}

a:hover {
/* edits when user mouseovers the links */
color:#9D91C9;
font:normal 11px arial;
line-height:10px;
cursor: ne-resize;
text-decoration: none;
}

input, select, textarea, .textfield, .button {
/* this edits the buttons, dropdowns, etc. */
border: 1px solid #c0c0c0;
font:normal 11px arial;
background-color: #FFFFFF;
letter-spacing:0px;
}

table.left {
/* this edits the menu module */
border: 1px solid #c0c0c0;
width:160px;
background-color: #FCEBFF;
}

table.blogbody {
/* this edits the other the place where the  blog is */
border: 0px solid c0c0c0;
background-color: #ffffff;
width:400px;
}

table.left th {
/* on your menu module, this edits the title part of it */
/* like BLOGRINGS, POSTING CALENDAR, etc */
background-image: url(http://url.com/to/the/site/image.gif);
background-color: #FCEBFF;
font: bold 11px arial;
text-transform: uppercase;
color: #C991AE;
border: none;
}
table.left TD {
/* on your menu module, this edits the body part of it */
background-image: url(http://url.com/to/the/site/image.gif);
background-color: #FFFFFF;
border: none;
}

table.search TD, table.search, table.announcements {
/* border of search bar (if you have it) */
background-color: #FCEBFF;
border: 1px solid #c0c0c0;
}
table.search TD, table.announcements TH {
/* this should be left alone */
/* unless you know what to do */
border: 0px solid #c0c0c0;
}
table.navigation, table.main, table.footer {
/* the width of your blog with modules */
width: 500px;
}
hr {
/* horizontal divider */
border: 1px solid #FCEBFF;
}
</style>


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


you can change the values that it tells you to change (or, if you really want to learn how to skin, you can go to http://www.pageresource.com and look at the tutorials)(another option is to use the skin maker created by adoggydog195 - its in the xanga tools section)
Evangelionn
I needed help on that also thank you so much! _smile.gif
angel-roh
yeah and go to someone's site...and click
on view source...yeah...........heh,
but now i memorized it...lols
lookitskim
Topic moved
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.