Tutorial Menciptakan Kotak Profile Author Dibawah Postingan Blogger

tutor membikin widget Box Kotak author bio profile penulis blogger dibawah postingan keren menarik juga responsive.tutor memunculkan menampilkan box author profile blogger di blog.biasanya kotak/ box profile author bio blogger rampung ada, tetapi apabila kalian mau menggantinya kaliitu admin mau share banyak sekali macam kotak box profile bio blogger nan keren. sekalian tutoritu juga mengganti juga mengatasi author profile blog sempat nan hilang. pastinyanya box profileitu dilengkapi tombol share media umum GooglePlus (G+) juga kalian juga sanggup mengubah nama tampilan nan terdapat dididalemnya .

Berbitutor wacana author profile blogger banyak sekali fungsi nan terdapat dididalemnya, rata rata blogger kelas atas memasangnya sebagai keperluan mengetahui siapa penulis artikel ataupun penulis blog itu. Dengan memasang widget Kotak Box author profile blogger , pengunjung mau gampang mengenali siapa sesungguhnya pendiri blog itu. selain itu masih banyak lagi fungsi nan terdapat dididalem author profile blog.

Untuk tutor pembuatannya sendiri sesungguhnya gampang tersedia sebagian template blog nan memang rampung menyediakannya kami tinggal menyetingnya saja, tetapi apabila kalian ingin sekali memodifnya jadinya tidak banyak lebih menarik ataupun keren makanya simak tutornya berikut ini.

Jika tersedia resah menyeting profile blogger kaliitu Kotak box author profile blogger nan mau admin bagikan kaliitu kalian tinggal meletakan linknya saja apabila tersedia tak mau repot sebagai menyeting dari profile blogger kalian

Oke teman sebagai tutor lengkapnya silahkan ikuti langkahnya berikut ini:

tutor memasang kotak author profile blogger dibawah postingan blog

#kotak author profile blogger style 3

berikut secreenshot penampakan kotak box author profile style 3

Oke sebagai tutor membikinnya silahkan ikuti langkahnya berikutitu :

1. Silahkan kalian masuk ke dashboard blogger kalian
2. Langsung saja pergi kemenu edit HTML
3. Copy instruksi dibawahitu juga letakan sempurna diatas instruksi ]]></b:skin>

