√ Cara Menampilkan Author Profile Di Bawah Postingan Blogger

Author porfile merupakan salah satu widget blogger yang berfungsi untuk menampilkan ringkasan profil penulis artikel di suatu blog.

Di antara banyak pengguna blogspot ada beberapa yang menampilkan widget author profile atau profil penulis di bawah postingan blog mereka.

Menampilkan profil author di setiap postingan blog mempunyai nilai yang sangat baik untuk pembaca atau pengunjung situs Anda.

Mengapa?

Pembaca artikel yang berada di blog Anda akan mengetahui siapa penulis artikel tersebut, sehingga mereka dapat mengenal diri Anda.

Di beberapa situs luar negeri yang pernah aku kunjungi, hampir semuanya memakai atau menampilkan profil penulis di bawah postingan maupun di samping blog mereka.

Ada 2 macam widget author profile.

Yang pertama,

Sering di sebut dengan istilah author box atau kotak penulis.

Author box ini merupakan widget yang dibentuk dengan cara manual, ada banyak sekali macam arahan script yang dapat Anda gunakan untuk menciptakan widget author box.

Ciri lain dari widget ini biasanya dilengkapi dengan banyak sekali tombol media umum menyerupai facebook, twitter, instagram, youtube, google+ dan sebagainya.

Untuk menciptakan widget author box silahkan baca artikel ini:

1. Cara Membuat Widget Author Box Mirip Google Badge
2. Cara Membuat Widget Author Box Sederhana di Sidebar Blog

Yang kedua,

Di sebut dengan author profile atau profil penulis.

Artikel yang sedang Anda baca ini merupakan tutorial untuk menampilkan author profile di bawah postingan blog.

Widget author profile biasanya lebih praktis dan mempunyai integrasi dengan profil google+ Anda, sehingga status atau dongeng yang Anda tulis di profil google+ akan tampil pada widget ini.

Cara Menampilkan Author Profile di Bawah Postingan Blogger

Jika Anda ingin menampilkan profil penulis di bawah postingan blog, silahkan ikuti langkah-langkahnya di bawah ini.

1. Masuk ke Blogger.com
2. Klik Tata Letak > klik Edit di bab blog posts

3. Silahkan cetang kotak Tampilkan Profil Pengarang di Bawah Pos

4. Klik Simpan

5. Kemudian masuk ke halaman About Me Google+ dengan mengklik URL berikut ini:
https://aboutme.google.com/?referer=gplus

6. Klik tombol plus (+) di bab bawah menyerupai gambar di bawah ini:

7. Lalu akan muncul beberapa pilihan, silahkan klik Cerita. Jika tidak ada kemungkinan Anda sudah pernah membuatnya silahkan di edit kembali bab perkenalannya

8. Silahkan tulis Semboyan dan Perkenalan Anda, jikalau sudah klik OKE

Catatan:
Hindari penggunaan link aktif pada bab perkenalan, alasannya bab ini akan tampil di semua halaman postingan blog Anda.

9. Dalam keadaan default perkenalan yang Anda tulis bersifat pribadi, silahkan ubah menjadi publik dengan cara mengklik ikon gembok menyerupai gambar di bawah ini:

10. Kemudian klik Publik, kemudian reload halaman maka gambar gembok akan berkembang menjadi gambar dunia berwarna hijau

5. Kemudian buka tautan ini : https://www.blogger.com/edit-profile.do
6. Pada bab Privasi silahkan centang pada kotak Bagikan profil saya, kemudian scroll ke bawah pada bab Informasi Tambahan silahkan isi pada kotak Perkenalkan Diri Anda, jikalau sudah klik Simpan Profil.

Sampai di atas seharusnya profil penulis sudah dapat muncul di bawah postingan blog, silahkan Anda cek terlebih dahulu.

Jika belum tampil, silahkan ikuti langkah-langkah di bawah ini untuk menciptakan widget author profile di bawah postingan blogspot dengan menambahkan beberapa baris arahan HTML dan CSS.

Cara Membuat Author Profile di Bawah Postingan Blogger

Setelah menerapkan cara di atas tapi widget profil penulis belum juga muncul silahkan tambahkan arahan ini di bab template blog Anda.

1. Masuk ke Blogger.com
2. Klik Tema > Edit HTML
3. Cari arahan <data:post.body/> biasanya ada 1 hingga 3 arahan menyerupai ini
4. Copy arahan HTML di bawah ini, kemudian Paste di bawah arahan <data:post.body/> yang pertama

<b:if cond='data:post.authorAboutMe'> <div class='author-profile' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'> <b:if cond='data:post.authorPhoto.url'> <img alt='author profile' expr:src='data:post.authorPhoto.url' itemprop='image' title='author profile' width='90px'/> </b:if> <div> <a class='g-profile' expr:href='data:post.authorProfileUrl' itemprop='url' rel='author' title='author profile'> <span itemprop='name'><data:post.author/></span> </a> </div> <span itemprop='description'><data:post.authorAboutMe/></span> </div> </b:if>

Catatan:
Jika di simpan di bawah arahan <data:post.body/> yang pertama tidak berhasil silahkan simpan pada arahan yang terakhir.

5. Agar tampilannya manis silahkan tambahkan arahan CSS di bawah ini, simpan di atas arahan ]]></b:skin> atau </style>

/* Author Profile */ .author-profile {     overflow: hidden;     margin: 30px 0;     line-height: 1.5; } .author-profile img {     border: none;     float: left;     margin-right: 15px;     border-radius: 46px; } .author-profile > span {     font-size: 14px;     color: #888; } .author-profile a.g-profile {     font-weight: 500;     color: #444444;     font-size: 18px;     margin-bottom: 5px;     display: inline-block; } .author-profile a.g-profile:hover {     color: #49ACE1; } .author-profile a.g-profile:after {     content: "\f058";     font-family: FontAwesome;     font-style: normal;     font-weight: normal;     text-decoration: inherit;     padding-right: 4px;     color: #49ACE1; }

6. Lalu klik Simpan tema

Jika berhasil maka akibatnya akan menyerupai pada gambar di bawah ini:

Catatan:
Jika tanda centang biru tidak muncul, silahkan tambahkan arahan Font Awesome ke template blog Anda. Silahkan Copy arahan di bawah ini kemudian Paste di atas arahan </body>

<link href='//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>

Itulah artikel mengenai cara menampilkan author profile di bawah postingan blogger, selamat mencoba. Semoga bermanfaat.

Terakhir di update pada 20/08/2019.
Sumber http://www.caramanual.com