Cara Mengganti Tombol Share Google+ Di Viomagz Amp
Cara Hapus Tombol Share Google+ di Template VioMagz AMP
Halo sobat blogger,kali ini saya akan membagikan tutorial mengganti tombol share Google Plus yang ada di template blogger viomagz AMP. Seperti yang kalina tahu bahwa VioMagz merupakan tema karya Mas Sugeng yang paling banyak dipakai dikala ini.
Tampilan yang sederhana,elegan dan simpel dipakai mengakibatkan template ini disukai banyak blogger,dan belakangan ini Mas Sugeng menmghadirkan versi AMP dari template VioMagz. Namun Mas Sugeng membagikan itu secara gratis hanya kepada pelangannya yang membeli template viomagz original kepadanya. Blog dikala pertama kali berpindah ke AMP juga menggunalan template VioMagz AMP namun risikonya saya tetapkan memakai Kompi Flexible.
Sampai dikala ini Mas Sugeng belum memperlihatkan support secara pribadi untuk setiap permasalahan yang ada di VioMagz AMP,oleh alasannya itu disini saya akan membagikan sedikit tutorial untuk permasalahan yang serind ditemukan di VioMagz AMP yaitu wacana cara menghaspus tombol share google Plus.
Cara Mengganti Tombol Share Google+ di VioMagz AMP
Berikut ini tutorial untuk menghapusnya dan cara menggantinya dengan tombol share pinterest dan linkedin :a. Cara Menghapus Tombol Share Google+ Plus di VioMagz AMP
Berikut ini cara menghilangkan tombol share Google+ VioMagz AMP :- Buka Blogger.com
- Sign In dengan Akun Anda
- Masuk ke Dahsboard Blogger
- Pilih hidangan Tema
- Klik Edit HTML
- Cari instruksi berikut :
<div id='share-container'>
<div class='label-line-c'>
<p class='share-this-pleaseeeee'>Share this post</p>
</div>
<div id='share'>
<!-- facebook -->
<a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<!-- twitter -->
<a class='twitter' expr:href='"http://twitter.com/share?url=" + data:post.url' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<!-- google plus -->
<a class='googleplus' expr:href='"http://plus.google.com/share?url=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a>
<a class='linkedin' expr:href='"http://www.linkedin.com/shareArticle?mini=true&amp;url=" + data:post.url + "&amp;title=" + data:post.title + "&amp;summary=" + data:post.snippets' rel='nofollow' target='_blank'><i class='fa fa-linkedin'></i></a> -->
<a class='pinterest' expr:href='"http://pinterest.com/pin/create/button/?url=" + data:post.url + "&amp;media=" + data:blog.postImageUrl + "&amp;description=" + data:post.title' rel='nofollow' target='_blank'><i class='fa fa-pinterest-p'></i></a> -->
<a class='whatsapp' data-action='share/whatsapp/share' expr:href='"whatsapp://send?text=" + data:post.title + "%20%2D%20" + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/></a>
</div>
</div>
- Ganti dengan instruksi berikut :
<div id='share-container'>
<div class='label-line-c'>
<p class='share-this-pleaseeeee'>Share this post</p>
</div>
<div id='share'>
<!-- facebook -->
<a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<!-- twitter -->
<a class='twitter' expr:href='"http://twitter.com/share?url=" + data:post.url' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<!-- google plus
<a class='googleplus' expr:href='"http://plus.google.com/share?url=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a> -->
<a class='linkedin' expr:href='"http://www.linkedin.com/shareArticle?mini=true&amp;url=" + data:post.url + "&amp;title=" + data:post.title + "&amp;summary=" + data:post.snippets' rel='nofollow' target='_blank'><i class='fa fa-linkedin'></i></a> -->
<a class='pinterest' expr:href='"http://pinterest.com/pin/create/button/?url=" + data:post.url + "&amp;media=" + data:blog.postImageUrl + "&amp;description=" + data:post.title' rel='nofollow' target='_blank'><i class='fa fa-pinterest-p'></i></a> -->
<a class='whatsapp' data-action='share/whatsapp/share' expr:href='"whatsapp://send?text=" + data:post.title + "%20%2D%20" + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/></a>
</div>
</div>
- Lalu klik Simpan Tema
Nah hingga sini anda sudah berhasil menghilangkan tombol share google plus yang ada di VioMagz AMP,nanti yang tersisa yaitu tombol bagikan ke facebook,twitter dan whatsapp. Bila anda merasa itu sudah cukup maka tidak perlu melaksanakan pengeditan lagi,tapi anda juga dapat menambahkan tombol bagikan ke pinterest dan linkedin. Berikut ini cara menambahkan tombol share pinterest dan linkedin di VioMagz AMP.
b. Cara Memasang Tombol Share Pinterest ke VioMagz AMP
Berikut ini tutorial untuk kalian yang tadi sudah menghapus tombol bagikan ke GooglePlus dan ingin menggantinya menjadi Pinterest :- Buka Blogger.com
- Sign In dengan Akun Anda
- Masuk ke Dashboard Blogger
- Pilih hidangan Tema
- Klik Edit HTML
- Cari instruksi berikut :
<div id='share-container'>
<div class='label-line-c'>
<p class='share-this-pleaseeeee'>Share this post</p>
</div>
<div id='share'>
<!-- facebook -->
<a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<!-- twitter -->
<a class='twitter' expr:href='"http://twitter.com/share?url=" + data:post.url' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<!-- google plus
<a class='googleplus' expr:href='"http://plus.google.com/share?url=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a> -->
<a class='linkedin' expr:href='"http://www.linkedin.com/shareArticle?mini=true&amp;url=" + data:post.url + "&amp;title=" + data:post.title + "&amp;summary=" + data:post.snippets' rel='nofollow' target='_blank'><i class='fa fa-linkedin'></i></a> -->
<a class='pinterest' expr:href='"http://pinterest.com/pin/create/button/?url=" + data:post.url + "&amp;media=" + data:blog.postImageUrl + "&amp;description=" + data:post.title' rel='nofollow' target='_blank'><i class='fa fa-pinterest-p'></i></a> -->
<a class='whatsapp' data-action='share/whatsapp/share' expr:href='"whatsapp://send?text=" + data:post.title + "%20%2D%20" + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/></a>
</div>
</div>
- atau instruksi berikut ini :
<div id='share-container'>
<div class='label-line-c'>
<p class='share-this-pleaseeeee'>Share this post</p>
</div>
<div id='share'>
<!-- facebook -->
<a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<!-- twitter -->
<a class='twitter' expr:href='"http://twitter.com/share?url=" + data:post.url' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<!-- google plus -->
<a class='googleplus' expr:href='"http://plus.google.com/share?url=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a>
<a class='linkedin' expr:href='"http://www.linkedin.com/shareArticle?mini=true&amp;url=" + data:post.url + "&amp;title=" + data:post.title + "&amp;summary=" + data:post.snippets' rel='nofollow' target='_blank'><i class='fa fa-linkedin'></i></a> -->
<a class='pinterest' expr:href='"http://pinterest.com/pin/create/button/?url=" + data:post.url + "&amp;media=" + data:blog.postImageUrl + "&amp;description=" + data:post.title' rel='nofollow' target='_blank'><i class='fa fa-pinterest-p'></i></a> -->
<a class='whatsapp' data-action='share/whatsapp/share' expr:href='"whatsapp://send?text=" + data:post.title + "%20%2D%20" + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/></a>
</div>
</div>
- Ganti dengan instruksi berikut :
<div id='share-container'>
<div class='label-line-c'>
<p class='share-this-pleaseeeee'>Share this post</p>
</div>
<div id='share'>
<!-- facebook -->
<a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<!-- twitter -->
<a class='twitter' expr:href='"http://twitter.com/share?url=" + data:post.url' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<!-- google plus
<a class='googleplus' expr:href='"http://plus.google.com/share?url=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a> -->
<a class='linkedin' expr:href='"http://www.linkedin.com/shareArticle?mini=true&amp;url=" + data:post.url + "&amp;title=" + data:post.title + "&amp;summary=" + data:post.snippets' rel='nofollow' target='_blank'><i class='fa fa-linkedin'></i></a> -->
<!-- pinterest -->
<a class='pinterest' expr:href='"http://pinterest.com/pin/create/button/?url=" + data:post.url + "&amp;media=" + data:blog.postImageUrl + "&amp;description=" + data:post.title' rel='nofollow' target='_blank'><i class='fa fa-pinterest-p'></i></a>
<a class='whatsapp' data-action='share/whatsapp/share' expr:href='"whatsapp://send?text=" + data:post.title + "%20%2D%20" + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/></a>
</div>
</div>
- Setelah itu klik Simpan Tema
Itulah cara memunculkan tombol menyebarkan ke pinterest di VioMagz AMP,namun jikalau anda tidak menyukai pinterest dapat juga untuk memakai tombol share linkedin. Berikut ini cara memasang tombol share linkedin di VioMagz AMP.
c. Cara Mengganti Tombol Share Google+ jadi Linkedin di VioMagz AMP
Berikut ini tutorial untuk kalian yang tidak menyukai pinterest,namun ingin mengganti tombol share Google+ menjadi Linkedin :- Buka Blogger.com
- Sign In dengan Akun Anda
- Masuk ke Dashboard Blogger
- Pilih hidangan Tema
- Klik Edit HTML
- Cari instruksi berikut :
<div id='share-container'>
<div class='label-line-c'>
<p class='share-this-pleaseeeee'>Share this post</p>
</div>
<div id='share'>
<!-- facebook -->
<a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<!-- twitter -->
<a class='twitter' expr:href='"http://twitter.com/share?url=" + data:post.url' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<!-- google plus -->
<a class='googleplus' expr:href='"http://plus.google.com/share?url=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a>
<a class='linkedin' expr:href='"http://www.linkedin.com/shareArticle?mini=true&amp;url=" + data:post.url + "&amp;title=" + data:post.title + "&amp;summary=" + data:post.snippets' rel='nofollow' target='_blank'><i class='fa fa-linkedin'></i></a> -->
<a class='pinterest' expr:href='"http://pinterest.com/pin/create/button/?url=" + data:post.url + "&amp;media=" + data:blog.postImageUrl + "&amp;description=" + data:post.title' rel='nofollow' target='_blank'><i class='fa fa-pinterest-p'></i></a> -->
<a class='whatsapp' data-action='share/whatsapp/share' expr:href='"whatsapp://send?text=" + data:post.title + "%20%2D%20" + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/></a>
</div>
</div>
- Ganti dengan instruksi berikut ini :
<div id='share-container'>
<div class='label-line-c'>
<p class='share-this-pleaseeeee'>Share this post</p>
</div>
<div id='share'>
<!-- facebook -->
<a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<!-- twitter -->
<a class='twitter' expr:href='"http://twitter.com/share?url=" + data:post.url' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<!-- google plus
<a class='googleplus' expr:href='"http://plus.google.com/share?url=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a> -->
<!-- linkedin -->
<a class='linkedin' expr:href='"http://www.linkedin.com/shareArticle?mini=true&amp;url=" + data:post.url + "&amp;title=" + data:post.title + "&amp;summary=" + data:post.snippets' rel='nofollow' target='_blank'><i class='fa fa-linkedin'></i></a>
<a class='pinterest' expr:href='"http://pinterest.com/pin/create/button/?url=" + data:post.url + "&amp;media=" + data:blog.postImageUrl + "&amp;description=" + data:post.title' rel='nofollow' target='_blank'><i class='fa fa-pinterest-p'></i></a> -->
<a class='whatsapp' data-action='share/whatsapp/share' expr:href='"whatsapp://send?text=" + data:post.title + "%20%2D%20" + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/></a>
</div>
</div>
- Lalu klik Simpan Tema
Sampai disini anda sudah berhasil mengganti Timbol Google Plus menjadi Linkedin. Anda juga dapat memunculkan tombol share pinterest dan linkedin secara bersamaan. Berikut ini tutorialnya.
d. Cara Memunculkan Tombol Berbagi Pinterest dan Linkedin di VioMagz AMP secara bersamaan
Berikut ini tutorial bagi anda yang menyukai banyak share button dan ingin menampilkan button pinterest+linkedin secara bersamaan :- Buka Blogger.com
- Sign In dengan Akun Anda
- Masuk ke Dashboard Blogger
- Pililh menu Tema
- Klik Edit HTML
- Cari instruksi berikut :
<div id='share-container'>
<div class='label-line-c'>
<p class='share-this-pleaseeeee'>Share this post</p>
</div>
<div id='share'>
<!-- facebook -->
<a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<!-- twitter -->
<a class='twitter' expr:href='"http://twitter.com/share?url=" + data:post.url' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<!-- google plus -->
<a class='googleplus' expr:href='"http://plus.google.com/share?url=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a>
<a class='linkedin' expr:href='"http://www.linkedin.com/shareArticle?mini=true&amp;url=" + data:post.url + "&amp;title=" + data:post.title + "&amp;summary=" + data:post.snippets' rel='nofollow' target='_blank'><i class='fa fa-linkedin'></i></a> -->
<a class='pinterest' expr:href='"http://pinterest.com/pin/create/button/?url=" + data:post.url + "&amp;media=" + data:blog.postImageUrl + "&amp;description=" + data:post.title' rel='nofollow' target='_blank'><i class='fa fa-pinterest-p'></i></a> -->
<a class='whatsapp' data-action='share/whatsapp/share' expr:href='"whatsapp://send?text=" + data:post.title + "%20%2D%20" + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/></a>
</div>
</div>
- Lalu ganti dengan instruksi berikut ini :
<div id='share-container'>
<div class='label-line-c'>
<p class='share-this-pleaseeeee'>Share this post</p>
</div>
<div id='share'>
<!-- facebook -->
<a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<!-- twitter -->
<a class='twitter' expr:href='"http://twitter.com/share?url=" + data:post.url' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<!-- google plus
<a class='googleplus' expr:href='"http://plus.google.com/share?url=" + data:blog.url' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a> -->
<!-- linkedin -->
<a class='linkedin' expr:href='"http://www.linkedin.com/shareArticle?mini=true&amp;url=" + data:post.url + "&amp;title=" + data:post.title + "&amp;summary=" + data:post.snippets' rel='nofollow' target='_blank'><i class='fa fa-linkedin'></i></a>
<!-- pinterest -->
<a class='pinterest' expr:href='"http://pinterest.com/pin/create/button/?url=" + data:post.url + "&amp;media=" + data:blog.postImageUrl + "&amp;description=" + data:post.title' rel='nofollow' target='_blank'><i class='fa fa-pinterest-p'></i></a>
<a class='whatsapp' data-action='share/whatsapp/share' expr:href='"whatsapp://send?text=" + data:post.title + "%20%2D%20" + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/></a>
</div>
</div>
- Setelah itu klik Simpan Tema
Sampai disini anda sudah berhasil mengganti share button google plus dengan pinterest dan linkedin,sekarang saatnya anda mengatur supaya VioMagz AMP menjadi Valid sehabis dilakukan pengeditan.
e. Cara Validasi AMP sehabis VioMagz Amp mengalami Pengeditan
Salah satu permasalahan yang sering terjadi di dalam template VioMagz AMP yaitu sehabis dilakukan pengeditan atau penggantian widget. Template menjadi tidak Valid AMP,oleh alasannya itu disini saya sertakan cara mengatasinya :- Buka Blogger.com
- Sign In dengan Akun Anda
- Masuk ke Dashboard Blogger
- Pilih hidangan Tema
- Klik Edit HTML
- Cari instruksi berikut :
<html b:css='false' b:responsive='true' b:version='2' class='v2' expr:dir='data:blog.languageDirection' lang='id' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
- Ganti dengan instruksi berikut ini :
<html b:css='false' b:responsive='true' b:version='2' class='v2' expr:dir='data:blog.languageDirection' lang='id'>
- Setelah itu klik Simpan Template
Setelah itu silahkan anda cek Validasi AMP untuk mengetahui apakah template masih error atau sudah kembali valid.