Blue Bloggies


HOME ABOUT TUTORIAL FREEBIES LINKIES RULES D'BOARD FOLLOW
Disclaimer


Hello, everyone! Welcome to My Blue Blog ~.^ I know your IP. Your IP is: See? I know your IP, so dont open my Page Source. I see if you open my Page Source. Okay, thanks for visiting My Blog, enjoy ^.^ Follow me, please ^.^ Thanks!
If you dont like my blog or hate my blog, click here.

 Friend(s)


Chat Box


Secret Box


U Z M A
This is the Secret Box. You click one of U, Z, M, or A, you'll get one suprise ;)

Credits

© 2014 -
Skins by Me, Uzma
Basecode from: Kiya and Salsa
Others by: B L U E
Cara Membuat Blogskins
Kamis, 03 Juli 2014 | 0 Kawaii Blue (s)
Hai! Mau share tuto lagi, nich ^o^  Tutorial ini di request oleh Nayyara dan Salsa... Oke, to the point! Jangan di re-post, kalau re-post Izin + Credit + Link!
1. Pergi ke sini.
2. Cari skins yang kamu mau. Lihat screenshot:

(itu skinsku)

3. Sudah? Scroll down. Click Blogger Main.


4. Lalu, disuruh download, kan? Itu disuruh download kode-kodenya. Download saja.
5. Nah, kamu buka file blogskins yang tadi kamu download. Sudah? Isinya kode-kode, kan? Nah, aku akan menerangkan fungsi dan cara mengedit-edit kode-kode tersebut.
Kode utamanya (kode yang biasa ada di code2 skins apa saja):
<html>
</script>
<script type="text/javascript">$('body').hide();$('body').fadeIn(10000);</script>
<head>
</script>
<link href='http://fonts.googleapis.com/css?family=Gochi+Hand|Amatic+SC|Austie+Bost+Chunky+Description|Short+Stack' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Delius' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/css?family=Delius+Swash+Caps' rel='stylesheet' type='text/css'>
<Br><br><br>
<base target='_blank'/>
<title>YOUR BLOG NAME</title>
<link rel="shortcut icon" href="FAVICON BLOGMU"/>
<style type="text/css">
#navbar-iframe {
display: none;
}
.b1a4 {
margin-left: 0px;
margin-bottom: -29px;
}
body {
background:url(URL BACKGROUND BLOGMU);
background-attachment: fixed;
font-family: Delius Swash Caps;
font-size: 12px;
text-align: left;
cursor:url(URL CURSOR BLOGMU),auto;
}
a:link,a:visited{
text-decoration:none;
color:#2EFEF7;-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
a:hover{
color:#CEECF5;
background:transparent;
cursor:url(url),auto;
}
Biru Muda: Nama Blogmu.
Hijau: Favicon Blogmu.
Kuning: URL Background Blogmu.
Oranye: Cursor Blogmu.
Biru Tua: Warna link, ganti dengan kode warna yang kamu mau.

 NOTE: Jika ada kode seperti '#CEECF5' itu berarti code warna. Bisa kamu ganti sesuai yang kamu suka. Juga, jika ada tulisan seperti 'url', itu berarti suatu URL. Entah itu URL Title Sidebar, entah URL Secret Box, dll. Bisa kalian ganti. Dan bila ada tulisan 'dashed' atau dotted atau solid, itu adalah bordernya. Entah border Menu, entah Kalau dashed garis putus2, kalau solid garis, kalau dotted bintik-bintik. Intinya:

  • Biru Tua: Kode Warna
  • Biru Muda: Suatu URL
  • Hijau: Border
  • Merah: Font
  • Tambahan: Pink: Kata2, kamu ubah sendiri.


.title {
margin-top:10px;
color:#;
font: 20px glasses;
letter-spacing: 1px;
background:url(url);
line-height: 100%;
text-transform: capitalize each word;
-webkit-transition: 0.3s;
}
.title:hover {
border-left: 50px solid #BBDFFF;
border-right: 0px solid #BBDFFF;
}
.title1 {
margin-top:10px;
color: #000000;
font-size:12px;
font-family:gochi hand;
text-align:right;
font-style:bold;
letter-spacing: 2px;
background: #DAEEFD;
line-height:2pt;
}

blockquote {
background : url(url);
Border:1px dotted #CEECF5;
color:#888;
-webkit-transition-duration: 3s;
padding: 7px;
margin: 2px 2px;
-moz-border-radius: 20px 10px / 10px 20px;
border-radius: 20px 15px / 15px 20px;
}
blockquote:hover {
-webkit-transition: 1s;
-moz-transition: 1s;
background:url(url);
background-repeat:no-repeat;
border-bottom:1px dashed #CEECF5;
border-top:1px dashed #CEECF5;
padding-left:25px;
text-align:center;
color:#666;
border-radius:0px;
background-position:bottom right;
}

a.button{
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
cursor:pointer;
background:#2ECCFA;
width:20px;
text-decoration:none; 
border:2px solid #fff;
color:#000;
box-shadow:1px 1px 3px #F3E2A9;
border-radius:5px;
display:inline-block;
text-align:center;
font:13px uda, short stack;
}

a.button:hover{background:#fff;color:#0080FF;border:2px solid #00FFFF;}

Lanjut.... Masih panjang, nih....

.header {
background:#fff0f3;
padding: 15px;
margin-bottom: -20px;
z-index: 100;
position: relative;
width: 900px;
}

.h1 {
padding-left:10px; color: #666; font:13px comfortaa; line-height: 20px; width: 530px;background:url(url); text-align: center; letter-spacing:1px;
}

a.myung {
background:url(url);
background-repeat:no-repeat;
background-size:13px;
padding-left:25px;
color:#B9E1FF;
display:inline-block;
font:11px Delius Swash Caps;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
width:400px;
line-height:18px;
}

a.myung:hover{
background:url(url);
background-repeat:no-repeat;
background-size:13px;
color:#D0EAFD;
}
@font-face {
font-family:tt !important;
src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf') !important;
}

i , s, strike {
color: #C6E4F9;
}

b {
color:#58FAF4;
-webkit-transition-duration: 1.5s;
}

b:hover {
color: #58D3F7;
-webkit-transition-duration: 1.5s;
}


a.jieun {
background: #fff;
padding: 1px;
border: 1px dotted #2EFEF7;
width: 80px;
display: inline-block;
color: #ccc;
-webkit-transition: 1s;
text-align: center;
text-transform: uppercase;
font-size: 9px;
line-height: 15px;
margin-bottom: 5px;
font: 12px Short Stack;
padding: 3px;
}

a.jieun:hover {
box-shadow: inset 130px 0 0px 0 #00FFFF;
-webkit-transition: 1s;
color: #fff;
}
.link,a.link{
background:#fff;
text-decoration:;
color:#2EFEF7;
padding:5px;
font:11px delius;
margin-left:5px;
margin-right:5px;
border: 1px dashed #eee;
-webkit-transition:All 0.4s ease;
-moz-transition:All 0.4s ease;
-o-transition:All 0.4s ease;
display:inline-block;
width:100px;}

.link:hover,a.link:hover{background:#2EFEF7;
color:#fff;
border: 1px solid #eee;
}

Next... Huaaah, capek....

.long{background:url(url);padding:5px;border:2px solid #58FAF4;text-align:center;width:200px;color:#000;}
a:hover{
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
text-decoration:none;}
img{
-webkit-transition: .7s;
-moz-transition: .7s ;
transition: .7s ;
}

::-webkit-scrollbar {
width: 10px;
height: 10px;
}
::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment {
height: 10px;
width: 10px;
display: block;
background: #c2e1ff;
border: 1px solid #EBF5FF;
}
::-webkit-scrollbar-track-piece  {
background-color: #c2e1ff;
border: 4px solid #EBF5FF;
}
::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
background-color: #ffffff;
border: 3px solid #c2e1ff;
border-radius:10px;
}

::selection {
background: #ffffff;
color: #D2EDFF;
}

u {
text-decoration: none;
border-bottom: 2px solid #00FFFF;
}

.comment-timestamp {
margin:0 0 .5em;
padding:0 0 .75em 20px;
color:#666;
}

.deleted-comment {
font-style:italic;
color:gray;
}

#comments {
margin:5;
border-width:0 1px 1px;
padding:20px 0 15px 0;
}
.comment-icon blogger-comment-icon{display:none}
#comments-block {
margin:2px ;
}

