Home » Blogger Hack » Author Bio, Social Media Share dan Subscribe Box untuk Blogger

Author Bio, Social Media Share dan Subscribe Box untuk Blogger

Kali ini Blog Gado Gado akan menampilkan artikel berjudul Author Bio, Social Media Share dan Subscribe Box untuk Blogger. Dengan artikel Author Bio, Social Media Share dan Subscribe Box untuk Blogger ini kami berharap dapat menjadi sebuah rujukan dan bahan penambah wawasan kita terkait dengan judul tersebut. Artikel ini adalah hasil pencarian di google dengan kata kunci Author Bio, Social Media Share dan Subscribe Box untuk Blogger kemudian saya kumpulkan dan saya sajikan buat anda di Blog Gado Gado ini. Semoga kehadiran artikel ini bermanfaat bagi kita semua.anda juga dapat melihat artikel sebelumnya atau artikel berikutnya. Ok, langsung saja berikut adalah artikel Author Bio, Social Media Share dan Subscribe Box untuk Blogger selengkapnya:

Author Bio, Social Media Share dan Subscribe Box dibawah postingan blog untuk Blogger - D-Copy Blog | Hai sobat blogger, tutorial kali ini kita akan membahas Author Bio, Social Media Share dan Subscribe Box dibawah postingan blog untuk Blogger yang yang sangat menarik untuk Anda gunakan untuk akun blog Anda.

Author Bio, Social Media Share dan Subscribe Box untuk Blogger

Langkah :
  1. Buka akun Blogger Anda
  2. Masuk ke menu edit HTML, jangan lupa centang expand template widget
  3. Cari kode dibawah ini :
]]></s:kin>
     4.  Diatasnya pastekan kode dibawah ini :
#postauthor { background: #eef7f8; border: 1px solid #c6d9ed; padding:10px; margin: 15px 0; width:650px; height:90px; font-family:Georgia, "Times New Roman", Times, serif; }
#author-info{float:left; width:410px; padding:0 15px 0 0; border-right:1px solid #ccc;margin-top: 0px; }
#author-info img {background:#fff; border: 1px solid #ddd; float: left; margin-right:10px;padding: 5px;
box-shadow: 0 0 3px #CCC; padding:3px;}#author-info h6 { color: #666; font-size: 18px; font-family:Georgia, "Times New Roman", Times, serif; font:Georgia, "Times New Roman", Times, serif }
#author-info h5 {color:#666; text-transform:none; font-size:11px; letter-spacing:0; font-family: Georgia;}
#author-info p { color: #515151; font-size: 12px; line-height:16px; font-family: Georgia;}

