Masih ingat dengan tulisan Cara Memasukkan Ayat Al-Qur'an Kedalam Artikel? Itu tulisan jadul mengenai cara menambakhan ayat-ayat Al-Qur'an yang berupa gambar atau image kedalam artikel blog. Pada saat itu, memang cara itulah yang saya tahu dan paling mungkin dilakukan mengingat perkembangan dunia informatika belum semaju dan secanggih ini. Namun kini, ternyata ada cara lain yang bisa kita lakukan untuk memasukkan ayat-ayat Al-Qur'an kedalam artikel tersebut. Cara ini, tidak lagi menggunakan image tetapi lansung berupa teks ayat-ayat Al-Qur'an.

Selain itu, cara ini pun memudahkan kita untuk mengatur dan mewarnai huruf, menandai kalimat-kalimat tertentu dengan warna yang berbeda, juga bisa melakukan pemenggalan terhadap ayat-ayat Al-Qur'an sesuai dengan kebutuhan. Berbeda dengan ketika menggunakan image kita tidak bisa melakukan hal itu semua.

Sebagai contoh bisa dilihat pada penggalan surat Al-Hujurât ayat 11 berikut, dengan menandai kalimat yang ingin diberikan tekanan:
Untuk memasukkan ayat-ayat Al-Qur'an yang berupa teks ini kita bisa memanfaatkan ayat-ayat Al-Qur'an dari Al-Qur'an Online atau dari sumber lain yang kita temukan. Caranya:

• Masuklah ke Editing Template blog, kemudian tambahkan CSS berikut di atas kode ]]></b:skin>:
  

  /*=== Huruf Arab ===*/
  .arabic {
  font-size: 26px; font-weight: normal;
  font-family: 'KFGQPC Uthman Taha Naskh', KFGQPC_Naskh, 'traditional arabic';
  margin-top: 10px; margin-bottom: 10px; 
  padding-left: 20px; padding-right: 20px;
  direction: rtl; line-height: 34px;
  }
  .translate {
  margin-top: 0px; margin-bottom: 20px; 
  padding-left: 20px; padding-right: 20px;
  }
  

  Ukuran berwarna merah bisa diatur kembali jika diperlukan

• Setelah disimpan, mulailah dengan Entri baru.
• Pilihlah mode HTML, lalu lakukan penulisan seperti ini:

  <div class="arabic">
  Ayat Al-Qur'an tempelkan di sini
  </div>
  <div class="translate">
  Terjemahan tempelkan di sini
  </div>
  

• Pilih ayat-ayat dari quran.ittelkom.ac.id, atau dari sumber lain, lalu kopi (copy) dan tempelkan (paste) di antara kode div (warna biru).
  Untuk lebih memudahkan pencarian ayat, bisa langsung munuliskan URL pada address bar seperti ini:

  Surat Al-Baqarah ayat 255 (QS, 2:255), ditulis:
  http://quran.ittelkom.ac.id/?sid=2&aid=255&pid=arabicid
  
  Surat Al-Hujarat ayat 11 (QS, 49:11), ditulis:
  http://quran.ittelkom.ac.id/?sid=49&aid=11&pid=arabicid

• Lakukan pratinjau (preview) kalau-kalau ada karakter huruf yang "ngaco" (tanda waqaf jadi seperti kotak). Jika ada, hapus karakter tersebut.
• Jika ingin menandai kalimat pada ayat Al-Qur'an dengan warna berbeda, masuklah ke mode Compose lalu blok dan beri warna.
• Setelah itu simpan dan ucapkan Alhamdulillah...

Nah, selesai deh. Gampang kan?

Ok, segitu aja sob. Semoga bermanfaat .....