Fems☺

MEMBUAT TAB MENU BLOG

Minggu, 13 November 2011

INI CARA PALING GAMPANG LOH !

Banyak cara untuk membuat tab menu pada Blog. cara membuatnya sangatlah mudah. Ikutih cara mudah berikut ini.
1. Buka Account Blogger anda
2. Klik Tataletak
3. Klik Add Gadget
4. Pilih Add Javascript/HTML
5. Copy dan Paste code HTML berikut

<style type="text/css">
.h_mnu_01{
   width: 100%;
   font-family: Arial, Helvetica, sans-serif;
   font-size: 12px;
   font-weight: bold;
   font-style: normal;
   text-decoration: none;
}
.h_mnu_01 ul{
   margin: 0;
   padding: 0;
   float: left;
   width: 100%;
   background: #000000;
   border-top-width: 1px;
   border-right-width: 0;
   border-bottom-width: 1px;
   border-left-width: 0;
   border-top-style: solid;
   border-right-style: solid;
   border-bottom-style: solid;
   border-left-style: solid;
   border-top-color: #000000;
   border-right-color: #000000;
   border-bottom-color: #000000;
   border-left-color: #000000
}

.h_mnu_01 ul li{
display: inline;
}

.h_mnu_01 ul li a{
   float: left;
   color: #FFFFFF;
   padding: 5px 11px;
   text-decoration: none;
   border-right-width: 1px;
   border-right-style: solid;
   border-right-color: #000000;
}

.h_mnu_01 ul li a:visited{
color: #FFFFFF;
}

.h_mnu_01 ul li a:hover, .h_mnu_01 ul li .selected{
   color: #FFFF00 !important;
   padding-top: 5px;
   padding-bottom: 5px;
   background: #008000;
}

</style>
</head>
<body>

<div class="h_mnu_01">
<ul>
<li><a href="#">HOME</a></li>
<li><a href="#">PROFILLE</a></li>
<li><a href="#">PRODUCT</a></li>
<li><a href="#">MY BLOG</a></li>
<li><a href="#">ABOUT</a></li>
</ul>
</div>

</body>
</html>

6. Ganti "HOME,PROFILLE,PRODUCT, MY BLOG, ABOUT" sesuka kamu, dan tanda # diganti dengan alamat dari menu tersebut. misalanya seperti dibawah ini.
<li><a href="lovehugsxoxo.blogspot.com">MY BLOG</a></li>
7. Setelah proses pengeditan selesai, klik Simpan.

kamu bisa ganti kode warna nya juga , untuk melihat kode warna html klik INI

MENGHAPUS LINK 'LANGGANAN ENTRI ATOM'

Pada sebagian Template Blog khususnya template default yang ada di blogger.com sering kita melihat di bawah postingan ada tulisan "Langgan: Entri (Atom)" atau dalam bahasa inggrisnya Subscribe to: Posts (Atom), Link ini berguna untuk pengguna yang ingin berlangganan artikel blog kita via atom. Tetapi pada saat ini biasanya link ini sudah dihapus pada sebagian template baru, dan jika link tersebut masih ada dan cukup menggangu tampilan, anda bisa menghapus/menghilangkan link Langgan: Entri (Atom) tersebut dengan langkah-langkah sebagai berikut.

Cara menghapus atau menghilangkan link/teks tulisan Langgan: Entri (Atom) :

1. Setelah Login buka menu Tata Letak kemudian pilih Edit HTML.

2. Cari kode yang berwarna merah dibawah ini di Template blog anda.

.feed-links

Tepatnya di atas kode ]]></b:skin>

3. Jika anda sudah menemukan kode yang seperti di atas, tambahkan kode

display:none;

di dalam kurung kode tersebut.

4. Jika anda tidak menemukan kode .feed-links pada template anda, anda hanya akan menambahkan kode dibawah ini lalu anda letakkan di atas kode ]]></b:skin>.

.feed-links{display:none;}

5. Klik tombol Simpan Template.

6. Selesai. Silahkan lihat hasilnya !

MEMBUAT TULISAN BERJALAN DI ADDRESS BAR

seperti di blog ku. address tab nya bisa nunjukin nama blog ku dan tulisannya berjalan :D

berikut ini tutorial cara bikinnya , cekidot :

1. kamu harus sigin dulu ke blog anda

2.klik tata letak -> edit html

