Cara Aku Menciptakan Widget About Me Keren Di Blog
Cara yang saya lakukan untuk menciptakan sebuah widget About Me responsive dan keren di blog, lengkap dengan foto author, alamat, keahlian dan juga icon sosial media. Demo menyerupai yang terpapar pada widget paling atas sebelah kanan dari blog ini
Saya tertarik menciptakan tutorial atau cara menciptakan widget Tentang penulis/pemilik blog ini alasannya yaitu berawal dari yang saya lakukan search google tutorial menciptakan widget about me keren dan tampaknya saya tidak menemukan yang saya harapkan
Lalu saya mencari-cari blog yang memasang widget menyerupai ini dan alhasil menemukanya lalu saya mencoba untuk redesign/membuatnya, yang lalu saya pasang di blog saya ini
Baca juga : Cara menciptakan widgte subscribe email di blog
Nah kalau kau tertarik untuk memasang widget about me di blog yang berdasarkan saya keren, kau dapat mengikuti tutorial yang akan saya bagikan berikut ini. Kelebihan dari widget ihwal penulis ini yaitu tidak membebani loading blog alasannya yaitu tidak memakai Java Script
Hanya memakai instruksi CSS dan komplemen ikon memakai font awesome, tampilanyapun cukup rapi dan simplle. Widget ini dilengkapi Foto profile author, Alamat, Keahlian yang dikuasai, Ikon sosial media facebook, instagram, dan youtube dapat juga ditambah atau dikurangi dan tampilan dapat di edit sedemikian rupa tergantung selera dan kebutuhan
Langkah pertama kau harus Login blogger
Kemudian pilih hidangan Tatat Letak
Tambah Gadget pilih HTML/Java Script
Copi paste instruksi dibawah ini
Langkah selanjutnya plih hidangan Tema
Edit HTML
Dan copy paste instruksi dibawah ini letakkan diantara kode CSS blog kamu
Kemudian simpan dan lihat hasilnya, owiya kalau tampilanya kurang menarik atau kau mau mengubah bagian-bagian tertentu, atau ingin menambahkan ikon sosial media lainya kau dapat melaksanakan perubahan sendiri dengan otak-atik instruksi css dan juga instruksi yang ada didalam widget
Baca juga : 8 Rekomendasi daerah untuk membeli dan download template blog terbaik
Pasti kalian pernah mengunjugi menyebarkan blog namun kau tidak menemukan widget yang berisi ihwal penulis menyerupai punya saya, memang berdasarkan saya widget about me hanya cocok dan kelihatan menyatu kalau dipasang pada blog personal/blog pribadi
Blog/situs besar biasanya hanya memasang about sekilas yang berada di bawah footer, nah tapi untuk blog personal blog eksklusif saya sering melihat widget ini terpasang di sidebbar sebelah kanan atas dan itu pas banget menurutku
Namun itu semua tergantung selera pilik blog masing-masing, mau dipasang di bab sebelah mana. Dan itu aja postingan artikel kali ini supaya bermanfaat kalau punya pertanyaan silahkan tingalkan di kolom komentar.
Sumber https://www.larepacitan.com/
Saya tertarik menciptakan tutorial atau cara menciptakan widget Tentang penulis/pemilik blog ini alasannya yaitu berawal dari yang saya lakukan search google tutorial menciptakan widget about me keren dan tampaknya saya tidak menemukan yang saya harapkan
Lalu saya mencari-cari blog yang memasang widget menyerupai ini dan alhasil menemukanya lalu saya mencoba untuk redesign/membuatnya, yang lalu saya pasang di blog saya ini
Baca juga : Cara menciptakan widgte subscribe email di blog
Nah kalau kau tertarik untuk memasang widget about me di blog yang berdasarkan saya keren, kau dapat mengikuti tutorial yang akan saya bagikan berikut ini. Kelebihan dari widget ihwal penulis ini yaitu tidak membebani loading blog alasannya yaitu tidak memakai Java Script
Hanya memakai instruksi CSS dan komplemen ikon memakai font awesome, tampilanyapun cukup rapi dan simplle. Widget ini dilengkapi Foto profile author, Alamat, Keahlian yang dikuasai, Ikon sosial media facebook, instagram, dan youtube dapat juga ditambah atau dikurangi dan tampilan dapat di edit sedemikian rupa tergantung selera dan kebutuhan
Cara menciptakan widget About Me responsive dan keren di blog
Langkah pertama kau harus Login blogger
Kemudian pilih hidangan Tatat Letak
Tambah Gadget pilih HTML/Java Script
Copi paste instruksi dibawah ini
<div id="LpAuthor"><img src="di isi alamat url gambar author" alt="Cara yang saya lakukan untuk menciptakan sebuah widget About Me responsive dan keren di blog Cara Saya Membuat Widget About Me Keren Di Blog"/>
<br/>
<h2>Author : kimlp</h2>
<h3>From : Pacitan, Jawa Timur</h3>
<i>Kota 1001 Goa</i>
<br/>Paradise Of Java Indonesia
<hr />
<b>SHORT RESUME</b>
<center><table style="text-align:left;font-size:11px">
<tr>
<td width="50px">Blogger</td>
<td><i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star-half-empty'></i></td>
<td style="width:65px;padding-left:5px">Design</td>
<td><i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star-half-empty'></i>
<i class='fa fa-star-o'></i></td></tr>
<tr><td>Redesign</td> <td><i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star-half-empty'></i>
</td>
<td style="padding-left:5px">Edit Foto</td>
<td><i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star-o'></i>
<i class='fa fa-star-o'></i></td></tr>
<tr><td>Optimasi</td> <td><i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star-half-empty'></i>
<i class='fa fa-star-o'></i></td>
<td style="padding-left:5px">Edit video</td> <td>
<i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star'></i>
<i class='fa fa-star-o'></i>
<i class='fa fa-star-o'></i></td></tr>
</table></center>
<a class="showcase2" style="width:100%" title="Cara Saya Membuat Widget About Me Keren Di Blog">Follow Me</a>
<br/>
<div class="medsos">
<a class="facebook tooltip" data-tooltip="Facebook" href="https://www.facebook.com/Lare-Pacitan-218369272329787/" rel="nofollow" target="_blank"><i class="fa fa-facebook-square"></i></a>
<a class="instagram tooltip" data-tooltip="Instagram" href="https://www.instagram.com/kimlp_/" rel="nofollow" target="_blank"><i class="fa fa-instagram"></i></a>
<a class="youtube tooltip" data-tooltip="Youtube" href="https://www.youtube.com/c/LarePacitan/" rel="nofollow" target="_blank"><i class="fa fa-youtube-play"></i></a>
</div>
</div>
Sebelum disimpan pastikan terlebih dahulu kau mengganti goresan pena yang saya tandai warna biru dengan alamat url foto profil/author yang ukuranya persegi dapat 200x200 atau 100x100 dan sterusnya. Kalau punya saya memakai foto ukuran 100x100 dan saya rasa itu sudah cukup maksimal
Langkah selanjutnya plih hidangan Tema
Edit HTML
Dan copy paste instruksi dibawah ini letakkan diantara kode CSS blog kamu
/* Css Author */
#LpAuthor {text-align:center;background-color:#fff;color:#333;line-height:20px;padding:0 10px 10px 10px}#LpAuthor img {border-radius:100px; max-width:100px;margin-bottom:10px}#LpAuthor hr {border:none; height:1px; background-color:#FF5A00; width:80%; margin:10px auto}.medsos a{display:inline-block;text-align:center;margin-right:3px;color:#fff;border-radius:1px;opacity:.9;}.medsos a i{font-family:Fontawesome;width:85px;height:40px;line-height:40px;display:block}.medsos a:hover{transform:rotate(360deg);}.medsos .facebook{background:#3a579a}.medsos .youtube{background:#cc181e}.medsos .instagram{background:linear-gradient(45deg, #7C4B9E, #EB233F, #FAB850)}
a.showcase2{display:block;background:#fff;color:#333!important;font-weight:900;font-size:16px!important;margin:0;padding:10px;text-align:center;border-radius:1px;}
Kemudian simpan dan lihat hasilnya, owiya kalau tampilanya kurang menarik atau kau mau mengubah bagian-bagian tertentu, atau ingin menambahkan ikon sosial media lainya kau dapat melaksanakan perubahan sendiri dengan otak-atik instruksi css dan juga instruksi yang ada didalam widget
Baca juga : 8 Rekomendasi daerah untuk membeli dan download template blog terbaik
Blog yang cocok memasang widget abaut me di sidebbar wrapper
Pasti kalian pernah mengunjugi menyebarkan blog namun kau tidak menemukan widget yang berisi ihwal penulis menyerupai punya saya, memang berdasarkan saya widget about me hanya cocok dan kelihatan menyatu kalau dipasang pada blog personal/blog pribadi
Blog/situs besar biasanya hanya memasang about sekilas yang berada di bawah footer, nah tapi untuk blog personal blog eksklusif saya sering melihat widget ini terpasang di sidebbar sebelah kanan atas dan itu pas banget menurutku
Namun itu semua tergantung selera pilik blog masing-masing, mau dipasang di bab sebelah mana. Dan itu aja postingan artikel kali ini supaya bermanfaat kalau punya pertanyaan silahkan tingalkan di kolom komentar.
Sumber https://www.larepacitan.com/
