Top Social

Tips Membuat About Me di Sidebar blog yang Keren

|
Kalau lagi blogwalking, aku sering lihat About Me yang keren di sidebar blognya. Misalnya punya Mba Icha annisast.com ini

Cantik ya?
:D

Awalnya mengira itu adalah hasil dari gadget/widget blog, sehingga kemudian aku search about me gadget/widget blogspot di Google tapi tidak juga ketemu yang mirip Mba Icha ini.
Aku sempat mencoba menggunakan gadget  image, teks tapi tiap gadget mengharuskan ada judul sehingga hasilnya malah aneh.
Hehehe
Kemudian aku pun mengira hal tersebut merupakan privilage yang domain .com aja (lebih sering melihat about me keren di blogger dengan domain .com) .

Hingga suatu hari, aku mampir ke blog Audi yaitu Noteblog milik Audi dan melihat domainnya sama sepertiku blogspot.com tapi about me di sidebar blognya cantik :D


Aku memberanikan diri menyapa dan bertanya cara membuat about me di sidebar blog kepada Audi melalui google hangout.
Alhamdulillah Audi merespon pertanyaanku dan, thanks to her, sekarang aku tahu bagaimana caranya!
Yeay! (^0^)/

Untuk kalian yang juga penasaran tentang membuat about me di sidebar blog yang keren, aku mau berbagi caranya!

Penjelasan cara membuat "about me di sidebar blog yang keren" versi singkat: buat about Me di post blog, kemudian copy HTMLnya dan gunakan gagdet HTML.

Versi panjang:
1. Klik New Post atau Create New Post
atau 

2. Klik insert image dan Upload Foto diri kalian yang ingin kalian gunakan untuk About Me.
Foto yang diupload sebaiknya telah diedit terlebih dahulu atau minimal diresize sesuai ukuran sidebar blog kalian. Ukuran sidebar blogku adalah 265 sehingga aku menggunakan foto dengan ukuran 250 x 250.
Untuk inspirasi dalam mengedit foto untuk About Me, bisa cek artikel How to Create a Killer Blog Sidebar Profile Bio + Photo oleh @marianney :D



3. Ketik deskripsi diri dan deskripsi blog kalian



4. Untuk logo sosial media, aku copy dari blog Noteblog milik Audi dan kemudian mengedit linknya. Bisa coba copy logo sosmed di bawah ini terus paste dan edit link.
     

Edit link dengan cara klik logo icon yang telah di paste kemudian klik link dan isi bagian To what URL should this link go? sesuai alamat url akun social media kita, sementara bagian text to display dibiarkan kosong saja. Jika selesai kemudian pilih Ok.


 atau bisa juga dengan cara mengupload image logo seperti cara di video ini :



5. Setelah selesai dengan foto, deskripsi dan logo, Klik bagian HTML, copy All (tekan Ctrl+A dan Ctrl+C)

6. Setelah selesai, di new tab buka layout, klik add gadget. pilih HTML/Java Script
7. Paste (Ctrl+V) di bagian content dan beri judul "About me" atau judul apapun yang kalian inginkan dan klik save


8. Klik preview, jika kalian suka klik save arrangement. Selesai
9. Jika kurang suka, edit saja post tempat yang kalian upload foto dan deskripsi, copy paste lagi kode HTML di gadget HTML/Java Script.


Ini hasilku:




Cara ini juga berlaku untuk yang wordpress. 

buat blogpost baru dengan klik add blog post
lalu upload foto yang sudah diedit dan diresize
ketik deskripsi diri dan blog
copas logo dan edit link

setelah selesai klik html, copy html
ke bag theme klik costumize
terus ke widgets -> primary sidebar --> add a widget, pilih atau search text widget, paste code HTML yang tadi telah dicopy ke bag content dan ketik about me di bagian title
klik close di bagian bawah
kemudian klik save & publish :D

Aku menerapkan hal serupa untuk blog wordpressku, Hana Book Review dan ini hasilnya:



