Pasang Widget Share Valid HTML 5 di Bawah Posting Blog

Pasang Widget Share Valid HTML 5 di Bawah Posting Blog - sobat bloggers, lama sudah saya tidak melakukan aktivitas blogging...karena ada pekerjaan di dunia nyata yang harus saya selesaikan. Oleh karena itu pada perjumpaan kali ini, akan saya share kepada Anda cara membuat atau Pasang Widget Share Valid HTML 5 di Bawah Posting Blog. Tutorial ini saya buat karena ada pertanyaan dari sahabat Faisal Fahri. Silahkan ikuti langkah-langkahnya di bawah ini :

Pasang Widget Share Valid HTML 5 di Bawah Posting Blog

1. Anda masuk ke akun blog
2. Masuk ke menu edit HTML
3. Anda cari kode ini (tekan CTRL+F) <div class='post-footer'>...</div>
4. Biasanya kode di atas ada lebih dari satu, Anda pilih yang terakhir/bawah
5. hapus kode tersebut, lalu Anda ganti dengan kode di bawah ini :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='post-footer'>
<p>Terimakasih sudah berkunjung dan membaca artikel mengenai <i><data:post.title/></i>, jika ingin menyebar luaskan artikel ini di mohon untuk mencantumkan Link Sumbernya.<br/>
Jangan lupa klik tombol di bawah ini</p>
    <div class='post-footer-line post-footer-line-1' style='line-height: 0.9em;'>
      <span class='g-plusone' data-size='medium' expr:data-href='data:post.url'/>
      <span class='fb-like' data-layout='button_count' data-send='false' data-show-faces='false' data-width='90' expr:data-href='data:post.url' style='margin-right:30px'/>
      <a class='twitter-share-button' data-count='horizontal' data-related='' data-via='Dian Anarchyta' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share'>Tweet</a>
      <script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
      <script data-counter='right' expr:data-url='data:post.url' type='IN/Share'/>
      <script src='//platform.linkedin.com/in.js' type='text/javascript'/>
<div class='clear'/>
    </div>
    <div class='post-footer-line post-footer-line-2'/>
    <div class='post-footer-line post-footer-line-3'/>
   </div>
</b:if>

• Anda copy kode css di bawah ini, lalu letakkan di atas kode ]]></b:skin> atau </style>.
• copy kode css di bawah ini:

.post-footer {
  position: relative;
  display: block;
  background: url("https://scontent-sin.xx.fbcdn.net/hphotos-prn1/t39.1997-6/p128x128/851558_690520954295111_911904297_n.png") -15px center no-repeat scroll #FEF4C8;
  color: #666;
  margin:10px 0 0 0;
  padding: 10px 20px 10px 100px;
  border-radius: 4px;
  border-bottom: 1px solid rgba(0,0,0,.1);
  line-height: 1.4em;
  font-weight: bold;
}

• Anda dapat mengubah URL gambar yang saya block warna merah.
• save template Anda
• semoga berhasil !!

sekian artikel Pasang Widget Share Valid HTML 5 di Bawah Posting Blog, semoga bermamfaat :)