Help - Search - Members - Calendar
Full Version: making skins
Forums > Resource Center > Webmasters' Corner > Webmasters' Corner Resolved Topics
jacksparrowsgirl03
first of all, i have the basic code, but where do i put the image that i want to use as the background? And how do i know how to position the blog so it fits onto my image correctly?
Secondly, how, if i have on my image like, profile, claf, etc., how do i link those to the right places? Is there a really good tutorial on how to make ur own skins somewhere? Please help me! thank you so much!
LatinaLady
there is a tutorial
and there is this

http://www.hostultra.com/~superskater195/skinmaker.html its way easy!
jacksparrowsgirl03
thank u so much! mucho love
jacksparrowsgirl03
but can anyone explain this code to me?
QUOTE
<!-- 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: 1px dashed 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 -->


i wanna try and use this code to create my own layouts. i understand it for the most part, im just not sure where to put the background image and do i need to use mapping or anything like that to make the links work?
jacksparrowsgirl03
can anybody help me please?
[2]Nekked
dont double..or...tripple post..
Note
that's you have there, is most likely a skin. Post it in your customed header and see what happens.
jacksparrowsgirl03
i didnt double or triple post......i made a new topic for something completely different, it was about image mapping......but this is the only post of this that I have made. sry for any misunderstandings. i just wanted some help. thanks anyway tho.
DrNick311
You triple-posted when you said thanks, then pasted your code AND can anybody help me all in 3 different posts. Anywho... try this URL:

http://www.createblog.com/forums/index.php?showtopic=7442

Put in different things for each box and then it generates your own custom code. The order of the boxes on the page is the same order as that of the sections of code that are generated so you can pretty much match up each input box to each code and see exactly what does what.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.