Membuat Author Box/ About Simpel + Media Sosial

Santos el Salam

2 Maret 2020

Agar pemilik blog bisa dikenal dengan mudah oleh pengunjungnya, biasanya sebagian blogger memunculkan keterangan tentang dirinya atau blog miliknya pada sebuah fitur khusus berupa widget yang disebut about me (profil) atau juga kolom author/admin. Kebanyakan blogger biasanya meletakkan fitur ini di bawah postingan, meski banyak juga yang meletakannya di area footer seperti di blog saya ini.

Author box atau fitur about me ini biasanya berisi foto dan deskripsi singkat tentang penulis atau blog miliknya. Selain itu, untuk lebih detailnya lagi fitur ini adakalanya dilengkapi pula dengan link menuju sosial media milik penulis agar mudah ditemukan oleh banyak orang. 

Bagi pemakai platform blogspot, sebetulnya fitur ini sudah tersedia pada menu tataletak. Kita tinggal memasangnya dengan menambahkan gadget dan pilih profile. Lihat di bawah ini. 

Meski demikian, ternyata jarang blogger yang menggunakan fitur tentang profil standar dari blogspot ini. Mungkin tampilannya yang terlalu biasa sehingga kebanyakan blogger memilih untuk membuat tampilannya sendiri atau memodifikasinya agar terlihat lebih menarik. 

Keberadaan fitur ini memang cukup penting bagi pengunjung yang ingin kenal lebih dekat dengan pemilik blog, sehingga misalnya lewat media sosial yang dicantumkan mereka bisa berinteraksi langsung dengan admin blog tersebut. Selain itu, bagi pemilik blog fitur ini juga bisa untuk mempromosikan dirinya atau blognya agar pembaca lebih mudah dalam mengetahui profil pemilik blog atau gambaran artikel-artikel yang ada pada blog tersebut.

Bisa dibilang intinya penggunaan author box/ about me ini merupakan satu dari sekian cara bagi penulis blog untuk berinteraksi dengan pembacanya. Selain itu, fitur about me/author box ini bisa juga berisi himbauan dari penulis tentang postingan-postingan yang dibuatnya. 

Pada kesempatan kali ini, saya akan membagikan cara membuat widget Author Box/About Me di blog dengan tampilan simpel namun tetap keren dilengkapi dengan ikon media sosial bagi admin pemilik blog.

Untuk tampilannya silahkan lihat pada gambar pertama di atas. Anda bisa meletakannya di bawah postingan, area footer, di sidebar, atau di manapun tempatnya terserah anda. Untuk cara memasangnya, silahkan ikuti langkah-langkah berikut ini. 

1. Buka akun blogger anda. 

2. Pilih menu tataletak (layout), tambahkan gadget, dan pilih html/ javascript. 

3. Setelah terbuka, silahkan beri judul terserah anda dan kemudian letakkan kode berikut ini ke dalam kotak html/ javascript yang tersedia. 

<div style="border: 1px #000000 solid; padding: 13px; background-color: #ffffff;color:#000000;">

<div style="float:left; margin-right:10px;margin-bottom:10px">

<div class='authorboxwrap'> 

 <div class='authorboxfull'> 

 <div class='avatar-container'> 

 <img src='https://isi dengan URL gambar profil anda.jpg'  height='60' width='60'/> 

 </div></div></div></div>

<p><b>Santos Blog</b> - Blog sederhana yang menyajikan aneka ragam pengetahuan dan informasi-informasi menarik.</p>

<div style="margin-left:-4px">

<style>

.simplifymedsos a{display:inline-block;text-align:center;font-size:18px;margin-top:-5px;margin-right:5px;color:#fff;border-radius:100%;opacity:.9}.simplifymedsos a i{font-family:Fontawesome;width:32px;height:32px;line-height:32px;display:block}.simplifymedsos a:hover{color:#fff;opacity:1;transform:rotate(360deg)}.simplifymedsos .facebook{background:#3b5998}.simplifymedsos .twitter{background:#00aced}.simplifymedsos .youtube{background:#dd4b39}.simplifymedsos .rssfeed{background:#ee802f}

</style>

<div class="simplifymedsos" style="margin: 5px;">

<a class="facebook" href="https://m.facebook.com/xxxxxxxxx" rel="nofollow" target="_blank"><i class="fa fa-facebook"></i></a>

<a class="twitter" href="https://www.twitter.com/xxxxxxxx" rel="nofollow" target="_blank"><i class="fa fa-twitter"></i></a>

<a class="youtube" href="https://www.youtube.com/channel/xxxxxxxxxxxx" rel="nofollow" target="_blank"><i class="fa fa-youtube"></i></a>

<a class="rssfeed" href="https://feedburner.google.com/fb/a/mailverify?uri=xxxxxxxxx" rel="nofollow" target="_blank"><i class="fa fa-rss"></i></a>

</div>

</div>

</div>

Keterangan: 

• Tulisan berwarna merah untuk gambar profil, silahkan ganti dengan Url foto profil anda.

• Tulisan berwarna hijau untuk deskripsi tentang anda atau Blog anda, silahkan sesuaikan atau isikan sesuai keinginan.

• Tulisan berwarna biru untuk sosial media milik anda, silahkan sesuaikan dengan Url masing-masing media sosial milik anda.

4. Jika sudah diatur semuanya, silahkan simpan dan anda bisa lihat hasilnya.

Sedangkan untuk pemasangan di bawah postingan, anda bisa masuk pada menu edit html, cari kode <data:post.body/> dan kemudian letakkan kode di atas pada area di bawahnya. Silahkan simpan template.

Demikianlah Cara Membuat Author/ About Blog Simpel + Media Sosial. Semoga bermanfaat. 

Labels: Blogging

Thanks for reading Membuat Author Box/ About Simpel + Media Sosial. Please share...!

Facebook

Twitter