Home » , » Cara Membuat Author Box Atau Kotak Admin di Blog

Cara Membuat Author Box Atau Kotak Admin di Blog

Cara Membuat Author Box Atau Kotak Admin di Blog - sudah lama chinot tidak membuat postingan untuk blog chinot thea ini, dikarenakan ada kesibukan yang tidak dapat ditinggalkan, bersyukur pada kesempatan kali ini chinot thea dapat kembali membuat postingan untuk blog chinot. Pada kesempatan kali ini chinot ingin membuat postingan tentang tutorial Blog yaitu bagaimana Cara Membuat Author Box Atau Kotak Admin di Blog, seperti yang ada pada blog chinot thea ini. 

Cara Membuat Author Box Atau Kotak Admin di Blog ini bertujuan untuk menempatkan link internal pada home page maupun pada halaman posting sehingga kaya akan link internal yang dibuat secara otomatis, selain daripada itu dengan Membuat Author Box, Kotak Admin di Blog juga dapat mengingatkan kepada para pembaca yang ingin mengcopy artikel kita untuk selalu menuliskan sumber link dari artikel yang mereka copy.

Ternyata dengan Membuat Author Box, Kotak Admin di Blog tidak hanya bertujuan seperti yang telah chinot tulis diatas, dengan Membuat Kotak Admin di Bagian Bawah Postingan Blog dapat juga mempercantik tampilan dari isi postingan kita. Berikut contoh Author Box atau Kotak Admin yang ingin chinot share pada kesempatan kali ini.
Cara Membuat Author Box Atau Kotak Admin di Blog

Nah sekarang bagaimana Cara Membuat Author Box atau Kotak Admin di Blog, silahkan sobat simak tulisan chinot sampai akhir.

1. Pertama silahkan sobat login ke dashboard blog sobat
2. Setelah itu pilih template dan edit template sobat
3. Selanjutnya sobat cari kode ]]></b:skin> pada template (untuk memudahkan pencarian sobat dapat menekan tombol Ctrl+F pada keyboard)
4. setelah itu silahkan sobat Copy kode dibawah ini dan letakan tepat diatas kode ]]></b:skin>

/*kotak admin chinot*/.admin-chinot{display:block;width:auto;background:#A9A9F5;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;}.admin-chinot .kontainer{padding:5px;}.admin-chinot h4{background:#4B088A;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;}.admin-chinot h4 a{color:#FEEA83;}.admin-chinot img{width:70px;height:70px;margin:0 10px 0 0;float:left;border:1px solid #954B02;padding:2px;background:#C36702;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;margin: 0px;border: 5px solid #eee;-webkit-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);-moz-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);box-shadow: 4px 4px 4px rgba(0,0,0,0.2);-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease;-o-transition: all 0.5sease;-webkit-transform: rotate(-7deg);-moz-transform: rotate(-7deg);-o-transform: rotate(-7deg);}/* kotak admin chinot*/

Keterangan :
Sesuaikan warna background yang chinot tandai dengan warna merah diatas dengan warna background blog milik sobat

5. Setelah itu cari lagi kode <div class='post-footer'> setelah ketemu silahkan copy kode dibawah ini dan letakan tepat diatas kode <div class='post-footer'>

<!-- Kotak Admin  chinot -->    <b:if cond='data:blog.pageType == &quot;item&quot;'>    <div class='admin-chinot'>    <h4>Ditulis Oleh : <a expr:href='data:blog.homepageUrl'><data:post.author/></a> | Inspirasi Chinot Thea</h4>    <div class='kontainer'>    <img src='http://1.bp.blogspot.com/-Dt4AkxmY6H0/U6ezsFQ6elI/AAAAAAAAAgw/gyxPTYvZunw/s1600/chinot.jpg'/>    Terimah Kasih telah membaca artikel<a expr:href='data:post.url'><data:post.title/></a>. Yang ditulis oleh <data:post.author/>. Jika anda ingin sebarluaskan artikel ini, mohon untuk menyertakan <blink><strong>sumber link asli dibawah ini</strong></blink> Untuk Kritik dan saran silahkan post kan pada kotak komentar, Terimakasih    <p><textarea cols='57' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='2'>&lt;a href=&quot;<data:post.url/>&quot; target=&quot;_blank&quot;&gt;<data:blog.pageName/>&lt;/a&gt;</textarea><span style='float:right;font:italic 10px Arial, Sans-Serif;'><a href='http://chinotthea.blogspot.com//2014/06/cara-membuat-author-box-kotak-admin.html' target='_blank'>:: Get this widget ! ::</a></span></p>    <div style='clear:both;'/>    </div>    </div>    </b:if>    <!-- Kotak Admin chinot -->

Keterangan :
Ganti Tulisan yang ditandai dengan warna merah sesuai keinginan sobat
Ganti link yang berwarna biru dengan link gambar milik sobat

7. Simpan template dan lihatlah hasilnya

NB : Untuk menghindari eror sebaiknya sobat simpan dulu atau backup dulu template sobat sebelum menggunakan kode sript diatas.

Nah bagaimana mudah bukan Cara Membuat Author Box atau Kotak Admin di Blog, semoga tutorial ini dapat bermanfaat untuk para blogger indonesia. Jika sobat paham dengan kode html dan css sobat bisa merubah atau modifikasi script Cara Membuat Author Box, Kotak Admin di Blog diatas sesuai dengan keinginan sobat sendiri. Terimakasih
Bantu Bagikan ya.. :

Ditulis Oleh : Chinot Thea | Inspirasi Blogger Indonesia

Terimah Kasih telah membaca artikel Cara Membuat Author Box Atau Kotak Admin di Blog. Yang ditulis oleh Chinot Thea. Jika sobat ingin menyebarluaskan artikel ini, mohon untuk menyertakan sumber link asli dibawah ini. Untuk kritik dan saran dapat anda sampaikan pada kotak komentar, Terimakasih

0 komentar:

Posting Komentar

Inspirasi Blogger Indonesia
 
Support : Sundaboy | My Facebook |
Copyright © 2013. Inspirasi Chinot Thea - All Rights Reserved
Template Created by Creating Website
Proudly powered by Blogger