Cara Membuat Author Box (Kotak Admin) Di Blog

Saat ini sedang banyak blog yang isinya copy paste, dan tidak pula memberikan link aktif sumber ia mendapatkan artikel tersebut, sayapun memiliki blog copas --> diandiki.blogspot.com . Namun saya selalu memberikan link aslinya , jadi tidak melanggar peraturan, jika teman-teman mau melihat klik Disini

Untuk mengantisipasi banyak artikel copas tanpa memberikan link asli, sebaiknya kita memberikan peringatan dibawah postingan blog dalam bentuk kotak admin. Jika teman teman ingin melihat bentuk dari kotak admin tersebut teman-teman bisa melihat gambar di bawah ini atau bisa melihat langsung dibawah postingan blog saya.

Jika anda tertarik , lanjut baca artikel ini


1. Kilik menu template di blog anda --> klik html

Jika anda sulit menemukan pemula dan sulit untuk menemukan kode di edit html, bisa melihat caranya Disini

2 Anda cari kode berikut terlebih dahulu

]]></b:skin>

3. Letakkan Kode berikut Sebelum Kode di atas

/* kotak admin yusdanyun blogspot */
.admin-tulisan{display:block;width:aut

o;background:#000099;border:2px solid

#FF0000;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:#FFFFFF;}
.admin-tulisan

.kontainer{padding:5px;}
.admin-tulisan

h4{background:#8A9C04;border:none;bord

er-bottom:1px solid

#699019;color:#fff;text-transform:norm

al;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-tulisan h4 a{color:#FEEA83;}
.admin-tulisan

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.5s

ease;-webkit-transform:

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

rotate(-7deg);-o-transform:

rotate(-7deg);}
/* kotak admin yusdanyun blogspot */
</ div>
Lanjut Sobat

keterangan:

a. Warna biru untuk mengatur warna background
b. Warna merah untuk merubah warna border
c. Warna Hijau untuk merubah warna tulisan


4. Setelah itu anda cari kode

<div class='post-footer'>


5. Pastekan kode berikut di atas kode di atas dan apabila di template anda terdapat lebih dari satu kode <div class='post-footer'>, Saran saya pilih kode yang terakhir.

<!-- Kotak Admin yusdanyun blogspot -->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='admin-tulisan'>
    <h4>Creatif By : <a expr:href='data:blog.homepageUrl'><data:post.author/></a> | Jangan Pernah Katakan Tidak Bisa Sebelum Mencoba </h4>
    <div class='kontainer'>
    <img src='https://pbs.twimg.com/profile_images/547657265503686656/vEHCGAe4.jpeg'/>
    Terimah Kasih telah membaca artikel<a expr:href='data:post.url'><data:post.title/></a>. Yang ditulis oleh <data:post.author/> (Mr.Yus14) <data:post.dateHeader/>.  Jika anda ingin sebarluaskan artikel ini, mohon sertakan <blink><strong>sumber link asli.</strong></blink> Kritik dan saran dapat anda sampaikan di komentar, Trimakasih
    <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://diandiki.blogspot.com/2013/07/cara-membuat-author-box-kotak-admin-di.html' target='_blank'>:: Get this widget ! ::</a></span></p>
    <div style='clear:both;'/>
    </div>
    </div>
    </b:if>

    <!-- Kotak Admin yusdanyun blogspot-->

Keterangan:
Warna biru ganti Deskripsi blog anda
Warna Merah ganti dengan URL foto anda
Warna Hijau ganti dengan kata-kata anda sendiri
Selebihnya anda bisa mengedit sendiri


6. Pratinjau terlebi dahulu kalau sudah selesai simpan deh.

selamat mencoba...

(Diandiki/Yusdanyun/Berbagai-Sumber-Lain/ABNS)