Cara Menaruh Widget Tentang Penulis Dibawah Postingan

Yuhhuu adalagi nih sebuah trik yang bisa membuat kamu lebih terkenal... Loh ? biasanya saya membagikan trik untuk membuat blog lebih terkenal tetapi pada kesempatan kali ini saya membuat pemilik blog lah yang semakin terkenal. bagaimana sih caranya ? tentu saja dengan memasang widget "About The Author" ini. caranya pun cukup mudah, tingga kamu ikuti saa langka-langkah di bawah ini :

1. Login ke Blogger.com

2. Pilih Template --> Edit HTML --> Centang Expand Template Widget --> Cari kode ]]></b:skin> dan kamu salin kode di bawah ini kemudian kamu letakkan di atas kode ]]></b:skin>.

#authorbox {

background:#333 url(http://2.bp.blogspot.com/-L5Tvv0yJrr4/TvsFt-Mh82I/AAAAAAAACC0/9eva5jXci8U/s1600/about_author.jpg) no-repeat scroll left top;

width:auto;

overflow:hidden;

color:#fff;

-moz-border-radius:15px;

-webkit-border-radius:15px;

border-radius:15px;

margin:5px auto;

padding:40px 10px 10px 20px;

font-family:verdana;

}

#authorbox:hover {

-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);

-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);

box-shadow: 0px 0px 20px  rgba(0, 0, 0, .3);

}

#authorbox h4 {

font-size:16px;

color:#fff;

clear:none;

margin:0;

padding:10px 10px 5px;

}

#authorbox .author_small {

font-style:italic;

}

#authorbox img {

-webkit-transition:  -webkit-transform .15s linear;

-webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25);

-moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);

padding: 5px 5px 5px 5px;

-webkit-transform:  rotate(1deg);

-moz-transform: rotate(1deg);

float:left;

border:4px solid #ff4408;

margin:10px;

padding:0;

}

#authorbox img:hover {

-webkit-box-shadow:  0 3px 6px rgba(0,0,0,.5);

-moz-box-shadow: 0 3px 6px rgba(0,0,0,.5);

-webkit-transform:  rotate(+9deg);

-moz-transform: rotate(-1deg);

}

#authorbox p {

color:#ffffff;

margin:0;

padding:0 10px 10px;

}

#authorbox a {

color:#ff4408;

text-decoration:none;

}

3. Cari lagi kode <data:post.body/> dan kamu salin lagi kode di bawah ini dan letakkan di bawah kode <data:post.body/>.

<div id="authorbox">      

<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglWRbVmRpW9xrS-xHcOdY1TdCOjVlwmhmMd2rdIj69dXBXwddusKjEWY0yBak1jZfI7GcXO1dYSsaJFw26m4zpn2uGCmTyjHP5YetuoT3Q5SFJMjp1pA_BHvqnIpc0-YLn7dxuTnpiupc/s220/hzndi.png" height="100" width="100">

<h4><a href="http://www.hzndi.blogspot.com/" title="Tutorial Blog dan SEO" rel="author">Post by Hzndi </a></h4>

 <p>Hello, Saya hzndi, Jika kalian ingin berkenalan lebih jauh tentang saya, bisa mengunjungi Twitter dan Facebook saya. Jangan Copas yah :p hehehe</p> <p>Follow Me On <a href="http://www.twitter.com/hzndi">Twitter</a> Or <a href="http://www.facebook.com/hzndi">Facebook</a></p></div>

Note :

• Ganti semua tulisan yang berwarna biru dengan kata2 yang kamu suka.
• Ganti http://www.hzndi.blogspot.com dengan alamat blog/web kamu.
• Ganti https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglWRbVmRpW9xrS-xHcOdY1TdCOjVlwmhmMd2rdIj69dXBXwddusKjEWY0yBak1jZfI7GcXO1dYSsaJFw26m4zpn2uGCmTyjHP5YetuoT3Q5SFJMjp1pA_BHvqnIpc0-YLn7dxuTnpiupc/s220/hzndi.png dengan alamat URL gambar kamu.
• Ganti http://www.twitter.com/hzndi dengan alamat Twitter kamu.
• Ganti http://www.facebook.com/hzndi dengan alamat Facebook atau Fanpage Facebook kamu

4. Simpan template kamu, oh iya, widget ini hanya muncul di postingan kamu yah, bukan di beranda kamu. Thanks to helperblogger.com, widgetnya sangat membantu hehe :)

Postingan Terkait:

Blogger

• Cara Menghapus Komentar Spam Secara Otomatis
• Cara Membuat Blog Terindeks Google dengan Cepat
• 5 Kesalahan yang Dilakukan Oleh Blogger Pemula
• Mengembalikan Blog yang Sudah Dihapus, Bisakah ?
• Apa Itu Niche Blogging ?
• Daftar 60+ Forum Do-Follow Ber-PageRank Tinggi 2014
• Cara Menghindari Blog Dihapus Oleh Google
• Cara Memilih Nama Blog & Situs yang Ramah SEO
• Cara Mengembalikan Mood Blogging
• Mengapa Subscriber Feedburner Menjadi 0 ?
• 7 Tips SEO untuk Blogger
• 10 Tips Mantap Untuk Meningkatkan Trafik Organik
• 7 Trik Membuat Artikel Lama Menjadi Populer
• 7 Cara Mendapat Pengunjung Dengan Mudah
• Tutorial Blog dan SEO Terkena Malware ?
• Bagaimana Mengefektifkan Backlink Dalam SEO
• 8 Tips Membuat Loading Blog Lebih Cepat
• Cara Membuat Kotak Fanpage Facebook Hitam Putih
• Optimasi Gambar Untuk Dapatkan Pengunjung
• Cara Menghindari SEO yang Berlebihan
• 8 Tips Untuk Seorang Blogger Pemula
• Cara Mendapatkan Google Sitelink Dengan Cepat
• Cara Membuat dan Tips Pengaturan Meta Tag
• Cara Meningkatkan Ranking Alexa Dengan Cepat
• Cara Mengklaim Situs di Alexa

Posted in: Blogger