Cara Membuat Kotak Tentang Penulis/Author Box di Blog



HAIIIIII !!

Baru aja tadi aku nge post tentang Cara Membuat Open New Tab Semua Link Di Blog

Nah, sekarang mau share ilmu lagi nih. Itung-itung kan buat pahala

Nah, Kalian tau kan ada beberapa blog yang di bawah postingan di tulis :

"About The Autor, blablabla" Gak mudeng ya? Oke ini saya kasih pict nya



Klik Zoom aja kalau mau diperbesar yaaa 



Nah, penasaran? Mau membuatnya juga? Okee ikutin dengan teliti yaaa!

1. Masuk Ke akun blog kalian

2. Klik Rancangan -> Edit HTML -> Lanjutkan -> Centang Expand Template Widget

3. Copas Kode Berikut dan Letakkan di ATAS kode <div class='post-footer'>
<!-- Kotak Admin -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='admin-tulisan'>
<h4>Ditulis Oleh : <a expr:href='data:blog.homepageUrl'><data:post.author/></a> ~ Deskripsi Blog Anda</h4>
<div class='kontainer'>
<img src='https://lh5.googleusercontent.com/-tMB70qiGZgI/T-2l2mxNZZI/AAAAAAAAAdQ/15qTXD5Jrwo/s124/SP_A4083.jpg'/>
Artikel <a expr:href='data:post.url'><data:post.title/></a> ini diposting oleh <data:post.author/> pada hari <data:post.dateHeader/>. Terimakasih atas kunjungan Anda serta kesediaan Anda membaca artikel ini. Kritik dan saran dapat anda sampaikan melalui kotak komentar.
<p><span style='float:right;font:italic 10px Arial, Sans-Serif;'><a href=' http://websitepunyague.blogspot.com/2012/09/cara-membuat-kotak-tentang.html ' target='_blank'>:: Buat Widget Seperti Ini ::</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Kotak Admin -->
4. Kemudian Cari kode ]]></b:skin>

5. Copas Kode Berikut DIATAS kode ]]></b:skin>
.admin-tulisan{
display:block;
width:auto;
background:#CFE2E0;
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-tulisan .kontainer{padding:5px;}
.admin-tulisan h4{
background:#8A9C04;
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-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;
}

5. Klik Save, dan Lihat .

Penjelasan :

- Tulisan Warna Kuning Anda Isi dengan Deskripsi Blog anda

- Tulisan Warna Biru Anda ganti dengan URL Foto anda

- Tulisan Warna Merah bisa anda Edit sesuka hati anda


Nah, gampang kan?
Okeee segitu dulu yaaa, Salam Bloggers



13 comments:

  1. Keren mbak tutornya..., I Like this site...! Thanks ya..!

    ReplyDelete
  2. susah di pahami, ada yg simple ngk yg pke javascript ?

    ReplyDelete
    Replies
    1. hmmmm saya kurang tau. Tp kalau yang mau gampang, ya manual aja :)

      Delete
  3. kok tempat saya belum jadi kag,,
    gimana caranya kag ?

    ReplyDelete
  4. bisa dink kag, tapi up gambar cwo ya ?

    ReplyDelete
    Replies
    1. coba perhatikan kode ini https://lh5.googleusercontent.com/-tMB70qiGZgI/T-2l2mxNZZI/AAAAAAAAAdQ/15qTXD5Jrwo/s124/SP_A4083.jpg , lalu diganti sama url foto anda :)

      Delete
  5. Mantap tut nya :)
    makasih yah gan ntar dicoba..

    ReplyDelete
  6. kalau seandainya dibuat di sidebar kira2 bisa tidak??

    ReplyDelete
  7. saya tidak menemukan post footer di blog saya, jadi bisa di tarok dimana ya min.
    Daftar Yahoo Mail

    ReplyDelete
  8. Perkenalkan, saya dari tim kumpulbagi. Saya ingin tau, apakah kiranya anda berencana untuk mengoleksi files menggunakan hosting yang baru?
    Jika ya, silahkan kunjungi website ini www.kbagi.com untuk info selengkapnya.

    Di sana anda bisa dengan bebas share dan mendowload foto-foto keluarga dan trip, music, video, filem dll dalam jumlah dan waktu yang tidak terbatas, setelah registrasi terlebih dahulu. Gratis :)

    ReplyDelete

Silahkan berkomentar sesuai tema, gunakan kata-kata yang bijak dalam berkomentar.
No Iklan, No Spam, No Porn.
Komentar yang menyertakan link aktif, iklan, atau titip link, akan dimasukan ke folder SPAM.

Thankyou guys <3

 
Return to top of page Copyright © 2016 | Powered by Blogger Modified by TIA BLOG