Cara Menampilkan Author Profile Di Bawah Postingan Blogger - Gasskeun Cara Menampilkan Author Profile Di Bawah Postingan Blogger | Gasskeun

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 isyarat 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.

Author porfile merupakan salah satu widget blogger yang berfungsi untuk menampilkan ringka Cara Menampilkan Author Profile di Bawah Postingan Blogger

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

Author porfile merupakan salah satu widget blogger yang berfungsi untuk menampilkan ringka Cara Menampilkan Author Profile di Bawah Postingan Blogger

3. Silahkan cetang kotak Tampilkan Profil Pengarang di Bawah Pos

Author porfile merupakan salah satu widget blogger yang berfungsi untuk menampilkan ringka Cara Menampilkan Author Profile di Bawah Postingan Blogger

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:

Author porfile merupakan salah satu widget blogger yang berfungsi untuk menampilkan ringka Cara Menampilkan Author Profile di Bawah Postingan Blogger

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

Author porfile merupakan salah satu widget blogger yang berfungsi untuk menampilkan ringka Cara Menampilkan Author Profile di Bawah Postingan Blogger

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

Author porfile merupakan salah satu widget blogger yang berfungsi untuk menampilkan ringka Cara Menampilkan Author Profile di Bawah Postingan Blogger

Catatan:
Hindari penggunaan link aktif pada bab perkenalan, alasannya yaitu 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:

Author porfile merupakan salah satu widget blogger yang berfungsi untuk menampilkan ringka Cara Menampilkan Author Profile di Bawah Postingan Blogger

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

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 isyarat 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 isyarat ini di bab template blog Anda.

1. Masuk ke Blogger.com
2. Klik Tema > Edit HTML
3. Cari isyarat <data:post.body/> biasanya ada 1 hingga 3 isyarat menyerupai ini
4. Copy isyarat HTML di bawah ini, kemudian Paste di bawah isyarat <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 isyarat <data:post.body/> yang pertama tidak berhasil silahkan simpan pada isyarat yang terakhir.

5. Agar tampilannya cantik silahkan tambahkan isyarat CSS di bawah ini, simpan di atas isyarat ]]></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 jadinya akan menyerupai pada gambar di bawah ini:

Author porfile merupakan salah satu widget blogger yang berfungsi untuk menampilkan ringka Cara Menampilkan Author Profile di Bawah Postingan Blogger

Catatan:
Jika tanda centang biru tidak muncul, silahkan tambahkan isyarat Font Awesome ke template blog Anda. Silahkan Copy isyarat di bawah ini kemudian Paste di atas isyarat </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.
Sumber https://www.caramanual.com/

Related Posts