SKins, how do i make one? Options

[SNAP_Tornado]

i read all those tutorials about how to make one but i still don't know how!! i tried to make one and it didn't work so could anyone tell me a place where's there's a tutorial that's ez to understand thx!!

[angel-roh]

ummm this is how i explain-_-;;

install adobe photoshop (any version) or paint shop pro (any version)
after installing it, open up a new document file
get ur brush skills around the layout, u can also put pictures u want to put, and some text around the layout. dont forget to type in like the navigations. example: home | xanga | add me | log out blah blah blah
btw u can download brushes at some sites^^;;;; like those swirly ones and like the stars one for example heh... if u cant find those sites, ask the members who knows about layouts hehe... try echoica.net? cause thats all i have in mind.

and have macromedia fireworks mx and macromedia dreamweaver mx programs.

open up the file at fireworks mx... open up the file on which u created to make a layout. and after u opened it. look at ur right side... there will be buttons to click on. go look around till you find the word "hotspot tool" the picture shown as like a square...heh and then......after u click that you... go to ur navigations and with ur hotspot tool make a square around your navigations...and there will be like alt=..blah blah stuff like that and link:... for example ur layout says SWEET HOME...the link would say: http://xanga.com/private/home.aspx heh..and the alt would be alt=Home ...that's all................................and then after you done with squaring ur navigation bars.... go to file >>>export... and after you clicked ok...go to..


go to macromedia dreamweaver mx... and open up like you know like for example: dasdasdsad.<b>jpg</b> sdada.<b>bmp</b> asdweea.<b>gif</b> find your file but that says for example asdefd.<b>htm</b> open that...and click on your whole layout...and go up till you find the edit or view place i think??? and find the word copy/paste html...after u find that go open up ur word pad or word document and paste the codes there....then..........................


use the div codes which is...

<center><div id="image" style="align: center;filter: chroma(color=#FFFFFF) allowTransparency;">

<div id="content" style="margin-left: 435px; margin-top: -300px; width: 350px; height: 270px; overflow: auto;">

for example:

<center><div id="image" style="align: center;filter: chroma(color=#FFFFFF) allowTransparency;">

<img name="om1" src="om1.jpg" width="595" height="510" border="0" usemap="#m_om1" alt=""><map name="m_om1">
<area shape="rect" coords="553,251,595,264" href="http://www.xanga.com/CLAF/default.asp" target="_self" title="Look and Feel" alt="Look and Feel" >
<area shape="rect" coords="493,252,547,267" href="http://www.xanga.com/Private/subs.aspx" target="_self" title="Subscriptions" alt="Subscriptions" >
<area shape="rect" coords="427,252,485,267" href="http://www.xanga.com/Private/SubscribeTo.aspx?user=anqel_susan" title="Subscribe to" alt="Subscribe to" >
<area shape="rect" coords="357,250,419,265" href="http://www.xanga.com/login.aspx" target="_self" title="Sign in" alt="Sign in" >
<area shape="rect" coords="300,250,348,265" href="http://www.xanga.com/logout.asp" target="_self" title="Log out" alt="Log out" >
<area shape="rect" coords="221,252,294,266" href="http://www.xanga.com/private/home.aspx" target="_self" title="My privacy" alt="My privacy" >
</map>


<div id="content" style="margin-left: 435px; margin-top: -300px; width: 350px; height: 270px; overflow: auto;">

it supposed to look like that.....those codes i just insert is from doing the copy/paste html at dreamweaver mx ^^;;;; hehehe anyways... then...

copy and paste this code i just showed u with the div layer code... go to your xanga and paste this codes there... in your "put your own header html" and then.... you need a css stylesheets to finish it... you know wat that is right?...it looks like this:

CODE

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

.left, .blogbody, table.footer, .standard, .leftmodulefontcolor, td, p {
/* edits main text */
 font:normal 11px arial;
 line-height:10px;
 color:white;
 letter-spacing:1px;
 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:lowercase;
 font-size:16px;
 line-height:10px;
 font-weight:bold;
 color:#ffffff;
 letter-spacing:3px;
 background-color: #000000;
 text-align: left;
 }

a:link, .footernav.link, a.footernav:link, a.footernav:active {
/* edits all links */
 color:#cccccc;
 letter-spacing:-1px;
 font-weight: bold;
 }

a:visited, a.footernav:visited,  {
/* edits the links that the user has visited */
 color:#cccccc;
 letter-spacing:-1px;
 font-weight: bold;
 }

a:hover {
/* edits when user mouseovers the links */
 color:#ffffff;
 letter-spacing:-1px;
 cursor: ne-resize;
 font-weight: bold;
 text-transform: uppercase;
 }

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

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

table.blogbody {
/* this edits the other the place where the  blog is */
 border: 1px solid cccccc;
 background-color: #000000;
 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: #000000;
 font: bold 11px arial;
 text-transform: uppercase;
 color: #ffffff;
 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: #000000;
 border: none;
 }

table.search TD, table.search, table.announcements {
/* border of search bar (if you have it) */
 background-color: #000000;
 border: 1px solid #cccccc;
 }
table.search TD, table.announcements TH {
/* this should be left alone */
/* unless you know what to do */
 border: 1px solid #cccccc;
 }
table.navigation, table.main, table.footer {
/* the width of your blog with modules */
 width: 500px;
 }
hr {
/* horizontal divider */
 border: 1px solid #cccccc;
 }
</style>
<style type="text/css">
b, strong {
/* edits bolded text in your entry */
color: #cccccc;
font-size: 9pt;
letter-spacing:-1px;
}
</style>
<!-- end code provided by createblog.com -->

then... press preview not done!! cause u never know u might've done something wrong-_-;;;; but if u think it's ok then press saved changes^^;;

if you want someone to fix your blog to your layout..let me knOW and i'll fix it for yoU!! ok that's all whew-_-;;

[aznriceboi]

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