.wc-aboutauthor{float:left;width:500px;padding:15px;border:1px solid #ccc;margin-bottom:15px;margintop:15px;background:url('https://1.bp.blogspot.com/-1DTnGVUVLYY/V0RnzYphu9I/AAAAAAAABHM/qPOtNKCYMI4Y0cwUKHw6MXKpOhk0ZEpACKgB/s1600/Background%2BPower%2BPoint%2B3D%2B9.jpg');color:#ffffff;-webkit-box-shadow:0px 0px 10px rgba(0, 0, 0, .5);-moz-box-shadow:0px 0px 10px rgba(0, 0, 0, .5);box-shadow:0px 0px 10px rgba(0, 0, 0, .5);} .wc-aboutauthor h2{color:#b6e026;font-family:Helvetica,Arial;font-weight:bold;text-shadow:#64665b 0px 1px 1px;font-size:28px;margin-bottom:-6px; } .wc-aboutpic{float:right;margin:0 0 0 10px;} .wc-aboutpic img{border:1px solid #999999;-webkit-transition:-webkit-transform .15s linear;-moz-transition:-moz-transform .15s linear;-o-transition:-o-transform .15s linear;transition:transform .15s linear;-webkit-box-shadow:0 3px 6px rgba(0,0,0,.27);-moz-box-shadow:0 3px 6px rgba(0,0,0,.27);box-shadow:0 3px 6px rgba(0,0,0,.27);padding:5px 5px 5px 5px;-webkit-transform:rotate(+5deg);-moz-transform:rotate(+5deg);-ms-transform:rotate(+5deg);-o-transform:rotate(+5deg);transform:rotate(+5deg);float:left;}.wc-aboutpic img:hover{background:#FFFFFF;-webkit-box-shadow:0px 0px 10px rgba(0, 0, 0, .5);-moz-box-shadow:0px 0px 10px rgba(0, 0, 0, .5);box-shadow:0px 0px 10px rgba(0, 0, 0, .5);-webkit-transform:rotate(-1deg);-moz-transform:rotate(-1deg);-ms-transform:rotate(-1deg);-o-transform:rotate(-1deg);transform:rotate(-1deg);}.wc-aboutsoc img{height:35px;margin-bottom:-13px;}.wc-aboutsoc p{font:16px georgia;color:#ffffff;background:#b6e026;display:inline;border-radius:6px;padding:6px;margin-right:30px;}

catatan :
Ganti https://1.bp.blogspot.com/-1DTnGVUVLYY/V0RnzYphu9I/AAAAAAAABHM/qPOtNKCYMI4Y0cwUKHw6MXKpOhk0ZEpACKgB/s1600/Background%2BPower%2BPoint%2B3D%2B9.jpg dengan URL background nan kalian inginkan

4. Lanjut ke langkah berikutnya
5. Oke sehabis itu copy instruksi dibawahitu kemudian letakan sempurna dibawah instruksi <data:post.body/> nan kedua

<b:if cond='data:blog.pageType == "item"'> <div class='wc-aboutauthor'> <div class='wc-aboutpic'> <img alt='Author image' height='150' src='https://scontent-sin6-2.cdninstagram.com/t51.2885-15/s1080x1080/e15/fr/15338331_197975987328478_7517741477372362752_n.jpg' width='150'/></div><span style="font-family: Verdana, sans-serif; font-size: large;"> <b>About JagoanKode</b> </span><div style="text-align: justify;"> <p>Artikel aku nan berjudul<a expr:href='data:post.url'><data:post.title/></a>. artikelitu resmi ditulis oleh <data:post.author/>.Pada hariitu khususnya<data:post.dateHeader/>. Jika kalian ingin sebarluaskan artikel ini, ataupun meletakan artikelitu jadi goresan pena kalian mohon sertakan <strong>sumber link asli.</strong><center><strong>www.jagoankode.blogspot.com</strong></center></p> </div> <div class='wc-aboutsoc'> <p> Follow me on: </p> <a href='#'> <imgsrc='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQFYK-6FzNVxVO07ZEZhYtBc8gnAKzDDMaRzqEhb3XXY4lV1mzVtyzkABZvPUa0I3J8NEuRbNzhe7EP-it0FO27Yh_pA1UF4cMap5yQLNScAN4oy6jGySLqxct0DFQSTIav6k1ggMYlw0r/s1600/facebook.png' title='Facebook'/></a> <a href='#'> <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKr_twG8phfdRrS4Z52r9f7RhsOTKSkdjZmmk0gUt4myHumnjczNqKTybwgDuEpr4gfnumvMrRI2U3JUUm2DSlsV8Nqtf19OgxDa8tIQ_ZqBbYrFcljOluSoOr8hbhtI-ihbr1X01vtjOG/s1600/twitter.png' title='Twitter'/></a> <a href=' # ' > <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-_CmHhVKLrBjVVCvWI3NQXgbiHSsRAkAM4aC7zwHrzCnj5JNdKKQNDOjJUGycflUe9NXmNo5_0vJAiTYF2w71_JDt8cWv8iq_YAZpWp4Df7H6VS9Keb_QJ5J5tjWp4olLx6Vo2xaYYwhO/s1600/gplus.png' title='Google plus'/></a> <a href=' # '> <imgsrc='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzFJi3CJwez0089OJP32yELw7-xEWQAF8121yiRDltwncIFZRzxXwVQg0eI7gjb5HL7OQPiCLdHexg0owtkr-riQVwfXw2OpOTDS3DWThKRBlmPCETz4FXtOyt0tuVRUDlcQyyuWD0-8Vc/s1600/linkedin.png' title='LinkedIn'/></a> </div> </div> </b:if>

6. SAVE TEMPLATE kemudian lihat hasilnya

catatan :

• Ganti goresan pena merah dengan data data author blog nan kalian inginkan
• Ganti goresan pena biru dengan URL sosial media nan kalian punya

Semua instruksi diatas sanggup kalian modif sesuka hati anda.Oke teman hingga disitu saja perjumpaan kami di hariitu supaya informasiitu sanggup meringankan kalian :D

Penutup...

Makara Kira Kira Itu Saja Caranya nan sanggup kalian terapkan, sebelumnya tersedia banyak juga nan admin post sebagai duduk kasus membikin kotak profile dibawah postingan ini, apabila sekiranya kalian menyukainya boleh kalian coba dirumah juga di blog kalian masing masing yaa.. Sampai jumpa Di tutorial selanjutnya. baca juga update postingan lain