Berbagi Info Cara Membuat Tombol Share Blog Ringan dan Valid HTML 5 Terbaru 2017 Gratis

Sedikit Info Seputar Cara Membuat Tombol Share Blog Ringan dan Valid HTML 5 Terbaru 2017 - Hay gaes kali ini team Blog Simbah, kali ini akan membahas artikel dengan judul Cara Membuat Tombol Share Blog Ringan dan Valid HTML 5, kami selaku Team Blog Simbah telah mempersiapkan artikel ini untuk sobat sobat yang menyukai Blog Simbah. semoga isi postingan tentang Artikel Tutorial Blog, yang saya posting kali ini dapat dipahami dengan mudah serta memberi manfa'at bagi kalian semua, walaupun tidak sempurna setidaknya artikel kami memberi sedikit informasi kepada kalian semua. ok langsung simak aja sob
Judul: Berbagi Info Seputar Cara Membuat Tombol Share Blog Ringan dan Valid HTML 5 Full Update Terbaru
link: Cara Membuat Tombol Share Blog Ringan dan Valid HTML 5

Berbagi Cara Membuat Tombol Share Blog Ringan dan Valid HTML 5 Terbaru dan Terlengkap 2017

 

1. (Backup templatenya dulu ya gan) dan cari Template > Edit HTML.

2. Tambahkan font Oswald di bawah </style> dengan cara tekan CTRL+F dan masukkan </style> pada kolom pencaharian. Biasanya ditemukan tidak hanya satu, silahkan pilih yang paling atas ya gan.

 

@font-face{font-family:Oswald;font-style:normal;font-weight:400;src:local('Oswald Regular'),local('Oswald-Regular'),url(http://themes.googleusercontent.com/static/fonts/oswald/v8/-g5pDUSRgvxvOl5u-a_WHw.woff) format('woff')}

 

3. Letakkan kode CSS berikut di atas kode ]]></b:skin>

/*--Tombol Share--*/
.share {
border-top: 1px solid #dedede;
font-family: Oswald, Arial, sans-serif;
font-size: 16px;
line-height: 1.8em;
position: relative;
text-transform: uppercase;
padding-top: 10px;
margin-top: 20px;
}
.share a:link {
color: #fff;
font-size: 14px;
margin-right: 10px;
text-align: center;
text-transform: none;
}
.share a:visited {
color: #fff;
font-size: 14px;
margin-right: 10px;
text-align: center;
text-transform: none;
}
.share a:hover {
color: #fff;
}
.share_facebook {
background: #0182c4;
padding: 3px 13px;
border-radius: 3px;
}
.share_facebook:hover {
background: #01689d;
}
.share_google {
background: #d44132;
padding: 3px 17px;
border-radius: 3px;
}
.share_google:hover {
background: #aa3428;
}
.share_twitter {
background: #20b8ff;
padding: 3px 19px;
border-radius: 3px;
}
.share_twitter:hover {
background: #1a93cc;
}
.ltsme { 
background: #fb8938;
padding: 3px 12px;
border-radius: 3px;
}
.ltsme:hover {
background: #E98945;
}

 4. Terakhir letakan juga kode berikut di bawah <data:post.body/>. atau dibagian akhir dari artikel. Biasanya terdapat 2 kode seperti di atas. silahkan pilih dibawah kode yang kedua.

<div class='share'>
<span style='float: left; margin-right: 15px; margin-top: 1px;'>Suka Artikel Ini? Bagikan: </span>
<a class='share_facebook' expr:href='&quot;https://www.facebook.com/sharer.php?u=&quot; + data:blog.url' expr:onclick='&quot;window.open(this.href,\&quot;_blank\&quot;,\&quot;height=430,width=640\&quot;);return false;&quot;' rel='nofollow' title='Bagikan ke Facebook'>Facebook</a>
<a class='share_google' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:blog.url' expr:onclick='&quot;window.open(this.href,\&quot;_blank\&quot;,\&quot;height=600,width=530\&quot;);return false;&quot;' rel='nofollow' title='Bagikan ke Google+'>Google+</a>
<a class='share_twitter' expr:href='&quot;https://twitter.com/share?url=&quot; + data:blog.url' expr:onclick='&quot;window.open(this.href,\&quot;_blank\&quot;,\&quot;height=430,width=640\&quot;);return false;&quot;' rel='nofollow' title='Bagikan ke Twitter'>Twitter</a>
<script>/*<![CDATA[*/var uri=window.location.href;var title=document.title;document.write('<a class="ltsme" href="http://www.lintas.me/?c=bookmarklet&url='+uri+'&title='+title+'" rel="nofollow" target="_blank" title="Bagikan ke Lintas.me">Lintas.me</a>');/*]]>*/</script>
</div>

5. Silahkan simpan templatenya dan lihat hasilnya.
6. Selesai


Terima Kasih atas Kunjungannya
Semoga Bermanfaat ^_^

Itulah sedikit Artikel Cara Membuat Tombol Share Blog Ringan dan Valid HTML 5 terbaru dari kami

Semoga artikel Cara Membuat Tombol Share Blog Ringan dan Valid HTML 5 yang saya posting kali ini, bisa memberi informasi untuk anda semua yang menyukai Blog Simbah. jangan lupa baca juga artikel-artikel lain dari kami.

Terima kasih Anda baru saja membaca Cara Membuat Tombol Share Blog Ringan dan Valid HTML 5