Author Box Disertai Permalink

Author Box Disertai Permalink

10 Comments

blog author
Author box merupakan widget yang cukup penting untuk informasi artikel dan admin suatu blog, sehingga dapat diketahui latar belakang pemilik blog itu sendiri. Selain itu widget ini dapat dijadikan salah satu pendukung optimasi artikel dengan menanam beberapa informasi mengenai artikel itu sendiri secara otomatis. Dengan kata kata lain kita dapat menambahkan permalink dalam satu author box tersebut. Jadi pasang satu dapat dua keuntungan. Sekarang lihat dulu contohnya pada gambar di bawah ini.

blogonol author box

Bagaimana? Anda tertarik? Baiklah, sekarang mari kita bahas cara membuat author box disertai permalink. Ikuti langkah berikut.

Log in ke blogger
Klik Template
Klik Edit HTML
Centang Expand Template Widget
Masukkan kode berikut di atas kode ]]></b:skin>
.blogonol-author-box{display:block; width:auto; background:#F2F2F2; border:2px solid #fff; box-shadow:0 1px 3px #000; -moz-box-shadow:0 1px 3px #000; -webkit-box-shadow:0 1px 3px #000; padding:0; margin:30px 0 10px 0; font:normal 12px Arial,Sans-Serif; color:#222}
.blogonol-author-box .kontainer{padding:5px}
.blogonol-author-box h4{background:#BDBDBD; border:none; border-bottom:1px solid #699019; color:#fff; text-transform:normal; text-shadow:0 1px 0 rgba(0,0,0,0.4); font:bold 12px Arial,Sans-Serif; padding:5px 10px; margin:0 0 0 0; display:block}
.blogonol-author-box h4 a{color:#FEEA83}
.blogonol-author-box img{width:70px; height:70px; margin:0 10px 0 0; float:left; border:1px solid #BDBDBD; padding:2px; background:transparent; box-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none}
Selanjutnya masukkan kode berikut di bawah kode <div class='post-footer-line post-footer-line-1'> atau <div class='post-footer-line post-footer-line-1'/>
<!-- Kotak Admin -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='blogonol-author-box'>
<h4>Posted by : <a expr:href='data:blog.homepageUrl'>blogonol | blogger tutorial </a> ~ tutorial blog, seo, widget, dan blog info</h4>
<div class='kontainer'>
<img src='http://i1138.photobucket.com/albums/n524/blogonol/blogonol-small-logo.jpg'/>
<strong>Tentang <a expr:href='data:blog.homepageUrl'>blogonol</a></strong>
<p><a expr:href='data:blog.homepageUrl'>blogonol</a> adalah Blog - 0 atau blog kosong dengan konten tutorial blog, seo, widget, template gratis, dan blog info yang dikonsep secara sederhana untuk belajar membangun blog yang lebih baik.</p>
<strong>Lisensi Artikel</strong>
<p>Artikel <a expr:href='data:post.url'><data:post.title/></a> diposting oleh <a expr:href='data:blog.homepageUrl'>blogonol | blogger tutorial</a> pada <data:post.dateHeader/>. Anda boleh menyebarluaskan atau mengcopy paste <strong><data:blog.pageName/></strong> pada blog anda, namun jangan lupa untuk meletakkan link <a expr:href='data:blog.homepageUrl'>blogonol | blogger tutorial</a> sebagai sumbernya. Tinggalkan kritik dan saran melalui kotak komentar untuk pembelajaran dan perkembangan blog ini ke depannya. Terima kasih atas kunjungan anda. &quot;keep spirits and do the best&quot;</p>

<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Kotak Admin selesai -->
Selanjutnya ganti tulisan merah dengan cetak tebal dengan nama blog anda. Ganti tulisan biru dengan cetak tebal dengan deskripsi blog atau diri anda. Ganti juga kode gambar profile yang berwarna hitam dengan cetak tebal dengan kode gambar anda. Jangan lupa ganti tulisan hijau dengan cetak tebal dengan deskripsi blog atau tentang diri anda sendiri.

Klik simpan Template dan lihat hasilnya. Selamat mencoba dan sukses selalu. Demikian tutorial cara membuat author box disertai permalink, semoga bermanfaat bagi semua. Amin.


"keep spirits and do the best"
Mau belajar trick dan tips blogging lengkap dan mudah?... BACA DI SINI

About the Author

Blogonol adalah Blog - 0 atau blog kosong dengan konten tutorial blog, seo, widget, template gratis, dan blog info yang dikonsep secara sederhana untuk belajar membangun blog yang lebih baik.