Cara Membuat Shortcode di Hugo untuk Menampilkan Tag iframe Google Maps

JagoTekno – Menulis konten dengan format Markdown di HUGO memang sangat mudah dan menyenangkan.

Sebagaimana sudah diketahui bahwa hugo akan mengkonversi file markdown (.md) menjadi file html yang siap untuk dipublish ke internet.

Tapi ada satu hal yang agak tricky dilakukan ketika hendak menambahkan maps pada postingan blog kita.

Untuk dapat menyematkan maps pada artikel markdown, google memberikan kode dalam bentuk tag html <iframe>.

Tapi kode tersebut tidak bisa langsung dicopy paste begitu saja pada file .md kita. Pasti tidak terbaca.

Jadi bagaimana caranya supaha tag <iframe> terbaca di file markdown hugo?

  1. Buatlah file shortcode dengan nama rawhtml.html
  2. Di dalamnya sematkan baris ini {{.Inner}}
  3. Edit file artikel markdown anda lalu letakkan tag iframe di antara shortcode yang telah dibuat.
{{<rawhtml>}}
<iframe google maps di sini>
{{</rawhtml>}}

Penjelasan :

Kode {{.Inner}} yang ditulis pada file shortcode akan memaksa file markdown untuk merender file html yang disudah di set.

Selesai.

Sekarang anda bisa menyematkan maps google pada postingan hugo anda.

Semoga bermanfaat.

Tinggalkan komentar