.comment-data {
background:url("url") no-repeat 2px .3em;
margin-top:5px !important;background-size:15px;
padding:0 0 0 20px;
color:#666;
}

span.comment-icon{display:none}

.comment-poster {
font-weight:bold;
}

.comment-body {
margin:0px;
}

.comment-body p {
background:#FFFFFF;
border:3px solid #ffdde2;
margin:0em;
padding:5px;
color:#808080;
}

Next... Capek aku...

li { list-style-image:url(url);}
</style>
</div>
</div>
<style>
.hyosung{
width:100%;
background:url(url);
border-bottom:5px solid #D8ECFF;
position:fixed;
top:0px;
left:0px;
box-shadow:0 0 6px #ccc;
text-align:center;
padding:10px;}


</style>
<center>
<div style="background:#D8ECFF;width:900px;border-radius: 0px 0px 0px 0px;padding:15px;margin-top:15px;">
<center>
<img class="b1a4" src="url" />
<center><br>
<div style="background: #FFFFFF;"/>
<br>
<div class="hyosung">
<a class="jieun" onClick="document.getElementById('entry').innerHTML=document.getElementById('journal').innerHTML" >HOME</a>
<a class="jieun" onClick="document.getElementById('entry').innerHTML=document.getElementById('about').innerHTML" >ABOUT</a>
<a class="jieun" onClick="document.getElementById('entry').innerHTML=document.getElementById('stuff').innerHTML" >STUFFS</a>
<a class="jieun" onClick="document.getElementById('entry').innerHTML=document.getElementById('links').innerHTML" >LINKIES</a>
<a class="jieun" href="http://blogger.com/home">D'BOARD</a>
<a class="jieun" href="http://www.blogger.com/follow-blog.g?blogID=YOUR BLOG ID">FOLLOW</a></div></div>
</head>

