Cara Mudah Membuat / Memasang Tombol Share di Blog sama persis Template Evo Magz Mas sugeng

Bagikan :

Tweet

Selamat pagi, sebelumnya saya akan menjelaskan sedikit fungsi dari tombol share button yang di pasang di bawah postingan blog, fungsinya yaitu membagikan postingan blog anda kepada teman pengunjung blog di sosial media, seperti facebook, Twitter, Google+, Pinterest, Linkedin, dll.

Pada kesempatan ini bacaan gratis akan membahas bagaimana cara membuat tombol share buttons di bawah postingan blog seperti template evomagz dan template bronze milik mas sugeng. Template Seo EvoMagz milik mas sugeng sudah banyak di gunakan oleh para blogger, karena templatenya SEO dan tampilanya menarik serta suport mobile. 

Screenshoot template EvoMagz Mas Sugeng

Cara Membuat Tombol Share Buttons Keren versi Template EvoMagz

1. Login blog anda terlebih dahulu
2. Masuk ke Template >> Edit HTML
3. Silahkan anda copy dan paste kode script di bawah ini tepat di atas ]]</b:skin> atau </style> untuk mencarinya silahkan anda tekan tombol ctrl + f pada keybord.

.share-buttons-box {height: 67px;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwAOlzYgtd9lDbqtUcwJus183B5MmjwZ_s0wMJuWDBUEgtJcE0DXm74Lrvjrx14w8k2OpUlS2VVyZTlgoMUC-2et_6Q2amFeQey3XOrtmO9L45E859M5UEYInUcQeXrmyDd546fM4WaepA/s1600/share.png) no-repeat 330px 10px;margin:20px 0 15px;overflow:hidden;}
.share-buttons{margin:0 0;height:67px;float:left}
.share-buttons .share{float:left;margin-right:10px;display:inline-block}

4. Selanjutnya cari kode <data:post.body> dengan cara menekan ctrl+f
5. Kemudian copy dan pastekan kode script di bawah ini di bawah <data:post.body> , <data:post.body>  biasanya ada 2, silahkan anda coba yang terakhir atau yang pertama

<div class='share-buttons-box'>
        <div class='share-buttons'>
            <div class='share gplus'><div class='g-plusone' data-size='tall' expr:data-href='data:post.url'/></div>
            <div class='share like'><div class='fb-like' data-action='like' data-layout='box_count' data-share='false' data-show-faces='false' expr:data-href='data:post.url'/></div>
            <div class='share fbshare'><div class='fb-share-button' data-type='box_count' expr:data-href='data:post.url'/></div>
            <div class='share tweet'><a class='twitter-share-button' data-count='vertical' data-lang='en' data-size='normal' expr:data-url='data:post.url' href='https://twitter.com/share'>Tweet</a></div>
            <div class='share linkedin'><script src='//platform.linkedin.com/in.js' type='text/javascript'>
            lang: en_US </script><script data-counter='top' expr:data-url='data:post.url' type='IN/Share'/></div>
        </div>
        </div>
        <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?&#39;http&#39;:&#39;https&#39;;if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+&#39;://platform.twitter.com/widgets.js&#39;;fjs.parentNode.insertBefore(js,fjs);}}(document, &#39;script&#39;, &#39;twitter-wjs&#39;);</script>

5. Terakhir silahkan anda Simpan Template.

Silahkan anda coba praktekan, membuat tombol share buttons keren versi template EvoMagz Mas Sugeng di blog anda, semoga berhasil.

Terima kasih telah mengunjungi Bacaan-Gratis.Com semoga bermanfaat dan silahkan tinggalkan komentar anda atau menyukai Bacaan Gratis dengan like di fans page facebook.^_^

• Twitter
• Facebook
• Google
• Tumblr
• Pinterest

Tag : BLOG