Jika merasa caraku cukup ribet, bisa berkunjung ke blog Heru,
Tips membuat about me dari Heru sudah menyediakan html
yang bisa dicopy paste dan siap edit.
Selamat mencoba dan semoga berhasil membuat about me yang keren!
Semoga bermanfaat! :D

118 komentar on "Tips Membuat About Me di Sidebar blog yang Keren"
  1. Yeay numpang eksis wkwk

    BalasHapus
    Balasan
    1. Makasih banyak ya *\(ˆ⌣ˆ*\)(/*ˆ⌣ˆ)/* akhirnya pencarian gue terjawab :D

      Hapus
    2. Mau tanya, Nama Template nya apa iya ?

      Hapus
    3. Nama templatenya Watercolor premade blogger template https://www.etsy.com/listing/236832812/watercolor-premade-blogger-template

      Hapus
  2. Inii diaaa yang kucari-cari akhirnyaa..
    Makasih yaa mbak..
    Hehee
    Ga bingung lagii

    BalasHapus
    Balasan
    1. Alhamdulillah sama-sama Mba :D seneng denger postingan ini membantu :")

      Hapus
  3. waah menarik sekaliii. pengen nyobaiin hihi. terima kasih sharingnya mbak ♥

    My Little Cream Button ♥

    BalasHapus
  4. ohiya aku udah follow blognya, salam kenal yaa ^^

    BalasHapus
    Balasan
    1. Terima kasih :D salam kenal juga :D hana follow balik ya :)

      Hapus
  5. Mba Hana, makasih yaa. Aku pengen buat tapi ntar aku coba lagi deh. Masih belum berhasil. Mungkin karna biin sambil kerja ya. Hahahaa

    BalasHapus
    Balasan
    1. sama-sama :D semangat :D semoga berhasil Mba Alida :D

      Hapus
  6. Hana, makasih sharingnya ya... pengen buat deh.. doakan semoga berhasill.. btw aku udah follow blog kamu ya :)

    BalasHapus
    Balasan
    1. ya amin :D hana bantu doa semoga mba berhasil :D makasih banyak mba :D udah hana follow balik ya :)

      Hapus
  7. Untuk html icon social media nya bisa di share mbak Hana?
    Sy cari di link kok ga ada ya?
    Trima kasih banget sebelumnya 😘

    BalasHapus
    Balasan
    1. Terima kasih pertanyaannya mba heni.. :)
      saya copy punya audi Mba :)
      Mba juga bisa copy punya saya :D
      caranya block logo icon social media saya atau audy, lalu klik copy paste..

      saya tadinya mau paste html kode saya di comment ini tapi muncul peringatan Your HTML cannot be accepted: Tag is not allowed: DIV


      Hapus
    2. atau kita chat via google hangout atau mungkin saya coba kirim melalui email..
      email mba apa? :)

      Hapus
  8. terimakasih bnyak mbak sharingnya. mudah langsung di praktekin. (y)
    sukses terus mbak

    BalasHapus
  9. sama-sama tegar :) amin.. makasih doanya :D sukses juga buat kamu :D

    BalasHapus
  10. Gampang ya kayaknya. Hehe.. coba ahh..

    BalasHapus
    Balasan
    1. Ya gampang kok Mba :) Selamat mencoba! :)

      Hapus
  11. catet...catet...makasih banyak ya mbak...ntar aku coba

    BalasHapus
  12. Yang wp gimana mba?.
    Blogku wp, pengin juga kece kayak blog ini.

    BalasHapus
    Balasan
    1. sama aja, mba :D
      mba buat blogpost baru dengan klik add blog post
      lalu upload foto yang sudah diedit dan diresize
      ketik deskripsi diri dan blog
      copas logo dan edit link

      setelah selesai klik html, copy html
      ke bag theme klik costumize
      terus ke widgets -> primary sidebar --> add a widget, pilih atau search text widget, paste code HTML yang tadi telah dicopy ke bag content dan ketik about me di bagian title
      klik close di bagian bawah
      kemudian klik save & publish :D

      Semoga membantu ya Mba :D

      Hapus
    2. Aku bakalan noyoba tips kakak
      Makasih kak any way salam kenal kak aku rina

      Hapus
  13. Halo Hana salam kenal:) iss keren deh 'about me' nya, tfs, cuss coba juha ah hehe

    BalasHapus
    Balasan
    1. salam kenal mba dewi... selamat mencoba :D semoga berhasil ya :D

      Hapus
  14. Thanks for sharing mbak Hana :)
    Salam kenaal :)

    BalasHapus
    Balasan
    1. sama2 Mba anistia :D salam kenal juga :D

      Hapus
  15. Hai mba Hana, makasih loh udah share. udah aku coba juga. kalo fotonya circle gitu gimana mba? punyaku square jadinya. atau diedit dulu?

    BalasHapus
    Balasan
    1. Hai mba egi :) sama2 :) ya itu fotonya diedit dulu Mba. Kalau Hana pakai PicsArt. Download PicsArt app di hape, trus ada pilihan shape di app itu dan pilih aja yang bulat nanti foto kita bentuk circle :) semoga jawaban hana membantu ya :)

      Hapus
    2. Terimakasih, kebetulan sudah selesai diotak atik semalam. aku pake picmonkey :)

      Hapus
    3. Alhamdulillah ya bisa ketemu caranya :D wah berarti bisa pakai pic monkey juga? :) makasih mba :D

      Hapus
  16. waaa makasih buat ilmu barunya mbak. Salam kenal

    BalasHapus
  17. mbak makasih, aku langsung coba.. dan berhasil

    BalasHapus
    Balasan
    1. sama-sama mba :D senang bisa membantu :D

      Hapus
  18. siang mba hana :) sekedar blogwalking aja nih tapi keren postingannya, nanti saya coba di blog saya http://www.ridnesia.site/

    BalasHapus
  19. sip, senasib banget. aku juga ng-stalk punyanya mbak Annisast aku tertarik banget sama about me-nya tapi aku nyerah.. eh ada yang bahas.
    suer aku seneng banget.. makasih mbak :*

    BalasHapus
    Balasan
    1. Aah.. sama (^_^)/\(^_^)
      Senang bisa membantu :D
      Semoga berhasil membuat about me yang keren :)

      Hapus
    2. mbak, yang read more itu tau tips ngegantinya ga??
      soalnya ku tertarik sama punyanya mba Icha dkk :a kalo ada bagi ya mbak^^ ? :v

      Hapus
    3. Mungkin bisa baca http://icanbuildablog.com/2015/05/how-to-change-the-blogger-read-more-link/ :)

      Hapus
  20. makasih ya mba, bermanfaat banget tips tips blogging kaya gini kalo buat pemula kaya aku, salam kenal^^

    devifitris.blogspot.com

    BalasHapus
    Balasan
    1. sama-sama :D salam kenal juga mba devi :)

      Hapus
  21. thank you mbak xD membantu sekalllleyyy~ xD

    BalasHapus
  22. wahh keren ini tips nya (y)

    BalasHapus
  23. Wahh terima kasih ya kakk ini membantu aku bgt setelah aku ngubek2 google:""))) Makasih banyak yaa kak hihii >,<

    BalasHapus
    Balasan
    1. Sama2 Annisya :) makasih juga udah komen :D

      Hapus
  24. terima kasih sangat.. sangat2 membantu blogger baru seperti saya.. jemput jenguk2 blog saya ya...
    https://atynmunawwarah.blogspot.my/

    BalasHapus
    Balasan
    1. sama-sama mba fatin :D hana sudah berkunjung ya :D

      Hapus
  25. bagus untuk pemula ni hhe, awalnya ngira buatnya pake gadget/widget juga, tapi hasilnya beda, alhamdulillah dapat artikel ini :D :D

    salam kenal ya mbq :)
    rafnipuspitapohan.blogspot.co.id

    BalasHapus
  26. makasih mbaaa membantu bgt hehe

    http://wurrypandansari.blogspot.com

    BalasHapus
  27. waah.. terimakasih mbak infonya.. :))

    oia kalau mau bikin model menu baru seperti di blog mbak ini gimana ya?

    makasi mbak ..

    BalasHapus
  28. HTML-nya mana ya?
    Kok gak nemu,..
    Makasih..

    BalasHapus
  29. thank's ilmunya ka.
    mampir yah di blog saya.
    alfatichanakabak.blogspot.com

    BalasHapus
  30. Makasih banyak mba, akhirnya ktmu yang sesuiai keinginan

    BalasHapus
  31. tampak ribet buat yang gaptek kayak saya.. tapi mestinya tetep nyoba sih :D nuhun sharingnya ya!

    BalasHapus
  32. Wah artikel ini kaya nya menarik boleh saya coba?

    BalasHapus
  33. Artikel menarik, kebetulan saya baru re-design blog saya, jadi pengen coba mempraktekan, btw resize foto nya pake apa?, di edit dibikin buletnya pake photoshop?

    salam kenal ya sebelumnya :)

    BalasHapus
  34. tengkiyu kaka artikel nya krennnn, makasih yea

    BalasHapus
  35. Cantik banget blognya ukhty, artikelnya juga bermamfaat buat para blogger. kalo ada waktu mampir juga ke gubuk ane

    BalasHapus
  36. waduu, makasi lo kak hehe. kali kali mampir blog saya www.fajdesign.com
    big thanks ya

    BalasHapus
  37. :a makasih ya tipsnya, very usefull :)

    BalasHapus
  38. Thank you thank you and thank you..

    BalasHapus
  39. Makasih mba tutorialnyaa, ini langsung kupraktekkan hehe...

    BalasHapus
  40. Kak Hana, penjelasannya sangat mudah diikuti berat adanya gambar-gambar. Terima kasih, ya! Haha, aku sudah lama penasaran dengan sidebar profile, tetapi tidak tahu kata kunci yang tepat untuk googling. ^^

    BalasHapus
    Balasan
    1. Alhamdulillah makasih banyak Nad :D selamat bergabung juga ya dengan BP dan KEB :D semoga makin sukses ngeblognya :D

      Hapus
  41. Halo kak salam kenal ya. wah informasinya benar benar sangat membantu kak. benar benar terima kasih banyak ya kak. awalnya aku juga bingung kok about me ku nggak sama kayak blogger lain yang cantik cantik. untung aku nemu blog kakak dan ikutin tips dari kakak. terima kasih banyak kak. btw kalo boleh tau gimana caranya pasang button share this post dibawah posting ya kak? apa itu bawaan dari template? terima kasih sebelumnya kak :D

    BalasHapus
    Balasan
    1. sama-sama :D senang bisa membantu :D tombol share ini bawaan dari templatenya :) hehehe

      Hapus
  42. Makasih banyak informasinya. Bener-bener terbantu banget kak. (^0^) Makasih kak....

    BalasHapus
  43. Mbak aku newbie banget ini, hehe. Udah nyoba tapi gak mau muncul ditampilan blog mbak *cry*

    BalasHapus
    Balasan
    1. Wah udah berhasil ya? :D selamat :D tadi main ke blog kamu, udah ada. Tapi kalau liat versi mobile memang ngga akan keliatan kalau template bloggernya bukan yang responsif :)

      Hapus
  44. thanks qaqa infonya dan tipsnya :a

    BalasHapus
  45. yey berhasil, thanks buat good learn nya kak! :)

    BalasHapus
  46. Coba dulu. makasih udah share :v

    BalasHapus
  47. Yeay finally nemu blog yang ngasih tutorial gimana bikin about me yang keren, terimakasih ~

    BalasHapus
  48. terima kasih, akhirnya udah bisa juga buat about me nya :D

    BalasHapus
  49. Thanks Hana, saya sudah berhasil coba untuk blog baru saya ;)

    BalasHapus
  50. kerenn.. Ijin coba ya kak. kalau ada waktu mampir balik ke lapak adek hehe

    BalasHapus
  51. Hai mba hana, salam kenal, terimakasih infonya sangat sangat bermanfaat 🙆🏼

    BalasHapus
  52. Oke aku simpan dulu ya mbak hana.. Nanti aku terapin.. Terimakasih infonya :)

    BalasHapus
  53. tterima kasih banyak untuk tips nya, akhirnya jadi juga

    BalasHapus
  54. tanks kak, bantuk banget buat aku yang lagi ngerjain tugas bikin bloh :)

    BalasHapus
  55. Terima kasih triknya, Mbak.Sudah dicoba di blog saya :)

    BalasHapus
  56. tengkyuuu Hana, Saya masih meraba-raba nih buat bikin display blog yg oke dan kamu sudah ngajarin cara yang mudah... salam kenal Hana :D

    BalasHapus
  57. mbak template bagus. ini pakai vefio themes ya? bukannya ini template premium? kok bisa jadi template bagaimana caranya

    BalasHapus
    Balasan
    1. Ya hana beli 9 usd di etsy..cerita lengkap ttg pembelian dan pemasangan template ini bisa dibaca di https://hanabilqisthi.blogspot.co.id/2016/07/alhamdulillah-template-baru.html :)

      Hapus
  58. Akhirnya... jawaban atas pencarian ketemu juga, tinggal dicoba aja lagi... makasih mba ;)

    BalasHapus
  59. sangat membantu Terima kasih :)

    BalasHapus
  60. :D makasih banyak ya mba, keren dan mudah. Membantu banget tutorialnya. Haturnuhun

    BalasHapus
  61. sangat bermanfaat kak :) thank you. dan sudah diterapkan nih di blog aku hehe

    BalasHapus
  62. hii mba, terima kasih tutorialnya. mau langsung coba nih. terus bikin tutorial tentang utak atik widget blogspot ya mba.

    BalasHapus
  63. sangat bagus dan bermanfaat :)

    BalasHapus
  64. Makasih kak tutorial nya, tadi nya masih bingung cara buat nya gmn tp alhamdulillah sekarang udh bisa..yeeaahh 😊

    BalasHapus
  65. pas banget lagi nyari ini. Thnaks mbak Hana tipsnya...

    BalasHapus
  66. Hai, mba Hana salam kenal, aku kirim email ke mba, jika berkenan mohon dibalas ya, makasih :)

    BalasHapus
  67. Thankyou kakak udah berbagi. It 100% works :)
    https://ayukrisnasaripages.blogspot.co.id/

    BalasHapus
  68. aaak senangnya akuh, sekarang ada widget med sos di blogku. Makasih banyak ya Mbak,

    BalasHapus
  69. thanks kak atas tips & triknya sangat bagus dan berguna ,,,

    BalasHapus
  70. bermanfaat banget! langsung saya coba dan berhasil! thank you!

    BalasHapus
  71. Assalamualaikum, aku suka blognya kakak. simple tapi enak gitu dilihat. makasih ya postingannya membantu bgt <3

    BalasHapus
  72. Terima kasih mba atas tutorialnya,langsung saya praktekan ke blog saya hehehe.

    BalasHapus
  73. Wah..sangat membantu.makasih kak😀

    BalasHapus
  74. Terima kasih atas sharing ilmunya mbak, bermanfaat banget.

    BalasHapus

Terima kasih sudah berkunjung :D
Yang menulis belum tentu lebih pintar dari yang membaca
Jadi, silahkan kalau mau memberikan kritik, saran, umpan balik & pujian.
:D

EMOTICON
Klik the button below to show emoticons and the its code
Hide Emoticon
Show Emoticon
:D
 
:)
 
:h
 
:a
 
:e
 
:f
 
:p
 
:v
 
:i
 
:j
 
:k
 
:(
 
:c
 
:n
 
:z
 
:g
 
:q
 
:r
 
:s
:t
 
:o
 
:x
 
:w
 
:m
 
:y
 
:b
 
:1
 
:2
 
:3
 
:4
 
:5
:6
 
:7
 
:8
 
:9

Post Signature

Post Signature