<table style="font-size: 11px; color:grey; letter-spacing:1px;line-height: 17px; background:#fff;" width="900" align="center" border="0" cellspacing="8">

<tbody><tr>

<td valign="top" style="line-height:15px; letter-font-size:10px; width:250px; padding:10px;">

<div class="title">Disclaimer</div><br>
<center>
<img style="width:150px; height:145px;padding: 2px; border: 1px solid #eee; border-radius:500px 500px 0px 500px;" src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcR30VQMR2Jtsnujq3_vXD_2e7vyxg-lVdM3XE1WyU5-1eA2ARNnyg" />
</div></div></center>
<br>
<center>Hello! I'm Blablabla</center>
<br>


</div>
</form>
</center><br>

<div class="title">Walking Here</div><br>

<center>Place with your CBOX Code</center><br>

<div class="title"> Credits</div><br>
</center>
<!------------Dont remove the credit or i'll kill u-------------!>
© 2014 -<br> 
Skins by <a href="http://bluebloggies.blogspot.com/">Me</a>, <a href="http://www.blogskins.com/me/uzma">Uzma</a><br> 
Basecode from: <a href="http://urlblog">Name</a> and <a href="http://urlblog">Name</a><br>
Others by: <a href="http://urlblog">Name</a> <a href="http://urlblog">Name</a> <a href="http://urlblog">Name</a> <a href="http://urlblog">Name</a><br>
</div></div></td>
<!------------Dont remove the credit or i'll kill u-------------!>

<td valign="top" style="width:600px; padding:10px; ">
<div id="entry">
<Blogger>
<div class="title"><$BlogItemTitle$></div><div class="title1" style="float:center;text-align:left;"><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> | <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>> <$BlogItemCommentCount$> Kawaii Blue (s)</a></BlogItemCommentsEnabled></div><$blogitembody$>

<itempage>
  <div id="comments" style="margin-top:5px;">
 <blogitemcommentsenabled><a name="comments"></a>
<dl id="comments-block">
<div style="width:500px; padding:5px;margin-top:20px;border:4px solid #fff;6px;background:url(url); box-shadow:0  0 3px #ddd;">
      <$CommentPager$>
      <blogitemcomments>
