Menyajikan Informasi Penting Untuk Anda.

Kamis, 24 Mei 2018

Cara Memasang Widget Author Box Pada Di Blogger

Cara Memasang Widget Author Box - Widget ini ialah opsi atau sebuah pilihan yang dapat kau berikan dan juga pasang pada blog kamu, alasannya ialah bersama-sama Blogger sendiri sudah mneyediakan widget ini dan sudah terkait dengan Google Plus atau Google+. Namun alasannya ialah author yang disediakan oleh blogger tidak dapat sepenuhnya di costum atau diubah sesuka hati maka dari kami memperlihatkan opsi ini untuk kami kau dan juga memperlihatkan tampilan author yang sedikit berbeda dari widget author yang yang sudah ada. Widget author ini cukup simple dan sederhana banget mempunyai tampilan yang flat atau tidak banyak mempunyai aksen atau hal-hal yang dapat menciptakan mata terasa aneh.

 Widget ini ialah opsi atau sebuah pilihan yang dapat kau berikan dan juga pasang pada bl Cara Memasang Widget Author Box pada di Blogger
Cara Memasang Widget Author Box - sidikul

Nah kurang lebih ibarat itulah tampilan dari widget author box ini, dimana hanya ada foto dan juga tombol-tombol sosmed mulai dari google plus, facebook, twitter, youtube dan instagram.

Akan tetapi kemarin aku juga sempat menciptakan sebuah artikel yang seputar widget ibarat ini jika tidak salah Cara menciptakan widget kalimat ucapan Selamat Berpuasa pada Blogger, pada widget tersebut memilki tampilan dan nuansa puasa yang cukup cantik mulai dari perpindahan matahari dari bawah terus keatas yang memperlihatkan feel puasa yang harus menahan lapar dan dahaga dari pagi hingga menjelas matahari terbenam.

Oke kita akan memperlihatkan teladan cara pemasangan widget author box yang simple dan sederhana ini, ikuti langkah berikut :

Cara Memasang Widget Author Box pada widget di Blogger

Widget ini tidak bergitu memerlukan script javascript namun hanya memakai HTML dan CSS saja sehingga tidak begitu memperlambat loading blog.
  1. Masuk ke Blogger.com > Tata letak (Layout)
  2. Lalu Tambahkan gadget > pilih HTML/javascript
  3. Lalu masukkan script berikut ini pada form HTML/javascript tersebut
  4. <style type="text/css"> /* author box by sidikul.co modif */ .cm-author{font-family:'Open Sans',Arial,sans-serif;position:relative;display:inline-block;min-width:230px;max-width:336px;width:100%;text-align:left;font-size:16px;background:#f5f5f5;border-radius:5px;margin-top:15px}.cm-author *,.cm-author:before,.cm-author:after{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:all 0.4s ease;transition:all 0.4s ease}.cm-author img{max-width:35%;margin-top:-15px;margin-left:60%;margin-bottom:15px;backface-visibility:hidden;vertical-align:top;border-radius:15px}.myprofile{position:absolute;top:0;right:40%;left:0;bottom:0;padding:15px}.cm-author h3{margin:0;font-size:1.1em;font-weight:bold}.cm-author h3 a{color:#656565;text-decoration:none}.cm-author h3 a:visited{color:#656565;text-decoration:none}.cm-author .icons{font-size:1.6rem}.fa-facebook{color:#bababa}.fa-facebook:hover{color:#3b5998}.fa-twitter{color:#bababa}.fa-twitter:hover{color:#55acee}.fa-instagram{color:#bababa}.fa-instagram:hover{color:#e95950}.fa-youtube-play{color:#bababa}.fa-youtube-play:hover{color:#ff0000}.mysite{font-size:12px;font-style:italic} </style> <div class="cm-author"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgREycLcrI7zyC6jZDVSGbGHPABLqDKdsIh-SYr-Iuu_hY0LnlzXR-BugJCO-32IZGi1D5PHWK3q9M_CN96IUpmG2dlKvdfoIqhdX1bdewFdo6j5pgMcD31Kg4HiTIfPRAMvUA0MmwiurI/s1600/64701d1f-fca0-4257-9e49-a32532fc84a1.jpg" alt=" Widget ini ialah opsi atau sebuah pilihan yang dapat kau berikan dan juga pasang pada bl Cara Memasang Widget Author Box pada di Blogger" title="Cara Memasang Widget Author Box pada di Blogger"/> <div class="myprofile">   <h3><a href="https://plus.google.com/" title="Cara Memasang Widget Author Box pada di Blogger">Eko Dikul</a></h3>   <div class="icons">     <a href="https://www.facebook.com/sidikblog" title="Cara Memasang Widget Author Box pada di Blogger"><i class="fa fa-facebook"></i></a>     <a href="https://twitter.com/IdSodikul" title="Cara Memasang Widget Author Box pada di Blogger"><i class="fa fa-twitter"></i></a>     <a href="https://www.instagram.com/eko.dikul" title="Cara Memasang Widget Author Box pada di Blogger"><i class="fa fa-instagram"></i></a>     <a href="https://www.youtube.com/" title="Cara Memasang Widget Author Box pada di Blogger"><i class="fa fa-youtube-play"></i></a>   </div>   <div class="mysite">sidikul.co</div> </div></div>
  5. Lalu simpan dan lihat hasil.

Note :
Silahkan ganti url atau goresan pena yang telah kami berikan blck berwarna diatas.

Jika ikon sosial media tidak muncul, tambahkan isyarat ini di atas isyarat pada editor template.
<link href='//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>

Demikian Cara Memasang Widget Author Box pada widget di Blogger, sangat praktis dan praktis sekali untuk kau yang pengen mencoba widget ini. Kalau ingin tau dapat pribadi ikuti cara diatas. Terima kasih

Tidak ada komentar:

Posting Komentar