Tips Cara Membuat Author Box di bawah Postingan

Hallo rekan dan Sobat pembaca setia SerUnique.com yang berbahagia,  Saya yakin anda pastinya sudah pernah melihat author box di blog lain atau juga di blog ini yang terpasang dibawah postingan. adapun fungsi dari author box sendiri digunakan sebagai peringata bagi Copaser/yang sukanya copy paste agar menghargai karya orang lain dengan memunculkan permalink atau link penulis diakhir postingannya, sehingga perilaku pembajakan akan berkurang dan berharap tidak ada lagi pembajakan artikel alias copy paste artikel. dari itu saya mencoba memberikan tutorial kepada sobat blogger tentang Cara membuat author box dibawah postingan.

Lihat Contoh Author Box di bawah ini:

Oke sekarang langsung saja ke caranya:

1. Silahkan masuk ke dasbor blog sahabat.
2. Pilih "Template >> Edit HTML"
3. Cari kode ini : ]]></b:skin>
4. Pasang kode berikut tepat diatas kode ]]></b:skin> :

.admin-tulisan{
    width:auto;
    background:#FEFF80;
    border:2px solid #000000;
    margin:30px 0 10px 0;
    display:block;
    font-family:"verdana";
    color:#000;
    }
    .admin-tulisan .kontainer{padding:5px;}
    .admin-tulisan h4{
    background:#680202;
    border:none;
    border-bottom:1px solid #000000;
    color:#fff;
    font-family:"verdana";
    text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);
    padding:5px 10px;
    margin:0 0 0 0;
    display:block;
    }
    .admin-tulisan h4 a{color:#000000;}
    .admin-tulisan img{
    background:#000000;
    width:90px;
    height:100px;
    border:1px solid #000000;
    margin:3px 10px 0 0;
    float:left;
    padding:2px;
    box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;
    }  

5. Kemudian anda cari kode <data:post.body/>
6. Selanjutnya silahkan pasang kode berikut tepat dibawahnya :

<!-- Mukti Author Box -->

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div class='admin-tulisan'>

<h4>Artikel ini ditulis oleh : <b><data:post.author/></b> ~ Blog SEO Jember</h4>

<div class='kontainer'>

<img alt='Nama Anda' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgx7LrOiGzzAAElyWVI-gaSojssxwcMFzQx6uQBeXT7Z6kSdiZZ1Y2iW8oV_aijXslX_kdZ5V8xTkMamJbOehCw4pZuivc3DALhK0zRr68nidcyxc38DKzx5DxdUoLqsRsEOT4UuwaXzAa/s1600/Mukti+efendi.jpg'/>

Terimakasih sahabat telah membaca :  <b><a expr:href='data:post.url'><data:post.title/></a></b> Tulisan Saya. Anda bisa menyebarluaskan artikel ini, Asalkan meletakkan link dibawah ini sebagai sumbernya

<textarea cols='50' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='1'>&lt;a href=&quot;<data:post.url/>&quot; target=&quot;_blank&quot;&gt;<data:blog.pageName/>&lt;/a&gt;</textarea>

<p><span style='float:right;font:italic 10px Arial, Sans-Serif;'>

<a href='http://www.serunique.com/2013/01/tips-cara-membuat-author-box-di-bawah.html' target='_blank'>:: Get this widget Click Here! ::</a></span></p>

<div style='clear:both;'/>

</div>

</div>

</b:if>

<!-- Mukti Effendi Author Box -->

7. Setelahsemua kode terpasang silahkan disimpan dan silahkan di chek hasilnya.

NB :

• Sahabat bisa ubah Nama sesuai dengan Nama sahabat
• Sahabat bisa ubah link berwarna biru diatas dengan link foto sahabat yang ingin ditampilkan.
• Sahabat bisa ubah ukuran texarea pada kode berwarna merah diatas.
• Sahabat bisa ubah kalimat sesuai yang sahabat inginkan pada kode berwarna hijau

Sumbernya