Cara Membuat Postingan Huruf Arab Pada Blog Valid AMP

by

Cara Menulis Tulisan Arab Di Blog Valid AMP HTMLCara Menulis Tulisan Arab Di Blog Valid AMP HTML – Mungkin sebagian dari kita Blogger untuk menulis sebuah artikel hanya butuh huruf/font biasa, tapi untuk blog yang berkategorikan blog Doa-Doa atau blog yang membahas tentang Hadist maupun Al-Quran dan yang berhubungan dengan Agama, sangat membutuhkan adanya font atau huruf arab untuk satu buah artikelnya, Nah kendala nya sekarang jika blog kalian berkategorikan tentang yang saya sebutkan diatas dan sekarang anda menggunakan blog yang sudah valid amp, dan agar tulisan arab yang kita post bisa valid amp,kita tidak bisa langsung menempelkan atau menulis langsung tulisan arab tersebut, karena kita harus menggunakan bantuan website dulu untuk penulisan font arabnya dan sedikit tambahan css agar tulisan arab yang kita tulis/tempel bisa tampil dan juga menjadi valid AMP.
Bagaimana caranya? Yukk silahkan simak langsung Caranya dibawah ini:

Cara Menulis Tulisan/Artikel Arab Di Blog Valid AMP HTML

  • Pertama silahkan Copy Kode CSS di bawah ini dan Taruh di atas style amp-custom di bagian CSS postingan Desktop mauun Mobile. 

    .arab { font-size: 22px; line-height: 48px; font-family: "KFGQPC Uthman Taha Naskh",KFGQPC_Naskh,"Traditional Arabic",Tahoma,sans-serif; font-weight: normal; text-align: right; direction: rtl; }

  • Dan Kode Berikut ini Bisa ditaruh dibagian css manapun, kalaupun hanya di css bagian postingan juga tidak apa-apa. 

    @font-face{ font-family:'me_quran'; src:url('https://kangismet.github.io/fonts/me_quran.eot'); src:url('https://kangismet.github.io/fonts/me_quran.eot?#iefix') format('embedded-opentype'), url('https://kangismet.github.io/fonts/me_quran.ttf') format('truetype'); font-weight:normal; font-style:normal }

  • Jika Sudah,sekarang lanjut untuk cara penulisanya kita menggunakan bantuan aplikasi/website online untuk menulis huruf arabnya, Untuk situsnya silahkan anda kunjungi link berikut ini http://www.arabic-keyboard.org
  • Silahkan anda rangkai/tulis tulisan arabnya,
  • jika sudah selesai, kemudian silahkan anda copy tulisan arabnya.
  • Kemudian untuk penulisan nya di postingan silahkan anda tambahkan kode <div class="arab"> Tulisan Arab Disini </div> di mode HTML bukan Compose disetiap anda menulis tulisan arab.
  • seperti contoh dibawah ini adalah Tulisan arab Doa untuk Orang Tua. 

    <div class="arab"> اَللهُمَّ اغْفِرْلِىْ ذُنُوْبِىْ وَلِوَالِدَىَّ وَارْحَمْهُمَا كَمَا رَبَّيَانِىْ صَغِيْرًا </div>
  • Maka hasilnya akan seperti dibawah ini,

    اَللهُمَّ اغْفِرْلِىْ ذُنُوْبِىْ وَلِوَالِدَىَّ وَارْحَمْهُمَا كَمَا رَبَّيَانِىْ صَغِيْرًا

    “ALLAAHUMMAGHFIRLII DZUNUUBII WALIWAALIDAYYA WARHAMHUMAA KAMAA ROBBAYAANII SHOGHIIRO”
    Artinya : “Ya Allah, berikanlah ampunan kepadaku atas dosa-dosaku dan dosa-dosa kedua orang tuaku, dan kasihanilah keduanya itu sebagaimana beliau berdua merawatku ketika aku masih kecil”

  • Selesai.

    Saya rasa Cukup Jelas dan Mudah di praktekan jika anda ingin menempelkan tulisan arab/doa-doa yang sudah jadi anda tinggal tambahkan kode didepan nya dengan kode <div class="arab"> dan kode penutup </div>

    Mungkin hanya itu Untuk artikel tentang Cara Menulis Tulisan Arab Di Blog Valid AMP HTML Semoga bermanfaat dan semoga berhasil.

    • Leave a Comment