Lee Kyuri: May 2013

Monday, May 6, 2013

Cara Membuat Blogskin

Hai! Tadi ada yang request cara membuat blogskin, dia adalah... Pingkaaan! Nah, sekarang request-nya sudah terkabul. Cekidot okay!

1. Go to 'Dashboard' and then go to 'Template'

2. Scroll kebawah dan kamu akan menemukan tulisan 'Revert To Classic Templates' seperti gambar dibawah ini

3. Nah, habis itu klik 'CTRL + A' lalu delete semua code

4. Nah, sekarang kosong kan? Mari kita paste code dibawah ini kedalam kotak code-nya

<html>
<head>
<center><img src="URL HEADER" /></center>
<title>JUDUL BLOG</title>

5. Silahkan edit-edit tulisan berwarna 'Pink Muda' dan 'Pink Tua' tersebut

6. Cari code dibawah ini dengan menggunakan 'CTRL + F'

<html>

7. Paste code dibawah ini tepat Dibawah code <html>

<div style="display:scroll; position:absolute; top:0px; right:2px;"><a class="linkopacity" href="http://www.blogger.com/follow-blog.g?blogID=BLOG ID" target="_blank" rel="nofollow" title="Follow" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="URL GAMBAR TOMBOL FOLLOW" /></a><br /><div style="display:scroll; position:absolute; top:0px; right:185px;"><a class="linkopacity" href="http://blogger.com/home" rel="nofollow" title="Dashboard" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="URL GAMBAR TOMBOL DASHBOARD" /></a></div></div>

8. Paste code dibawah ini tepat Dibawah semua code sebelumnya

<style type="text/css">
#navbar-iframe {display: none;}body {
background: url(URL BACKGROUND);
background-attachment:fixed;
font-family: arial;
font-size: 11px;
}
a:link, a:visited {
color:#000000;
text-decoration:none;
}
a:hover {
border-bottom:1px solid #87689;
}
</style>
<body><br>

9. Cari code dibawah ini dengan menggunakan 'CTRL + F'

</style>

10. Pastekan code dibawah ini tepat Diatas code </style>

.main {
background:#ffffff;
color:#666666;
padding:14px;
width:500px;
border-radius:10px;
text-align:justify;
}
.sidebar {
background: #ffffff;
color: #666666;
padding: 8px;
width: 240px;
border-radius: 10px;
text-align: justify;
}
.h1 {
color:#FF9FCC;
font-size:18px;
padding:3px;
border-bottom:1px solid #c0c0c0;
}
.h2 {
font-style:italic;
font-size:10px;
margin-bottom:2em;
}

Note :

ABC = Warna Font Di Blog
ABC = Panjang Main Blog
ABC = Panjang Sidebar
ABC = Warna Dont Post Title

11. Cari code dibawah ini dengan menggunakan 'CTRL + F'

<body>

12. Paste code dibawah ini tepat Dibawah code <body>

<table style="line-height: 17px;" width="850" border="0" align="center" cellspacing="5">
<tbody><tr>

13. Oh ya, yang warna 'Pink Muda' itu panjang blog (campuran sidebar sama main blog). Paste code dibawah ini di kotak code paliiiing bawah okay?

<br>

14. Lalu, pastekan code dibawah ini tepat Dibawah code <br>

<td valign="top" width:550px;">
<div class="main">
<blogger><div class="h1"><BlogItemTitle><$BlogItemTitlegt;</BlogItemTitle></div>
<div class="h2"><BlogDateHeader><$BlogDateHeaderDategt;</BlogDateHeader> | <$BlogItemDateTimegt; | <a href="<$BlogItemCommentCreategt;"<$BlogItemCommentFormOnClickgt;><$BlogItemCommentCountgt;comments</a></BlogItemCommentsEnabled></div>
<$blogitembodygt;</blogger><br>
<center><OlderPosts><a href=<$OlderPostsgt;>Older Post</a> </OlderPosts> <NewerPosts> | <a href=<$NewerPostsgt;>Newer Post</a></NewerPosts></center></div>
</div>
</td>

15. Sekarang, kita buat isi sidebar ya! Paste code dibawah ini tepat dibawah code atas ^

<td valign="top" width="250px">
<div class="sidebar">
<div class="h1">TITLE SIDEBAR</div>
ISI SIDEBAR</div>
<br>

16. Mau tambah lagi? Tambahin aja code atas dibawah code atas, contohnya dibawah ini

<td valign="top" width="250px">
<div class="sidebar">
<div class="h1">TITLE SIDEBAR</div>
ISI SIDEBAR</div>
<br>
<td valign="top" width="250px">
<div class="sidebar">
<div class="h1">TITLE SIDEBAR</div>
ISI SIDEBAR</div>
<br>

17. Akhirkan semua code dengan code dibawah ini

