Cara Membuat Widget About Me Seperti Pada Template Invision Arlina Design

blogger mana mana sih yang tak kenal dengan website arlina design? atau mbak arlina? tentu dia merupakan seorang blogger  yang sangat akif hingga saat ini. Dea tidak begitu mengenal mbak arlina. tapi yang Dea tau. mbak arlina sering membuat sebuah template dari yang free hingga yang berbayar. untuk dibagikan kepada orang orang yang memang membutuhkan template gratisan untuk didaftarkan pada google adsense.  atau memang membuat blog blog tersebut terlihat SEO agar selalu muncul pada page 1 google. mbak arlina juga mempunyai sebuah website lain selain ArlinaDesign. yap. IdnTheme. disanalah dia sering membagikan hasil karyanya. tentu kamu yang masih baru berkecimpung didunia blogger. pasti tidak akan menyangka bahwa template yang sudah dibuatnya seorang diri itu sudah ada belasan bahkan puluhan.. dan disini Dea akan membagikan widget yang dibuat oleh mbak arlina. tentu widget yang satu ini sangat cocok bagi kamu yang memang ingin memperlihatkan wajah asli kamu dan beberapa social media yang kamu miliki agar orang orang tau bahwa itu kamu. tentu kamu harus melihat tahap demi tahap dibawah ini dengan seksama..

Step By Step :

• Masuklah ke blogger kamu terlebih dahulu disini
• Jika sudah maka pergilah ke menu "Tema" lalu Click tombol "Edit HTML"
• Disini carilah code </Style> dengan menekan tombol pada keyboard CTRL + F. lalu masukan code </style> pada kotak textbox yang muncul tersebut. atau scroll pada kotak HMTL disana sampai ketemu.
• Jika sudah maka copy dan pastekan seluruh code yang ada dibawah ini tepat diatas code </style> tersebut :

/* About Me */
.aboutme-img{position:relative;max-height:150px;overflow:hidden}
.aboutme-img img {max-width:100%;width:100%;}
.aboutme-wrpicon{display:block;margin:15px auto 10px auto;position:relative;}
.aboutme-wrpicon .extender{width:100%;display:block;}
.extender{text-align:center;font-size:16px}
.extender .aboutme-icon{background:rgba(0,0,0,.06);display:inline-block;border:0;margin:0;padding:0;border-radius:3px}
.extender .aboutme-icon:hover{background:#bbb;}
.extender .aboutme-icon a{display:inline-block;font-family:fontawesome;font-weight:400;color:#aaa;height:32px;width:32px;line-height:32px;border-radius:3px}
.extender .aboutme-icon:hover a,.extender .aboutme-icon a:hover{color:#fff;}
.aboutme-info{margin-top:20px;font-size:13px}
.aboutme-info p{margin:5px 0}
.aboutme-info h4{margin-bottom:10px;font-size:16px;text-transform:uppercase;color:#888;font-weight:700}

• Setelah itu jika sudah. maka click tombol "Simpan". sekarang menuju ke tahap selanjutnya
• Disini pergi ke menu "Tata Letak". Jika sudah maka click tulisan "Tambahkan Gadget" pada Sidebar blog (sidebar itu maksudnya body samping blog ya).
• Jika sudah seharusnya akan muncul sebuah tabel. disini pilih "HTML/Javascript"
• Copy Dan pastekan code dibawah ini tepat pada kotak kolom besar di "HTML/javascript" Tersebut :

div class='widget-content'
<div class='sidebar_about_author'>
<div class='inner_wrapper'>
<div class='aboutme-img'>
<img alt='Author' class='img-responsive' height='auto' src='http://3.bp.blogspot.com/-lvVwsFNiq3A/VUTQLvTOHsI/AAAAAAAAJ7Y/NEqRWmXcEVo/s1600/Ripple%2BTheme.jpg' title='Author' width='300'/>
</div>
</div>
<div class='aboutme-info'>
<h4>Invision</h4>
<p>Cerita yang memang kamu awali itu sangat menyakitkan</p>
</div>
<div class='aboutme-wrpicon'>
<ul class='extender'>
<li class='aboutme-icon'><a href='#' rel='nofollow' target='_blank' title='Facebook'><i class='fa fa-facebook'/></a></li>
<li class='aboutme-icon'><a href='#' rel='nofollow' target='_blank' title='Twitter'><i class='fa fa-twitter'/></a></li>
<li class='aboutme-icon'><a href='#' rel='nofollow' target='_blank' title='GitHub'><i class='fa fa-github'/></a></li>
<li class='aboutme-icon'><a href='#' rel='nofollow' target='_blank' title='Google+'><i class='fa fa-instagram'/></a></li>
<li class='aboutme-icon'><a href='#' rel='nofollow' target='_blank' title='Pinterest'><i class='fa fa-pinterest-p'/></a></li>
</ul>
</div>
</div>
</div>

• Jika sudah dicopas. maka gantilah tulisan dicoret bergaris merah tersebut dengan url foto Profil kamu
• Ganti Tulisan Berwarna Merah tersebut Dengan Nama kamu
• Ganti Tulisan Berwarn Putih Dicoret Dengan Garis Putih tersebut dengan Deskripsi kamu
• Ganti tulisan yang dicoret berwarna putih tersebut dengan Deskripsi tentang kamu/blog kamu
• Ganti symbol pagar berwarna Hijau tersebut dengan url Social Media kamu
• Dan yang terakhir Ialah dengan cara memberikan tulisan "About Me" pada kotak kolom kecil (Judul) sebelum kamu click tombol "Save/simpan" diatas kolom besar tersebut