e-Solat JAKIM : Widget Penting yg Dipakai Setiap Hari

OK, ni nak kongsi macamana boleh tambah widget e-Solat milik JAKIM. Dulu memang geram sangat sebab bila add widget e-Solat dekat blog, selalu tak menjadi. Dulu macam ada coding iframe HTML yang tak lengkap pulak bila tengok. Sekarang JAKIM dah betulkan balik, coding pun jadi lebih ringkas dah. Yela, gunanya e-Solat nih sebab selalu sangat melayari panggilan internet, sampai panggilan Ilahi pulak boleh terabai. Uiii, jangan, jangannn, biar beringat dari tak sempat. Nangis tak berlagu pulak nanti, bahaya.. :-(

Maka, oleh itu, diharap, demi Allah, dengan adanya widget ini dalam blog sendiri, maka waktu solat akan lebih terjaga. Bukan mengingat waktu solat sendiri aja, tapi sama mengingat waktu solat untuk teman-teman kita juga.

Jadi, di bawah ini ialah coding widget e-Solat JAKIM yang penuh, dan telah diubahsuai. (Diambil dari laman sesawang e-solat JAKIM )

1. Mula-mula, pergi laman sesawang e-Solat, cari "source code" atau "kod sumber". (Ketika entri ini ditulis, ianya berada di sebelah kiri, bahagian bawah sekali)
2. Lepas klik, ada paparan nama-nama tempat seluruh Malaysia, dan kod sumber/source code untuk widget e-Solat kita.
3. Pilih rekabentuk yang menarik dihati, salin semua codingnya, kemudian tampal di dalam blog.
4. Buat beberapa pengubahan pada kod sumber, kemudian barulah disimpan (save).

Oleh kerana terlebih rajin, di letakkan sekali kod sumbernya terus dalam entri ini. :-P

Untuk rekabentuk pertama... (kotak besar punya)

<iframe src=http://www.e-solat.gov.my/solat.php?kod=KOD&lang=LANG&url=URL height="255" frameborder=0></iframe>

Rekabentuk yang kedua... (mini e-Solat )

<iframe src=http://www.e-solat.gov.my/solat-iframe.php?kod=KOD&lang=LANG&url=URL&font=FONT&fontcolor=FONTCOLOR&bgcolor=BGCOLOR width=100% height=33 frameborder=0></iframe>

***Penting***
Perasan tak ada beberapa kod sumber yang ditulis dengan huruf besar? Kod-kod inilah yang kita akan ubahsuai nanti. Senang je caranya, cuma padam (delete) kemudian tulis kod sumber yang baru.
****************

Kod mana yang perlu diubah? Haa.. jum tengok~~

Rekabentuk e-Solat 01 guna kod sumber yang ringkas, tapi rekabentuk 02 ada banyak kod. Apa-apa pun, akan di tulis untuk semua kod yang perlu diubah.

Sekali lagi, kod yang dalam huruf besar hendaklah dipadam, kemudian ditulis dengan kod yang baharu~ Apabila dituliskan yang baru, tak perlu gusar nak guna huruf besar ke huruf kecil. Dua-dua kod boleh dipakai.

• Untuk KOD, ini bermaksud kod untuk kawasan waktu solat. Anda guna kod untuk kawasan anda. Kod kawasan akan mempunyai waktu solat yang berbeza dengan kawasan lain.
• Untuk LANG pula, ini ialah kod bahasa (language). Tulis BM untuk kod e-Solat yang berbahasa Melayu, tulis ENG untuk kod versi bahasa Inggeris.
• URL, ini untuk kita letakkan URL blog kita. 
• FONT = bentuk tulisan. Ada macam-macam bentuk yang ada, nanti kita tengok. Yang popular ialah Times New Roman? Guna tulisan yang semua komputer boleh baca, kalau guna font yang istimewa, mungkin apabila blog kita dilawati dengan komputer lain, widget e-Solat kita tak dapat dilihat. Setting dah lari... 
• FONTCOLOR ialah kod untuk warna tulisan. Kalau dari contoh laman e-Solat, kod #FFFFFF akan menjadikan tulisan pada widget berwarna puteh. 
• dan yang terakhir, BGCOLOR pula ialah kod warna latar (background color). Contoh yg dberi ialah #261798 (biru), iaitu warna biru.

Okay, sekarang kita lihat contoh-contoh demo-nya.

Template 01
KOD : swk08, LANG: ENG.  

Zon 8 - Kuching, Bau, Lundu,Sematan
01/01/2012 JAKIM
GMT	8
Qiblat Direction	292° 5′ 26″
Prayer Time
Imsak	05:11
Subuh	05:21
Syuruk	06:42
Zohor	12:47
Asar	16:11
Maghrib	18:47
Isyak	20:02

 Template 02
KOD : swk08, LANG: BM, FONT: Times new roman. FONTCOLOR: #FFFFFF. 

Zon 8 - Kuching, Bau, Lundu,Sematan [ e-Solat]

Imsak 05:11

Subuh 05:21

Syuruk 06:42

Zohor 12:47

Asar 16:11

Maghrib 18:47

Isyak 20:02

Haa.. Menjadi ? :-D Tapi yg rekabentuk 02 tu tak edit BGCOLOR sebab kod tu tak berfungsi walaupun dah diubah warna lain. Tapi kalau FONTCOLOR tak ditukar dengan kod warna lain, rekabentuk 02 tu akan jadik warna merah. Tak tahu kenapa, setting iframe JAKIM ada lari siketla..

Dan, yang di bawah ini ialah senarai untuk kod-kod kawasan negeri anda. Gantikan KOD sahaja dalam kod sumber tadi.
Susunan: (KOD) (Kawasan)

Sabah :

• sbh01 Zon 1 - Sandakan, Bdr. Bkt. Garam, Semawang, Temanggong, Tambisan
• sbh02 Zon 2 - Pinangah, Terusan, Beluran, Kuamut, Telupit
• sbh03 Zon 3 - Lahad Datu, Kunak, Silabukan, Tungku, Sahabat, Semporna
• sbh04 Zon 4 - Tawau, Balong, Merotai, Kalabakan
• sbh05 Zon 5 - Kudat, Kota Marudu, Pitas, Pulau Banggi
• sbh06 Zon 6 - Gunung Kinabalu
• sbh07 Zon 7 - Papar, Ranau, Kota Belud, Tuaran, Penampang, Kota Kinabalu
• sbh08 Zon 8 - Pensiangan, Keningau, Tambunan, Nabawan
• sbh09 Zon 9 - Sipitang, Membakut, Beaufort, Kuala Penyu, Weston, Tenom, Long Pa Sia

Sarawak :

• swk01 Zon 1 - Limbang, Sundar, Terusan, Lawas
• swk02 Zon 2 - Niah, Belaga, Sibuti, Miri, Bekenu, Marudi
• swk03 Zon 3 - Song, Belingan, Sebauh, Bintulu, Tatau, Kapit
• swk04 Zon 4 - Igan, Kanowit, Sibu, Dalat, Oya
• swk05 Zon 5 - Belawai, Matu, Daro, Sarikei, Julau, Bitangor, Rajang
• swk06 Zon 6 - Kabong, Lingga, Sri Aman, Engkelili, Betong, Spaoh, Pusa, Saratok, Roban, Debak
• swk07 Zon 7 - Samarahan, Simunjan, Serian, Sebuyau, Meludam
• swk08 Zon 8 - Kuching, Bau, Lundu,Sematan

Johor :

• jhr01 Pulau Aur dan Pemanggil
• jhr02 Kota Tinggi, Mersing, Johor Bahru
• jhr03 Kluang dan Pontian
• jhr04 Batu Pahat, Muar, Segamat, Gemas

Melaka :

• mlk01 Bandar Melaka, Alor Gajah, Jasin, Masjid Tanah, Merlimau, Nyalas

Negeri Sembilan :

• ngs01 Jempol, Tampin
• ngs02 Port Dickson, Seremban, Kuala Pilah, Jelebu, Rembau

Selangor dan Wilayah Persekutuan:

• sgr01 Gombak, Hulu Selangor, Rawang, Hulu Langat, Sepang, Petaling, Shah Alam
• sgr02 Sabak Bernam, Kuala Selangor, Klang, Kuala Langat
• sgr03 Kuala Lumpur
• sgr04 Putrajaya

• wly02 Labuan

Perak :

• prk01 Tapah,Slim River dan Tanjung Malim
• prk02 Ipoh, Batu Gajah, Kampar, Sg. Siput dan Kuala Kangsar
• prk03 Pengkalan Hulu, Grik dan Lenggong
• prk04 Temengor dan Belum
• prk05 Teluk Intan, Bagan Datoh, Kg.Gajah, Sri Iskandar, Beruas, Parit, Lumut, Setiawan dan Pulau Pangkor
• prk06 Selama, Taiping, Bagan Serai dan Parit Buntar
• prk07 Bukit Larut

Pulau Pinang :

• png01 Seluruh Negeri Pulau Pinang

Kedah : (kenapa Kulim keluar 2 kali JAKIM buat?)

• kdh01 Baling, Sik, Padang Terap
• kdh02 Kubang Pasu, Kota Setar, Pendang, Kulim, Bandar Bharu, Kuala Muda, Yan
• kdh03 Puncak Gunung Jerai
• kdh04 Langkawi
• kdh05 Pendang, Kuala Muda, Yan
• kdh06 Kulim, Bandar Baharu

Perlis :

• pls01 Kangar, Padang Besar, Arau

Kelantan (takde ktn02?):

• ktn01 Kota Bharu, Bachok, Pasir Puteh, Tumpat, Pasir Mas, Tanah Merah, Machang, Kuala Krai, Mukim Chiku (Jajahan Gua Musang)
• ktn03 Jeli, Gua Musang (Mukim Galas, Bertam)

Pahang :

• phg01 Pulau Tioman
• phg02 Kuantan, Pekan, Rompin, Muadzam Shah
• phg03 Maran, Chenor, Temerloh, Bera, Jerantut
• phg04 Bentong, Raub, Kuala Lipis
• phg05 Genting Highlands, Bukit Fraser
• phg06 Cameron Highland

Terengganu :

• trg01 Kuala Terengganu, Marang
• trg02 Besut, Setiu
• trg03 Hulu Terengganu
• trg04 Kemaman, Dungun 

Terima Kaseh untuk pihak JAKIM kerana widget e-Solat ini, Syukran Jazilan~~ :-D

Rasanya widget e-Solat nih dah siap dah, dah boleh tampal di blog anda juga. Kalau masih ada masalah, sila rujuk ke laman rasmi e-Solat JAKIM kita dan guna kod sumber yang asal. 

• Pautan e-Solat JAKIM Malaysia.
• Gambar testi diubahsuai dari Testi.iluvIslam.com.
• e-Solat latar hitam diambil dari theStar Online. 
• Cara nak letak textarea yang tak dapat diedit dari Tricks for new Bloggers. 

 Dapatkan Mesej Bergambar di Sini