Saturday, February 20, 2010

Cara Membuat Share This Post





Waktu blogwalking ketemu artikel menarik dari vanmovic. Saya sendiri sudah menerapkannya pada blog ini karena saya pikir bermanfaat maka saya share juga untuk para sobat. Selamat mencoba sobat....


Cara Membuat Share This Post mungkin judul yang tepat untuk artikel saya yang satu ini...Mungkin ini juga artikel pertama saya yang membahas tentang tutorial blog, karena sejak saya ngeblog pertama kali sampai sekarang belum pernah memberi tutorial tentang blog atau apapun karena saya bukan ahlinya soal ini hehehe. Artikel ini muncul karena temen senasib seperjuang sesama blogger yaitu bertanya soal Rizky Share This Post ini... Ok deh langsung aja :

Mungkin diantara para sobat blogger belum mengerti apa maksud dan fungsi Share This Post ini. Share This Post ini terdapat 7 tombol, yaitu : Digg, Delicious, Facebook, Google, Stumble, Technorati dan Twitter. Fungsinya adalah untuk mensubmit artikel Anda dengan mudah karena kita tinggal mengklik saja salah satu social bookmark dan secara otomatis artikel Anda akan langsung tersubmit ke social bookmark. Dan tentu saja fungsi utama Social Bookmark adalah meningkatkan traffic pengunjung.

Langsung aja deh ke pokok bahasannya membuat Share This Post ini, simak baik-baik yeaaa... :

1. Login ke akun Bloggermu
2. Tata Letak > Edit HTML > (beri tanda centang pada Expand Template Widget)


Langkah Pertama :

1. Tekan CTRL+F (Find) untuk memudahkan pencaria dan carilah kode berikut: ]]></b:skin> 
2. Setelah itu, Copy dan Paste kode HTML di bawah ini, dan di letakkan tepat diatas kode ]]></b:skin>

div.sociable { margin: 16px 0;}

span.sociable_tagline { position: relative; }
span.sociable_tagline span { display: none; width: 14em; }
span.sociable_tagline:hover span {
position: absolute;
display: block;
top: -5em;
background: #ffe;
border: 1px solid #ccc;
color: black;
line-height: 1.25em;
}
.sociable span {
display: block;
}
.sociable ul {
display: inline;
margin: 0 !important;
padding: 0 !important;
}
.sociable ul li {
background: #f5f5f5;
display: inline !important;
list-style-type: none;
margin: 0;
padding: 2px;
}
.sociable ul li:before { content: ""; }
.sociable img {
float: none;

border: 0;
margin: 0;
padding: 0;
}

.sociable-hovers {
opacity: 0.4;
-moz-opacity: 0.4;
filter: alpha(opacity=40);
}
.sociable-hovers:hover {
opacity: 1;
-moz-opacity: 1;
filter: alpha(opacity=100);
}
Langkah pertama sudah selesai....

Langkah Kedua :

1. Kembali tekan CTRL+F (Find) dan carilah kode berikut: <data:post.body/>
2. Kemudian, copas HTML di bawah ini, tepat di bawah kode ini: <data:post.body/>      
NOTE : Jika blog Anda sudah memakai fungsi readmore, maka terdapat dua kode tersebut. Maka pilih kode yang kedua/terakhir biar tidak tampak pada halaman utama.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='sociable'>
<div class='sociable_tagline'>
</b:if>
3. Setelah selesai langsung klik Simpan Template
4. Dan lihat hasilnya
5. Semoga bermanfaat.....

6 comments:

Spoiler Untuk lihat komentar yang masuk:
Blogger Ceria said...

bagus nih sob.. coba ah, bagus tuh.. kalo dihover pake mpuse jadi terang gambarnya..
tapi linknya mungkin bisa dibikin nofollow aja.. hehe..

Meigi Rahman said...

@blogger ceria
saya sendiri juga udah pakai lihat aja live demonya ^^

Anonymous said...

Since you are pandora jewellery going to propose cheap pandora to your special someone only once, you should cheap pandora uk make things extra special pandora discount uk by looking into antique pandora uk art deco rings. The cheap pandora necklaces luxurious and classy look of these rings make them a perfect wedding ring pandora necklaces and charms option for those who want to make their proposal more memorable and exciting.Antique art pandora beads deco rings are known for pandora beads uk their decorative structure and their geometric designs. Their intricate cheap pandora beads patterns and bold colors make them every girls dream come true.

Poetra761 said...

wah info2 yang bagus..lam knl bloger pemula ni msh blajar,hee.. senggol blk kl sempet ya...

http://minority761.blogspot.com

r_oges said...

maaf..sebelumnya sudah saya coba di yang kedua tapi munculnya malahan di depan bukan di singlepost.
terima kasih buat tuorialnya

PegiPegi.com : Booking Hotel Murah & Mudah di Indonesia said...

ini dia yang tak cari tutorialnya lengkap banget..thanks gan..


Post a Comment

Jangan lupa ninggalin jejak dengan komentar ^_^