.social-connect-widget{width:400px;}
.social-connect-widget a{text-decoration:none;font-weight:bold;font-family:Arial,Helvetica,Sans-serif;color:#4B4D4E}
.social-connect-widget a:hover{text-decoration:underline;color:#F77C04}
.social-connect-widget img{vertical-align:middle;margin-right:5px}

.social-connect-widget img:hover{
opacity:0.4;
filter:alpha(opacity=40);
}

#news-letter{margin-left:-35px;clear:both;padding-top:5px;width:300px;margin-top:-5px;}
.msg-box{float:left;width:50px;height:54px;margin-right:9px;padding-top:15px;margin-top:5px;background: url(http://cdn1.iconfinder.com/data/icons/UII_Icons/48x48/email.png) no-repeat;}

* { margin:0; padding:0;}#author-connect{width:21%; float:right; margin-right:8%; }
    5.  Lalu cari kode dibawah ini :
<data:post.body>
Keterangan :
  • Biasanya kode diatas ada 3-4, pastekan kode dibawah ini pada kode ke 2/3
  • Jika nantinya tidak muncul pastikan letakkan kode dibawah ini pada kode-kode <data:post.body> lainnya sesuai dengan kebutuhan blog Anda
     6.  Pastekan kode dibawah ini, dibawah kode pada langkah 5
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:post.author == &quot;Author Name&quot;'>
<div id="postauthor" style="margin: 100px 0 0 300px;">
<div id="author-info">
 <img alt='' src='http://2.bp.blogspot.com/-Qh_sHEPX-DY/UK9RmtNQ36I/AAAAAAAAFuo/pVmwYzXaW8o/s1600/author.jpg'  height='80' width='80' /><h6 style="font:Georgia">Article by <a expr:href='data:post.authorProfileUrl' rel='author'><data:post.author/></a></h6>
<h5>AuthorName has Written Many Useful Articles.</h5>
<p>If you like This post, you can follow bloggertrix on <strong>
<a href="http://twitter.com/ID Twitter Anda" rel="nofollow" >Twitter  </a> </strong>. Subscribe to <strong> Bloggertrix feed via <a href="http://feeds.feedburner.com/ID Feedburner Anda" rel="nofollow" >RSS</a> or  <a href="http://feedburner.google.com/fb/a/mailverify?uri=ID feedburner Anda&amp;loc=en_US" rel="nofollow" > EMAIL </a>  </strong>to receive instant updates.</p></div>
   
<div id="author-connect">
   
<div class='social-connect-widget' style='margin-top:10px;margin-bottom:10px;margin-left:-15px;'> 
<a href='http://twitter.com/ID Twitter Anda'><img alt='Follow Us on Twitter!' src='http://2.bp.blogspot.com/-mqqPvGPt7dI/T9maU7JKaRI/AAAAAAAAA4o/BPeRM6y7oxA/s1600/twitter.png' title='Follow Us on Twitter!'/></a>
<a href='http://facebook.com/username'><img alt='Be Our Fan!' src='http://4.bp.blogspot.com/-8bWXS3t1S3g/T9maPS0F8HI/AAAAAAAAA4I/bwiZYy8Ri6o/s1600/facebook.png' title='Be Our Fan'/></a>
<a href='http://stumbleupon.com/ID Stumbleupon Anda'><img alt='Be Our Fan!' src='http://1.bp.blogspot.com/-uRuQesGA0r4/T9maULj720I/AAAAAAAAA4g/U3qsSaNtyf4/s1600/stumbleupon.png' title='Follow Us'/></a><a href='https://plus.google.com/Username'><img alt='Be Our Fan!' src='http://2.bp.blogspot.com/-AQVtTqyD7N8/T9maQRwpl6I/AAAAAAAAA4Q/Y9mltd_ZgtI/s1600/google.png' title='Follow Us'/></a>
<a href='http://digg.com/ID Digg Anda'><img alt='Be Our Fan!' src='http://4.bp.blogspot.com/-efaTu9e0je0/T9maOHhDEzI/AAAAAAAAA4A/9bFCMaNU1wc/s1600/digg.png' title='Follow Us'/></a>
<a href='http://feeds.feedburner.com/ID Feedburner Anda'><img alt='RSS Feed' src='http://3.bp.blogspot.com/-ZFSOToEIH3k/T9maR7A2-dI/AAAAAAAAA4Y/TFqXHP9j1I8/s1600/rss.png' title='RSS Feed'/></a><a href='http://d-copy.blogspot.com/'><img src='http://1.bp.blogspot.com/-MiryOkTk9fs/T9nKXxy3riI/AAAAAAAAA5o/kMhpj-0aCAM/s1600/image.png' target='_blank'/></a>
</div>
<hr style="width:155px;" />
    <div id="news-letter">
<span class="msg-box"></span>
<b>Subscribe</b>
<br />
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=ID Feedburner Anda', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="ebutton3" gtbfieldid="2" maxlength="100" name="email" onfocus="this.value = '';" size="25" style="color: #333333; font-size: 11px; height: 21px; width: 130px;" type="text" valign="middle" value="Enter your email address" />
<input name="uri" type="hidden" value="ID Feedburner Anda" />
<input name="loc" type="hidden" value="en_US" />
<input class="ebutton2" id="submit" style="font-size: 11px;" type="submit" value="Send" />
</form>
</div>
</div></div>
</b:if></b:if>​
 Keterangan :
  • Ganti kode yang diwarnai diatas sesuai kebutuhan Anda
     7.  Save template Anda.

Terima kasih, semoga bermanfaat.
Sumber kode : http://www.bloggertrix.com/2013/01/customized-wordpress-style-author-bio.html

Nah, sobat Blog Gado Gado.. Anda telah membaca seluruh artikel berjudul Author Bio, Social Media Share dan Subscribe Box untuk Blogger dengan keword yang masuk Blogger Hack . Anda dapat memberikan komentar ditempat yang telah tersedia. Terima kasih kunjungan Anda.

0 komentar:

Poskan Komentar