Cara Menambahkan Facebook Like Button Di Blogger Valid Amp
Tutorial Cara Menambahkan Facebook Like Button di Blogger Valid AMP tanpa APP ID
AMP Blogger - Facebook merupakan medial sosial paling terkenal di Internet. Lebih dari 2 milyar orang sudah mempunyai akun Facebook, dan lebih dari 2 juta orang online dan akif memakai Facebook setiap harinya..
Facebook juga banyak dipakai oleh para marketing untuk memasarkan dan mempromosikan jasa atau barang yang mereka jual. Karena pasar Facebook ketika ini memang masih ramai dan potensial.
Begitu juga dengan para pemilik website atau blog yang mempromosikan website miliknya untuk mendatangkan trafik. Salah satu cara yang biasa dipakai para webmaster yaitu Facebook Share dan Facebook Like Button.
Tapi kali ini saya hanya akan menjelaskan cara menambahkan Facebook Like Button pada Blogger valid AMP, alasannya mengenai Facebook Share sudah saya jelaskan pada artikel Cara memasang Addthis Share.
Seperti biasa, untuk menambahkan komponen gres pada halaman AMP, kita membutuhkan komponen javascript dari AMP HTML. Dan untuk memasang Facebook Like Button, AMP HTML sudah menyiapkan amp-facebook-like.
Facebook juga banyak dipakai oleh para marketing untuk memasarkan dan mempromosikan jasa atau barang yang mereka jual. Karena pasar Facebook ketika ini memang masih ramai dan potensial.
Begitu juga dengan para pemilik website atau blog yang mempromosikan website miliknya untuk mendatangkan trafik. Salah satu cara yang biasa dipakai para webmaster yaitu Facebook Share dan Facebook Like Button.
Tapi kali ini saya hanya akan menjelaskan cara menambahkan Facebook Like Button pada Blogger valid AMP, alasannya mengenai Facebook Share sudah saya jelaskan pada artikel Cara memasang Addthis Share.
Menambahkan Like Button di Blog AMP
Seperti biasa, untuk menambahkan komponen gres pada halaman AMP, kita membutuhkan komponen javascript dari AMP HTML. Dan untuk memasang Facebook Like Button, AMP HTML sudah menyiapkan amp-facebook-like.
Masuk ke dashboard Edit HTML template Blogger anda. Copy dan paste komponen ini di dalam tag head ( sebelum </head> )
<script async='async' custom-element="amp-facebook-like" src="https://cdn.ampproject.org/v0/amp-facebook-like-0.1.js"></script>
Selanjutnya, copy aba-aba HTML berikut ini dan paste ditempat yang diinginkan.
<b:if cond='data:blog.pageType == "item"'>
<amp-facebook-like width="90"
height="20"
layout="fixed"
data-layout="button_count"
expr:data-href="data:post.url">
</amp-facebook-like>
</b:if>
Misalkan, untuk menempatkan Facebook Like Button di simpulan artikel, anda harus menambahkannyua di atas aba-aba <data:post.body/> yang terakhir.
Add Share Button
Jika anda ingin menambahkan tombol share disebelah Like Button, anda hanya perlu menambahkan aba-aba data-share='true' dan menambahkan atribut width menjadi 180px, sehingga aba-aba menjadi ibarat di bawah ini:
<b:if cond='data:blog.pageType == "item"'>
<amp-facebook-like width="180"
height="20"
layout="fixed"
data-layout="button_count" data-share='true'M/mark>
expr:data-href="data:post.url">
</amp-facebook-like>
</b:if>
Selanjutnya simpan perubahan pada template anda.
Namun perlu diperhatikan, jikalau seorang pengunjung melaksanakan klik Like, ia harus mengkonfirmasinya semoga like dapat dihitung.