Cara Membuat Halaman Contact Form Di Blog AMP

Cara Membuat Halaman Contact Form Di Blog AMP bagi pemula seperti Saya ini mungkin agak sedikit ribet. Hal ini karena cara atau langkah-langkahnya sangat berbeda jika membuat halaman contact form untuk blog non AMP.

Namun berbekal semangat pantang menyerah dan banyak belajar dari para master senior yang baik hati membagikan ilmunya, akhirnya halaman contact form valid AMP bisa didapatkan.

Membangun sebuah blog yang valid AMP bagi pemula memang membutuhkan tambahan semangat, sedikit cemilan, dan secangkir kopi hangat. Karena pastinya sangat berbeda jika dibandingkan dengan membuat blog non AMP. Silahkan baca juga cara terbaru submit URL ke Google Webmaster.

Membuat blog AMP ini bagi Saya pribadi merupakan suatu pengalaman baru karena memang masih awam. Oleh karena itu mendapati hasil halaman kontak yang valid AMP rasanya sangat senang sekali hehee. Oiya silahkan baca juga cara pasang iklan responsive di blog AMP.

Cara Membuat Halaman Contact Form Di Blog AMP

Halaman contact form atau halaman kontak saya ini sudah biasa ditemukan di blog, baik blog pemula maupun di blog-blog profesional. Fungsinya adalah untuk memudahkan para pengunjung jika ingin menghubungi pemilik blog tersebut dengan berbagai maksud tujuan. Silahkan baca juga cara menyisipkan gambar di artikel blog AMP.

Selain halaman kontak, kelengkapan blog yang lainnya adalah dengan mempunyai halaman sitemap untuk memudahkan pengunjung mendapatkan artikel yang dicarinya. Dan untuk contoh halaman kontak yang sudah Saya buat silahkan bisa klik gambar di bawah ini :

Lalu bagaimana ya caranya untuk membuat halaman kontak yang valid AMP?

• Langkah pertama memastikan terlebih dahulu template blog yang kamu gunakan sudah ada kode amp-iframe seperti di bawah ini :

<script async='async' custom-element='amp-iframe' src='https://cdn.ampproject.org/v0/amp-iframe-0.1.js'/>

• Jika sudah ada, bisa langsung lanjut ke langkah selanjutnya. Namun jika belum ada silahkan tambahkan terlebih dahulu kode tersebut di atas </style>

Selanjutnya adalah..

• Dapatkan template khusus untuk form kontak Disini
• Bukalah template tersebut denagn wordpad dan copy semua isinya
• Kemudian buatlah sebuah blog baru, namun masih dalam satu akun admin. Fungsi dari blog baru ini adalah untuk menampilkan contact form-nya, jadi hanya khusus untuk itu saja.
• Timpakan template yang diunduh tadi ke dalam tema blog baru
• Matikan mode selular (mobile)
• Jangan lupa untuk mengatur blog baru tersebut ke HTTPS ya

Setelah selesai, kita balik lagi ke blog utama kita dan saatnya membuat halaman baru untuk cntact form. Pilih mode HTML dan copy paste kan kode di bawah ini :

<amp-iframe title="Contact"

              src="https://hanyauntukcontoh.blogspot.com"

              height="400"<

              layout="fixed-height"

              frameborder="0"

              sandbox="allow-forms allow-scripts allow-same-origin allow-modals allow-popups">

    <amp-img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgHKrLmCLPqHtJfi8C-HX_6kQTanwkQpLncxaEj9zbiyf8weQ6oOM6-59IS4-dkaIkB1a3LbsGeS68kOQ0OBbwvkHduwbNyojiTdpOsxkJV6QHoBVf_QV7wLKX7hsZyJj224N88KcnQzU/s1600/placeholder.png"

             layout="fixed-height"

             height="400"

             width="auto"<

             placeholder>

    </amp-img>

  </amp-iframe>

• Perhatikan yang berwarna kuning, ganti URL tersebut dengan URL blog yang kamu buat tadi
• Setelah itu simpan dan lihat hasilnya.

Demikian tadi cara membuat halaman contact form untuk blog AMP. Kini blog kamu sudah memilikinya yang valid AMP. Semoga bermanfaat.

Berbagi :