Cara membuat widget Profil Admin V.2 (About The Author)

HaiSob apa kabar 😁? Ok sobat pada kesempatan ini haisob.com akan membagikan widget yang dapat kamu gunakan sebagai informasi siapa penulis blog dan dimana dapat menemukannya.

Agar terjadi hubungan atau komunikasi yang baik antara kamu sebagai penulis dan pembaca, salah satu cara adalah dengan memasang widget Author Box seperti ini, yang menjelaskan "about the author". Widget ini biasanya mengarahkan pembaca ke halaman profil admin agar pembaca yang ingin mengetahui lebih jelas siapa admin blog tersebut dapat dengan mudah menemukannya.

Cara Memasang Widget Profil About Me di Blog
About Me

Cara memasang widget Author Box di Blogger


1. Di Blog kamu 😄
2. Pilih menu Tata Letak  ➜ Tambahkan Gadget.
3. Kemudian pilih widget HTML/JavaScript

Cara membuat widget "Profil Admin V.2" (Author Box) di Blog
Tata Letak ➔ Tambah Gadget ➔ HTML / Javascript

4. Masukan kode di bawah ini ke dalam kotak yang tersedia.
<div class="haisob"> <img alt="haisob" class="haisob-gambar" src="https://lh3.googleusercontent.com/-WGwb64kaeJU/U42l-O1XOOI/AAAAAAAABuc/rZY30edw52k/w140-h139-p/brando%2Bmewo.jpg" title="Brando" /> <a class="cipsfb" href="http://facebook.com/haisob" rel="nofollow" target="_blank">f</a> <a class="cipsgp" href="http://plus.google.com/103662134309614692674" rel="nofollow" target="_blank">G</a> <a class="cipstw" href="http://twitter.com/brandomewo" rel="nofollow" target="_blank">t</a> <div class="cipsdeskripsi"> Hallo, Nama saya <b><a href="http://facebook.com/brandomewo">Brando Mewo</a>,</b> Saya <b>lahir</b> di kota <br /> Manado, ADD sosial Network saya. <a href="http://www.haisob.com" target="_blank"> Read More »</a></div></div>
<style>
.haisob { width:auto; margin:0; height:95px; padding:5px; border:1px solid #ddd; }
.haisob-gambar { float:left; width:85px; height:85px; margin:4px 1px 1px 3px; opacity:0.8; border-top:2px solid #cf2031; border-right:2px solid #0f7dc8; border-bottom:2px solid #2eb31a; border-left:2px solid #eab823; }
.cipsdeskripsi { width:auto; padding:0 0 0 20px; font-family:arial,sans-serif; margin:-90px 0 0 110px; font-size:11px; color:#ff000; }
.cipsfb,.cipsgp,.cipstw { color:#fff !important; display:block; font-weight:bold; line-height:14px; height:14px; width:14px; border:3px solid #444; text-align:center; padding:3px; border-radius:15px; font-size:13px; text-decoration:none !important; margin:5px; position:relative; margin-right:0; }
.cipsfb { background:#3B5998; margin-left:95px; }
.cipsfb:hover { border-color:#4F77CC; box-shadow:0 0 3px #4F77CC; }
.cipsgp { background:#D34836; font-size:12px; margin-left:95px; }
.cipsgp:hover { border-color:#EB503C; box-shadow:0 0 3px #EB503C; }
.cipstw { background:#4099FF; margin-left:95px; }
.cipstw:hover { border-color:#36D0FF; box-shadow:0 0 3px #36D0FF; }
</style>
5. Silahkan ganti kode berwarnah merah dengan foto profil kamu, warna biru dengan link medsos kamu dan warna hijau dengan nama kamu, dan lain-lain yang perlu kamu ubah, sesuaikan saja.
6. Save

Profil Admin V.1

Kotak tetang admin penulis blog
Widget Profil Admin

Jika kamu tertarik dengan tampilan V.1 kamu dapat membaca artikelnya DISINI

Ok sobat sekian widget blog yang dapat dibagikan saat ini, jangan lupa lihat tutorial blog terbaru dari HaiSob, semoga bermanfaat.
Join This Site