Cara Membuat Widget Author Box

Bagi anda yang suka menghias tampilan blog, maka widget author box ini perlu anda coba karena selain bisa lebih exsis untuk author, kita juga bisa menyelipkan sebuah kata-kata motivasi atau yang lainnya sesuka anda.

WWW.RHM-FILES.TK

Bagi yang berminat untuk membuat widge author box ini, silahkan ikuti tutorialnya yang sangat mudah.

Cara Membuat Widget Author Box

1. Buka akun blogger.

2. Pilih menu template dan klik edit HTML

3. Silahkan letakan kode dibawah ini tepat diatas kode </style> atau ]]></b:skin>

/* Author Box */ .authorboxwrap{background:#fafafa;padding:15px;overflow:hidden;margin-left:-20px;margin-right:-20px;margin-bottom:-21px;border-bottom:1px solid #e6e6e6;border-top:1px solid #e6e6e6} .avatar-container {float:left;margin-right:10px;} .avatar-container img{background:#eee;width:70px;height:auto} .author_description_container h4{font-weight:600;font-size:16px;display:block;margin-bottom:10px} .author_description_container h4 a{color:#333} .author_description_container h4 a:hover{color:#111;text-decoration:underline} .author_description_container p{margin:0 0 10px;color:#333;line-height:normal;font-size:95%}

4. Selanjutnya letakan kode di bawah ini tepat diatas kode </article>

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='authorboxwrap'> <div class='authorboxfull'> <div class='avatar-container'> <a href=''> <img class='author_avatar img-circle' expr:alt='data:post.author' expr:src='data:post.authorPhoto.url' height='96' width='96'/> </a> </div> <div class='author_description_container'> <h4><a href='#' rel='author'><data:post.author/></a></h4> <p> <data:post.authorAboutMe/> </p> </div> </div> </div> <div style='clear:both'/> </b:if>

5. Terakhir save template anda dan lihat hasilnya.

Sekian untuk tutorial "Cara Membuat Widget Author Box Di Bawah Posting Blog" lebih dan kurangnya saya mohon maaf. sukses selalu.