Posts

Showing posts with the label AMP

Memasang komentar facebook di Blogger​ AMP

By Anonymous -
Image
Blogger AMP Tutorial Parts Memasang Komentar Facebook di blogger AMP Berikut tutorial nya: Silahkan copy kode HTML ini.             <b:includable id='fb-comment' var='post'> <div class='fb-comments' id='fb_comments'> <amp-facebook-comments data-colorscheme='dark' data-numposts='5' expr:data-href='data:post.url' height='180' layout='responsive' width='600'> </amp-facebook-comments> </div>             </b:includable> Jika background Blog Anda putih, hapus kode data-colorscheme='dark' Kemudian simpan kode HTML tadi di bawah kode berikut: <b:includable id='comments' var='post'> ............ ............ ............ </b:includable> Sehingga penampakannya seperti berikut: <b:includable id='comments' var='post'> ............ ............ ............ </b:includable>             <b:includabl
Post a Comment
Location: New Jersey, Amerika Serikat
Read more

How to create facebook comments on AMP Blogger

By Anonymous -
Image
Finally Google chose  Facebook comments plugin  first supported by AMP HTML.  For that then I tried it on one of my AMP blog and Facebook comments appear perfect on the blog, how to install it is quite easy.   In addition, incoming comments can be synced with the fans page, meaning incoming comments can appear on the blog and on the fan page by using the Facebook application.   To try Facebook comments on the AMP blog, please try on the button below.   DEMO If you want to try posting a Facebook comment on the AMP blog, please follow the steps below.   Please copy this HTML code.   <b:includable id='fb-comment' var='post'>  <div class='fb-comments' id='fb_comments'>  <amp-facebook-comments data-colorscheme='dark' data-numposts='5' expr:data-href='data:post.url' height='180' layout='responsive' width='600'>  </amp-facebook-comments>  </div>  </b:includable> 
Post a Comment
Read more

Cara Mempercepat Blogger Dengan dns-prefetch metatag

By Anonymous -
Image
Bagaimana Cara mempercepat loading blogger AMP maupun NON AMP. Langkah awal mempercepat loading AMP Blogger maupun Blogger dengan template biasa (mengandung javascript). Link dns-prefetch metatag merupakan metatags untuk mempercepat loading external source. Dengan kata lain defer loading external sources . Kali ini saya akan share bagaimana cara mempercepat lagi loading AMP Blogger yang biasanya mengandung banyak <amp-iframe> . Ga pake lama, cekidot tutorialnya: 1. Buka dashboard Blogger . 2. Klik tab Layout --> klik Edit HTML . Kemudian, taruh kode dibawah ini dibawah <head> atau diatas </head> . <link rel="dns-prefetch" href="https://cdn.ampproject.org"/> Bila anda juga menggunakan fonts dari google cdn maka juga tambahkan: <link rel="dns-prefetch" href="https://fonts.googleapis.com"/> Dan bila anda juga menggunakan Fontawesome.css dari https://netdna.bootstrapcdn.com/font-awesome/[VERS
2 comments
Read more

Cara menyembunyikan javascript di blogger AMP dengan conditional tag

By Anonymous -
Image
Bagaimana cara menyembunyikan kode javascript di mobile blogger ? Nah bagi yang memakai template AMP di blogger biasanya bingung bagaimana cara menaruh javascript di template AMP agar hanya di eksekusi pada desktop atau komputer saja. Nah inilah fungsinya script conditional tag ini. Berikut kodenya: <b:if cond='data:blog.isMobileRequest == "false"'> JavaScript Yang Akan Disembunyikan </b:if> kode diatas berfungsi menyembunyikan javascript di mobile request. Dan tujuannya agar AMP tidak error karena ada script tag di mobile request. Taruh kode tersebut dimana saja, saya rekomendasikan di sebelum "</body>" tujuannya agar tidak memperlambat loading blog bila ditaruh di "<head>". Selesai.
Post a Comment
Read more

Cara menambah social media box di blogger AMP

By Anonymous -
Image
Cara menambah tombol G+, Like Facebook + Follow Twitter di AMP Blogger. Kali ini saya akan share bagaimana cara menambah tombol suka social media di AMP Blogger. Berikut kodenya: <amp-iframe width=300 height=122 sandbox='allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox' layout='responsive' frameborder='0' scrolling='no' src='https://source.l3n4r0x.cf/php/social.php?tw=USERNAME_TWITTER&fb=USERNAME_FACEBOOK'></amp-iframe> Options: tw=USERNAME TWITTER fb=USERNAME FANPAGE FACEBOOK Kenapa G+ tidak mempunyai Options ?. Jawabannya: Ya, karena G+ akan memberi  + G terhadap artikel untuk seo anda di hadapan search engine. (Rating Section). Contoh punya saya: <amp-iframe width=300 height=122 sandbox='allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox' layout='responsive' frameborder='0' scrolling='no' src='https://source.l3
Post a Comment
Read more

Cara Menambah Contact Form Di AMP Blogger Tanpa Menggunakan amp-iframe

By Anonymous -
Image
Cara Menambah Contact Form Di AMP Blogger Tanpa Menggunakan amp-iframe | Valid Contact Form For AMP | Valid AMP contact form for blog Banyak yang bertanya tanya kenapa saat memakai template amp di blogger widget mauput halaman contact form tidak berfungsi. Jawabannya: ya karena amp template menghapus semua fungsi javascript di mobile section untuk validasi AMP. Nah bagaimana cara mengatasi hal tersebut ?. Berikut tutorialnya <form method="post"   name="contactform"   class="p2"   action-xhr="https://source.l3n4r0x.cf/html/submit.php?admin=YOUREMAIL"   target="_top">   <div class="ampstart-input inline-block relative m0 p0 mb3">     <input type="text"       class="block border-none p0 m0"       name="name"       id="name"       placeholder="Your Name..."       required>     <input type="text"       class="block border-none p0 m0&quo
Post a Comment
Read more