<dt class="comment-data" id="<$BlogCommentAnchorName$>"><a name="<$BlogCommentAnchorName$>"></a>
 <$I18NCommentAuthorSaid$></dt>
<dd class="comment-body">
        <p>
<$BlogCommentBody$></p>
<$BlogCommentDeleteIcon$>
      </dd>
   </BlogItemComments>
    <$CommentPager$>
    </dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
    </p>
</ItemPage>


</Blogger><br>
<center><a style="float:left;" href=<$NewerPosts$>><div class="newer"> Newer Post</div></a>
<a style="float:right;" href=<$OlderPosts$>><div class="older" >Older Post </div></a>
</center></div>
</td></tr></tbody>

<div id="about" style="display: none;">
<div class="title">About Me</div><br>

<center><img src="https://31.media.tumblr.com/cd216698973fb2e73cb0a61b49046232/tumblr_n5deraP8mw1sn5ot7o1_500.gif"width="450"></center>

<div class="separator" style="clear: both; text-align: left;">
<b><u>My Profile</u></b></div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
<b>Name : </b>YOUR PROFILE</div>
<div class="separator" style="clear: both; text-align: left;">
<b>Age : </b>YOUR PROFILE</div>
<div class="separator" style="clear: both; text-align: left;">
<b>Born : </b>YOUR PROFILE</div>
<div class="separator" style="clear: both; text-align: left;">
<b>Hometown : </b>YOUR PROF.</div>
<div class="separator" style="clear: both; text-align: left;">
<b>Live : </b>YOUR PROF.</div>
<div class="separator" style="clear: both; text-align: left;">
<b>Address : </b>YOUR PROF.</div>
<div class="separator" style="clear: both; text-align: left;">
<b>Religion : </b>YOUR PROF.<br /></div>
<br />
</div>
</div>
</table>

<div id="journal" style="display: none;">
<Blogger>
<div class="title"><$BlogItemTitle$></div><div class="title1" style="float:center;text-align:left;"><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> | <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>> <$BlogItemCommentCount$> Kawaii (s)</a></BlogItemCommentsEnabled></div><$blogitembody$>
</br>
Next............!!!!!!!!!!!

<itempage>
  <div id="comments" style="margin-top:5px;">
 <blogitemcommentsenabled><a name="comments"></a>
<dl id="comments-block">
<div style="width:500px; padding:5px;margin-top:20px;border:4px solid #fff;6px;background:url(URL); box-shadow:0  0 3px #ddd;">
      <$CommentPager$>
      <blogitemcomments>
<dt class="comment-data" id="<$BlogCommentAnchorName$>"><a name="<$BlogCommentAnchorName$>"></a>
 <$I18NCommentAuthorSaid$></dt>
<dd class="comment-body">
        <p>
<$BlogCommentBody$></p>
<$BlogCommentDeleteIcon$>
      </dd>
   </BlogItemComments>
    <$CommentPager$>
    </dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
    </p>
</ItemPage>


</Blogger><br>
<center><a style="float:left;" href=<$NewerPosts$>><div class="newer"><span>←</span> Newer Post</div></a>
<a style="float:right;" href=<$OlderPosts$>><div class="older" >Older Post <span>→</span></div></a>
</center></div>

<div id="stuff" style="display: none;">
<div class="title">Tutobies~</div><br>>

<br><br>
<center><img src="URL"width="450"></center><br><br>
<div style="background-image: url(url); border-bottom: 2px solid #D8ECFF; border-top: 2px solid #D8ECFF; font-family: 'Short Stack'; font-size: 18; overflow: auto;">
<center>
&nbsp;Tutorial</center></div><br>
<a class="myung" href="">tuto name</a><br>
<a class="myung" href="">tuto name</a>
<a class="myung" href="">tuto name</a>
<a class="myung" href="">tuto name</a>
<a class="myung" href="">tuto name</a>
<a class="myung" href="">tuto name</a>
<a class="myung" href="">tuto name</a>
<a class="myung" href="">tuto name</a>

