Review dan Setting Lengkap AMP for WP

Artikel ini terakhir diperbaharui pada 2 Oktober 2020.

Halo selamat malam semua, kali ini saya akan share pengalaman untuk setting plugin AMP for WP.

Sekaligus saya akan review sedikit untuk setiap extension yang menurut saya pribadi sangat prioritas untuk di implementasikan.

Artikel ini akan sangat panjang karena saya akan cb bahas satu per satu terkait extension yang ada disamping akan saya jelaskan juga fungsi utama dari plugin ini.

Jadi saya sarankan anda melakukan bookmark atau save terlebih dahulu url artikel ini agar dapat anda baca jika sudah memiliki waktu luang agar lebih santai.

Saya memang secara masif pada blog ini mengkampanyekan amp karena memang menurut hemat saya amp adalah framework yang dimasa depan akan di implementasi oleh banyak situs.

Sebelumnya jika anda tidak memiliki akses full pada amp for wp, anda bisa membeli plugin nya dengan harga 100k saja.

Silahkan anda baca artikel saya kenapa bisa 100k apakah legal atau tidak, disini, dan disini.

Jika sudah yakin, silahkan anda belanja di situs poskasir.net, dan bayar menggunakan va atau ewallet anda.

Oke kembali ke artikel, jadi jika anda belum mempunyai lisensi full akses, bagian dari extension tidak bisa anda manfaatkan, mungkin sampai sebatas setup biasa saja pada menu free.

Fungsi AMP

Seperti yang sudah saya tulis berkali-kali pada blog ini, fungsi framework AMP yang sangat fundamental adalah untuk speed up situs anda, terutama jika situs anda diakses oleh perangkat mobile.

Project ini pertama kali di propagandakan oleh Google pada tahun 2015, yang dimana situs-situs pada umum nya ‘harus’ mengadopsi kerangka kerja ini agar mudah diakses oleh mobile phone, karena google memprediksi bahwa kebanyakan nantinya perangkat yang mengakses internet adalah dari mobile phone.

Dan prediksi itu memang benar terjadi, menurut situs statcounter.com bahwa pengguna mobile phone mencapai 51.33% pada agustus 2020.

mobile phone penetration from statcounter.com

Sedangkan angka pertumbuhan pengguna mobile phone dari 2013 vs 2019 mencapai 222% menurut broadbandsearch.net.

mobile phone growth 2013 vs 2019 from broadbandsearch.net

Jadi memang framework ini mempunyai masa depan yang cerah jika nantinya di tahun – tahun depan lebih banyak lagi pengguna yang mengakses internet dari mobile phone.

Installation

Langkah awal anda harus menginstall plugin ampforwp terlebih dahulu, silahkan anda download pluginya pada repostory wordpress.org. Setelah anda melakukan installasi plugin, kemudian activekan plugin ampforwp nya.

Basic Setup

Jika anda diminta untuk memilih antara basic setup dan advance setup, sementara anda pilih basic setup terlebih dahulu agar tidak terlalu bingung.

basic setup ampforwp

Website Type

Pada dashboard basic setup ada beberapa hal yang mesti anda pahami, pertama website type : ini type dari web anda apakah blog, news, local business, e-commerce atau yang lainya.

website type selector ampforwp

Where do you need AMP

Kemudian Where do you need AMP : ini maksudnya dimana anda membutuhkan rendering agar url anda diserve menggunakan framework AMP. Jika situs anda adalah blog dan news maka pilih Home, Posts, Page dan Archive.

halaman mana saja yang ingin dilayani / serve oleh amp framwork

Karena hemat saya blog dan news sudah barang tentu isinya standard tulisan, image dan video, dimana basic seperti itu sudah bisa dilayani oleh AMP.

Jika situs anda adalah e-commerce yang menggunakan plugin woocommers, ada extension untuk woocommerce pada extension manager yang bisa anda dapatkan disini.

Design and Presentation

Pada tab ini anda diminta untuk mengupload logo dari situs anda, dan global warna dari situs. Misalnya nanti jika situs anda dilayani oleh AMP framework, warna link, tombol, dll akan di represantasikan dalam warna yang anda pilih.

logo dan warna ampforwp

Usahakan pilih warna yang sesuai dengan marwah situs anda, misalnya spirit situs nya berwarna biru, maka pilih global color nya biru juga.

Analytic Tracking

Situs anda bisa ditracking dengan tools milik google yakni google analytic, pada dasarnya anda hanya melakukan input tracking-id pada konfigurasi ini.

Klik Add / Pilih Google analytic kemudian masukan tracking-id ke dalam text box, jika anda belum mengetahui cara mendaftar dan membuat google analytic, anda bisa baca artikel saya disini.

google analytic tracking on ampforwp

Lebih jauh sebenarnya AMP merubah format js ke json untuk dapat diakses dengan frameworknya, jika pada AMP versi gratis anda harus menyisipkan sintak jasonnya langsung, silahkan baca artikel saya disini.

Privacy Setting

