Cara Membuat Foto Profil About Author Blogger Berbentuk Lingkaran

Cara Membuat Foto Profil About Author Blogger Berbentuk Lingkaran

Saat menggunakan gadget About Author di Blogger, foto profil penulis biasanya ditampilkan dalam bentuk kotak. Bagi Anda yang ingin membuat tampilannya lebih menarik, foto profil tersebut dapat diubah menjadi bentuk lingkaran hanya dengan menambahkan sedikit kode CSS.

Cara ini cukup sederhana dan bisa dilakukan melalui Edit HTML tema maupun Desainer Tema Blogger.

Cara Membuat Foto Profil About Author Blogger Berbentuk Lingkaran

Ada dua cara yang bisa digunakan untuk mengubah foto profil About Author menjadi lingkaran, yaitu melalui editor HTML tema dan melalui Desainer Tema.

A. Melalui Editor HTML Tema

Cara pertama adalah dengan menambahkan kode CSS langsung ke dalam kode tema Blogger.

  1. Masuk ke Blogger.

  2. Pilih menu Tema.

  3. Klik tanda panah di samping Sesuaikan, kemudian pilih Edit HTML.

  4. Cari kode ]]></b:skin>.

  5. Letakkan kode CSS berikut tepat di atasnya:

#Profile1 img {
  border-radius: 100%;
}
  1. Setelah kode ditambahkan, klik Simpan.

Sekarang buka blog Anda dan lihat bagian About Author. Foto profil yang sebelumnya berbentuk kotak seharusnya sudah berubah menjadi lingkaran.

B. Melalui Desainer Tema

Jika tidak ingin mengubah kode HTML tema secara langsung, Anda juga dapat menambahkan CSS melalui menu Desainer Tema.

Caranya sebagai berikut:

  1. Buka Blogger dan masuk ke menu Tema.

  2. Klik Sesuaikan.

  3. Pilih Lanjutan, kemudian cari bagian Tambahkan CSS.

  4. Masukkan kode berikut ke dalam kolom CSS:

#Profile1 img {
  border-radius: 100%;
}
  1. Setelah itu, klik Simpan atau Terapkan ke Blog.

Setelah CSS diterapkan, foto profil pada gadget About Author akan tampil dalam bentuk lingkaran.

Kesimpulan

Mengubah foto profil About Author Blogger dari bentuk kotak menjadi lingkaran sebenarnya cukup mudah. Anda hanya perlu menambahkan CSS border-radius pada gambar profil.

Kode tersebut dapat dipasang melalui Edit HTML tema atau melalui fitur Tambahkan CSS pada Desainer Tema. Cara ini terutama cocok untuk tema-tema Blogger lama yang masih menggunakan widget Profile dengan ID Profile1.

Semoga tutorial sederhana ini bermanfaat dan dapat membuat tampilan profil penulis di blog Anda menjadi lebih menarik.

Artikel Sebelumnya → Memuat judul...

Komentar