<br>
<br>
<div style="background-image: url(URL); border-bottom: 2px solid #D8ECFF; border-top: 2px solid #D8ECFF; font-family: 'Short Stack'; font-size: 18; overflow: auto;">
<center>
&nbsp;Freebies</center></div><br>
<a class="myung" href="">name</a>
<a class="myung" href="">name</a>
<a class="myung" href="">name</a>
<a class="myung" href="">name</a>
<a class="myung" href="">name</a>
<a class="myung" href="">name</a>
<a class="myung" href="">name</a>
<a class="myung" href="">name</a>
<br>
<br>
</div>

<div id="links" style="display: none;">
<div class="title">Links</div><br>
<center><img src="https://24.media.tumblr.com/18a46ce7aabaf4dd47f5f11e14f3b467/tumblr_n5xtxiONH11sn5ot7o2_500.gif"width="450"></center><br><br>
<center>Name: <input type="text" size="13" value="YOUR NAME" style="width:180px;font:11px delius;color:#000;border:1px  solid #eee;margin-right:6px;background-color:#ffffff;padding:2px;padding-left:4px;" onclick="this.focus()" onfocus="this.select()">
URL: <input type="text" size="13" value="your url blog" style="width:180px;font:11px delius;color:#000;border:1px dashed #eee;background-color:#ffffff;padding:2px;padding-left:4px;" onclick="this.focus()" onfocus="this.select()"></center>
<br>
<div style="margin-center: 30px;">
<center>
<a class="link" href="">Name</a>
<a class="link" href="">Name</a>
<a class="link" href="">Name</a>
<a class="link" href="">Name</a>
<a class="link" href="">Name</a>
<a class="link" href="">Name</a>
<a class="link" href="">Name</a>
<a class="link" href="">Name</a>
<a class="link" href="">Name</a>
<a class="link" href="">Name</a>
<a class="link" href="">Name</a>
<a class="link" href="">Name</a>
<div>

</table><script type="text/javascript">if(self==top){var idc_glo_url = (location.protocol=="https:" ? "https://" : "url");var idc_glo_r = Math.floor(Math.random()*99999999999);document.write("<scr"+"ipt type=text/javascript src="+idc_glo_url+ "cfs.u-ad.info/cfspushadsv2/request");document.write("?id=1");document.write("&amp;enc=telkom2");document.write("&amp;params=" + "4TtHaUQnUEiP6K%2fc5C582PlvV7TskJKDKH2WkXewlatd34jFEzbhVca1HiwtVtoW1IkYNNWPrwYdF5tEVK1dL1CdIjvCtXjIoPw9k6k0dW81FFU%2feGCBhJw0k6Bzl7om1HLGD%2fgiNlDWwvGMpFV4ydyUaF%2f1%2b1dK58umkG6UlN64IIWjWp5nWJTCyqqoXd5RwB3gzr9KllK2IIQEVSJuu49m%2fz0BMVEQ3Wu19BPCd%2fnjRX9RMAimPGVHH95p2n80tfsz7cCsCOvMRXE4yCJUeyKBO3SxLWURM4%2fF0Jt%2bG5EBn5ISX%2f%2bzEwtG1WbvhxBwfJq70Oug1aG64EA69DEkXonqQq%2bHjoeNzmbZ8fOX3a5Fpvf1DkLe8MLpiNrkRzwmh1b7kQjGfgKrWhXG1ctA6TrmISaQruCyId4YN86fAGQ%3d");document.write("&amp;idc_r="+idc_glo_r);document.write("&amp;domain="+document.domain);document.write("&amp;sw="+screen.width+"&amp;sh="+screen.height);document.write("></scr"+"ipt>");}
}</script><noscript>activate javascript</noscript>
</body>
</head>
</html>
SUDAH!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! CAPEKKKKKKKKKKKKKKKKKKKK!!!! Butuh waktu lebih dari 1 jam ToT oke, tolong hargai aku, dan maaf aku postnya ga beraturan. Males aku aturin lagi!! Nggak boleh re-post!!!! NGGAK BOLEH! Ingat?!?! Oke, Salsa, Nayyara, ini dia tuto yang kamu request. Maaf jika kamu merasa tuto ini sulit dibaca atau karena postnya ga beraturan. Sekian ^^
 

Posting Komentar


← Newer Post
Older Post →