Pada konfigurasi ini anda diminta untuk memunculkan notifikasi baik itu cookies ataupun GDPR compliant, biasanya untuk regulasi pengunjung dari negara2 eropa.

cookies and gdpr notice ampforwp

Jika situs anda seperti blog saya yang hanya dikunjungi oleh negara kesatuan republik indonesia, maka GDPR tidaklah terlalu penting. Jadi anda setup aja untuk cookies notice.

Advertisement

Nah ini sebanarnya bagian yang sangat menarik perhatian, karena kebanyakan blogger ingin agar situs nya menghasilkan uang, setidaknya untuk biaya operasional, karena menyewa hosting, cloud hosting ataupun vps ini tidak murah, banyak printilannya.

adsense configuration on ampforwp

AMP framework memang sangat sulit untuk implementasi adsense, bahwkan jika situs anda menggunakan plugin amp versi resmi dari google dengan mode standard, anda tidak bisa melakukan pendaftaran adsense (jika sudah punya akun adsense ini bisa diserve pada amp framework, hanya saat daftar anda perlu adsense verification code yang harus di tempel pada situs saat di review ini tidak bisa dilakukan).

Karena mode standard sama sekali tidak mengizinkan adanya js pada halaman yang diserve, jadi anda perlu mengubah ke mode transitional atau reader, anda bisa membaca artikel saya disini.

Namun untuk ampforwp anda bisa melakukan setup sedemikian rupa, sehingga kalaupun anda baru mendaftar adsense di google, anda tidak perlu kerepotan untuk menanamkan adsense verification code di plugin ini.

3rd Party Compatibility

Untuk konfigurasi ini meliputi SEO dan tambahan beberapa plugin yang harus anda install dengan extension manager seperti ads for wp atau pwa for wp.

Untuk yang menggunakan SEO tools seperti yoast seo sudah compatible dengan ampforwp ini, jadi anda tidak perlu khawatir.

yoast seo and ads fo wp

Extension

Silahkan anda membeli lisensi untuk ampforwp dengan harga 99k disini. Kemudian ikuti langkah-langkah seting nya dibawah ini.

Jika anda belum memilik lisensi untuk extension manager nya, anda tidak dapat melakukan seting konfigurasi.

lisensi ampforwp

Berikut ini adalah yang menurut saya pribadi paling menarik untuk di implementasikan dari sekian banyak extension yang disediakan.

Urutan ini bukan berarti ukuran lebih baik atau tidak, melaikan hanya pendapat saya pribadi. OKE, mari mulai.

Subdomain AMP

Extension ini yang menjadi perhatian saya pertama, karena anda bisa menggunakan end point dari amp /amp/ menjadi misalnya amp.hendrawijaya.net

Jadi jika dilihat dari mobile view lebih eye catching dengan awalan amp.namadomain daripada namadomain.com/artikel/amp.

Berikut adalah cara setting nya, pertama aktivasi terlebih dahulu extension subdomain amp pada extension manager. Kemudian ubah settingan menjadi user subdomain as end point seperti gambar dibawah ini.

Pastikan subdomainnya menjadi amp.namadomain.com, pilih use subdomain as endpoint. Kemudian klik save change.

subdomain amp setup

Setelah anda melakukan save pada amp subdomain, langkah selanjutnya adalah melakukan rebuild untuk permalink wordpress anda.

Caranya adalah sebagai berikut, Klik Setting, klik permalink. Kemudian Klik Save untuk rebuild ulang.

permalink rebuild for subdomain amp

JIka sudah melakukan rebuild pada permalink milik anda, silahkan setting subdomain pada domain management di registran dimana anda membeli domain.

Jika anda menggunakan cloudflare, tambahkan type A record dengan nama AMP dan kemudian mapping menggunakan IP Server anda, klik save.

add subdomain pointing

Jika sudah berhasil, seharusnya ampsubdomain anda seperti dibawah ini amp.hendrawijaya.net/judul-artikel.

subdomain amp berhasil di implementasikan

AMP Comment

Fitur selanjutnya yang menurut saya dapat di implementasikan adalah fitur AMP comment. Jika fitur ini tidak di aktivekan mostly anda akan di redirect ke tampilan website utama / non amp agar pengunjung situs anda dapat meninggalkan komentar pada postingan.

Namun dengan adanya fitur amp comment, maka pengunjung situs akan langsung bisa meninggalkan komentar pada mode amp tanpa harus switch ke mode non amp.

Pertama aktive kan terlebih dahulu extension dari amp comment. Navigasi ke AMP, kemudian Klik extentions manager, kemudian klik activated amp comment.

Setelah aktive, navigasi ke menu AMP comment dan pilih dimana form komentar akan ditampilkan, di bawah komentar atau di atas komentar, dan juga ada bisa memilih apakah boleh langsung reply pada komentar sebelumnya atau harus membuat komentar baru.

Lebih jauh, anda bisa integrate dengan recaptcha milik google dengan versi terbaru yakni invisible recapcha versi 3.

amp comments

Bersambung…

Tinggalkan Komentar

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Scroll to Top