</table></body></head></html>

Credits To : Cik Lettha

Freebies Cute Onion Emoticon

Alohaa! Tadi saya nyari-nyari di sebuah web, lalu ketemu banyak emoticon Onion alias Bawang yang super duper lucuu. Aaaa! Mau? Cekidot okay!

Sunday, May 5, 2013

Freebies Template Washed Denim : I'm The Princess Blogger

Hai! Maaf tad ninggalin blog. Hehe... Soalnya tadi lagi membuat template untuk kalian dan hasilnya ini! Mau nih? Serba purple lho... Mau? Cekiot okey!

Screen Shoot (Click photo for big size) :

Oh iya, header-nya mana? Kok gak ada? Hehe... Ada kok, tinggal download picture dibawah ini.

Header Blog (Click photo for big size) :

Nah, gimana? Lumayan kan? Yaudah, mau codenya? Yuk download!

DOWNLOAD AND VIEW XML FILE HERE

Ekhm... Maaf kalau credits-nya gak pakek link, aku ingin blog ini BEDA DARI YANG LAIN!

1. Pergi ke 'Dashboard' lalu ke 'Layout'

2. Klik 'Add A Gadget'

3. Pilih 'HTML/JavaScript'

4. Masukkan code dibawah ini kedalam kotak HTML

<style>
@font-face {
font-family:tt;
src:url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf');
}
.menul{ padding:3px;
width:65px;
margin-left: 5px;
margin-right: 5px;
font:8px tt;
color:#e1c9f3;
background:#fff;
text-align:center;
float:center;
-webkit-transition-duration: .50s;
display: inline-block;
padding:5px;
border:3px solid #e1c9f3;}
.menul:hover {
padding:3px;
height:auto; auto;
margin-left: 5px;
margin-right: 5px;
font:8px tt;
color:#fff;
background:#9C7FB4;
text-align:center;
-webkit-transform: scale(0.8) rotate(20deg);
border:3px solid #fff;
padding:5px;}
</style>
<center>
<a class="menul" href="LINK HERE">TITLE</a>
<a class="menul" href="LINK HERE">TITLE</a>
<a class="menul" href="LINK HERE">TITLE</a>
<a class="menul" href="LINK HERE">TITLE</a>
<a class="menul" href="LINK HERE">TITLE</a>
</center>
</div>

5. Edit-edit tulisan berwarna 'Pink Muda', 'Pink Sedang' dan 'Pink Tua'

6. Klik 'Save' dan jadi deeh!

Underline Hover

Gak usah basa-basi ya? Bingung mau ngomong apa!
Sebelumnya, tau gak apa Underline Hover itu? Check bawah okay!

1. Pergi ke 'Dashboard' lalu pergi ke 'Template'

2. Seperti biasa, 'Edit HTML'

3. Cari code dibawah ini dengan menggunakan 'CTRL + F'

u {

4. Lalu, paste code dibawah ini tepat Dibawah code u {

text-decoration:none;border-bottom: 2px solid #848484;padding: 0px;}u:hover {text-decoration:none;color: #FFFFF;border-bottom: 2px dashed #BDBDBD;padding: 0px;}

5. Klik 'Save' dan jadi!

Note :

Ubah tulisan berwarna 'Pink Muda' dengan style border yang kamu mau
Ubah tulisan berwarna 'Pink Tua' dengan code warna yang kamu suka. Harus beda ya!

Make Own Cursor On Photoshop

Hello! Setelah tutorial yang saya copy dari beberapa blog, kini tutorialnya saya buat sendiri lho... Ekhm, mau copy? Sertakan credits ya!

1. Save gambar dibawah ini

2. Pergi ke 'Adobe Photoshop'

3. Open gambar cursor yang saya kasih tadi

4. Buat sebuah tulisan, contohnya seperti gambar dibawah ini

5. Seleksi bagian yang mau di crop menggunakan 'Crop Tool' seperti gambar dibawah ini

6. Sudah? Klik 'Enter'

7. Lalu, tinggal di save dan dimasukkan ke blog. Caranya? Ikuti step berikut!

8. Pergi ke 'Layout'

9. Lalu, klik 'Add A Gadget'

10. Pilih 'HTML/JavaScript'

11. Masukkan code dibawah ini kedalam kotak HTML

<style type="text/css">body, a, a:hover {cursor: url(URL GAMBAR CURSOR), progress;}</style>

12. Klik 'Save' dan taraa! Jadi deh cursor buatanmu!

Tulisan Link Membesar Jika Disentuh

Nah, karena daritadi freebies mulu, sekarang saya kasih sebuah tutors! Yippie!

1. Go to 'Dashboard' and then go to 'Template'

2. 'Edit HTML'

3. Lalu, cari code dibawah ini dengan menggunakan 'CTRL + F'