Cara Membuat Contact Seperti Kompi Ajaib Pada Template AMP dan Non AMP

 www.azid45.web.id - Cara Membuat Contact Seperti Kompi Ajaib Pada Template AMP dan Non AMP. Mungkin dari kalian para blogger terkenal sudah kenal dengan Adhy Suryadi admin dari kompiajaib. Beliau sangat mahir dalam koding template terutama masalah template AMP. Sebagaimana pada salah satu websitenya kompiajaib yang terkenal dengan berbagai macam tutorial mulai dari css, html5, AMP, sampai adsense membuat para blogger sering mengunjungi web tersebut. Lebih menariknya lagi pada contact yang disajikan oleh mas adhy suryadi menurut saya sangat lengkap dan tidak seperti blog pada umumnya.

Kalau blog pada umumnya dalam menyajikan contact us, mereka hanya menyajikan contact secara normal yakni dimana ada tabel nama, email, dan kolom pesan. Sedangkan pada contact yang disajikan oleh mas adhy suryadi sangat berbeda yakni selain pada umumnya yang terdapat kolom nama, email, dan kolom pesan juga terdapat infomasi lainnya seperti bisa menghubungi melalui mail dari outlook yang merupakan layanan dari office, gmail, dan yahoo, selain email juga terdapat contact yang menghubungkan langsung ke whatsapp (namun contact tersebut sudah tidak ditampilkan lagi), telegram, dan BBM. Mungkin untuk melihat tampilannya bisa langsung lihat pada web beliau klik aja disini atau kontak saya sendii klik disini.

Sebelum menuju tutorialnya, saya akan memberikan informasi bahwa saya mendapatkan seperti mas adhy suryadi saya melakukan inpact dari webnya mas adhy suryadi dan juga melihat juga dari tutorial mas adhy suryadi. Selain itu, memang contact saya dan mas adhy sedikit berbeda. Kalau milik saya tanpa icon dan untuk mas adhy tedapat icon. Hal ini memang saya sengaja karena jika memakai icon tulisannya tidak begitu terlihat oleh karena itu saya hilangkan iconnya. Tapi tenang saja karena saya akan memberikan codenya kepada teman-teman keduanya biar kalian bisa memilih salah satunya.

Ok. langsung saja, pertama download terlebih dahulu scriptnya disini (download), setelah itu masuk pada menu halaman / page dan buat halaman baru, pilih type HTML. Copy script yang sudah didwonload tadi dan pastekan pada halaman yang teman-teman buat. Setelah itu simpan. Klik view untuk melihat hasilnya.

Keterangan:

Ganti [email protected] dengan email Anda.

Ganti 081312xxxxxx dengan nomor hp Anda untuk WA.

Ganti @usernametelegram dengan username telegram Anda.

Ganti url contac dengan contact yang sudah anda buat. (Untuk membuat url contact klik disni, akan langsung menuju tutorial dari mas kompi ajaib, karena saya tidak berhak membuat ulang. hehehe)

Demikianlah cara membuat contact kompi ajaib pada template AMP Semoga bermanfaat.

Update

Untuk template non AMP tidak usah kawatir karena contact tersebut bisa juga digunakan pada blog non AMP dengan menghapus code "amp" pada script yang ada "img" yang teman-teman download.  cukup menghapusnya.  Script tersebut berada di daerah paling bawah (atas dan bawah "url contact") 

Untuk demonya bisa dilihat disini