3.cari kode </head> kalau bingung klik ctrl+f

4.lalu copy kode di dawah ini dan letakan di atas </head>

5.ganti kata welcome dan Femy's Blog :)
6.klik petinjau /save

LET'S TRY IT FRIENDS :D

MEMBUAT LABEL HANYA BERISI JUDUL POSTING

kalian bisa lihat hasil nya seperti di blog ku ya friends :)

aku akan nge-share gimana caranya biar bisa jadi tampilannya seperti blogku , cekidot :

Login ke Blogger
Kemudian ke Tata Letak
Pilih Edit HTML
Centang Expand Widget
Cari kode <div class='blog-posts feed'> atau kode <b:include data='post' name='post'> dengan klik CTRL-F
Ganti kode diatas dengan kode berikut :

<b:if cond='data:blog.homepageUrl != data:blog.url'>

<b:if cond='data:blog.pageType != "item"'>

<data:post.title/></a><br/><br/>

<b:else/>

<b:include data='post' name='post'/>

</b:if>

<b:else/>

<b:include data='post' name='post'/>

</b:if>

Selanjutnya Save Template

TRY IT !

MENGGANTI ICON BLOG

kalian bisa liha hasilnya di blog ini (address tab) :D

aku akan ngajarin gimana caranya ganti icon blog , cekidot :

1.cari url icon nya , contoh : http://www.creativeadornments.com/nephco/cursorsandicons/sanrio/hellokitty_03.ico (kalian bisa cari mbah google yah )

2.Buka Dashboard dan klik Design lalu Edit HTML jangan lupa Centang 'Expand Widget'

3.Temukan kode </head> (bisa gunakan CTRL-F)

4.Setelah itu letakkan kode dibawah ini sebelum kode diatas

ganti kode yang berwarna merah dengan URL gambar yang anda dapatkan tadi

kemudian SAVE :)

MUDAH KAN ? LET'S TRY IT :D

MENGGANTI FONT JUDUL POSTING BLOG

Cara mengganti atau merubah font judul postingan dengan Google API barangkali masih banyak yang belum tahu. Padahal, caranya cukup mudah.

Langsung saja, ikuti step-step berikut ini:

1. Buka Google Web Fonts

2. Klik font atau jenis huruf yang anda pilih. Aku ambil contoh: Slackey

3. Klik ‘Use this font’

4. Copy kode yang di bagian atas

5. Masuk ke dashboard blog anda

6. Klik Layout/rancangan-->edit HTML-->centang ‘Expand Templaet Widget’

7. Cari kode </head>

8. Paste kode dari Google API tadi (no. 4) di bawahnya

9. Tambahkan tanda strip miring di belakang (sebelum tanda >), sehingga kodenya menjadi
<link href='http://fonts.googleapis.com/css?family=Slackey' rel='stylesheet' type='text/css'/>

10. Cari kode ]]></b:skin>

11. Taruh kode ke 2

h3.post-title { font-family: 'Slackey, arial, serif; } di atas kode ]]></b:skin>

12. Simpan, dan lihat hasilnya.

Selamat mencoba.

Note:
1. Jika ingin mengganti dengan font lain, anda tinggal mengubah kata ‘Slackey’ dengan nama font huruf lainnya tersebut (sesuai istilah Google API).

MENGGANTI CURSOR BLOG

kalian bisa mengganti cursor blog kalian dengan yang lucu lucu loh !
banyak banget site-site yang menyediakan cursor lucu . kalo kalian malas mencari klik aja di SINI
aku akan nge-share gimana caranya mengganti cursor di blog kalian, cekidot :

1. Login ke blogger anda

2. Masuk ke Dashboard --- Design

3. Klik Add a Gadget

4. Klik HTML/JavaScript

5. Copy Code CSS Icon tadi , example :

<style type="text/css">body, a, a:hover {cursor: url(http://cur.cursors-4u.net/anime/ani-1/ani189.cur), progress;}</style><a href="http://www.cursors-4u.com/cursor/2008/11/07/ani189.html" target="_blank" title="Cute Hello Kitty 13"><img src="http://cursors-4u.com/support.gif" border="0" alt="Cute Hello Kitty 13" style="position:absolute; top: 0px; right: 0px;" /></a>

6. Paste ke Kotak CSS

7. Klik SAVE

LET'S TRY IT FRIENDS ! MAKE YOUR BLOG HILARIOUS :D