Selasa, 31 Juli 2007

Pasang Snaps Shots

Apakah sobat pernah mengunjungi blog yang apabila mouse menyorot link kemudian keluar screenshoot? (artikel yang aneh baru mulai sudah ada pertanyaan) , nah apabila sobat berkeinginan blognya mempunyai fasilitas seperti itu coba deh baca artikel ini sampai selesai.



Untuk mendapatkan tool screenshoot seperti itu, sobat bisa mendapankannya diberbagai situs di internet. Agar tidak berlama-lama mencari, saya ambil contoh salah satunya adalah http://www.snap.com. Berminat tapi masih bingung cara mendapatkannya? silahkan ikuti langkah-langkah berikut ini :




  1. silahkan sobat kunjungi http://www.snap.com

  2. Apabila sobat sudah berada dihalaman situs tersebut, klik tombol Get Started Now

  3. Pilih warna yang di inginkan di bawah tulisan CHOOSE A COLOR THEME, klik saja warna yang tersedia

  4. Pilih Snap shot icon dan trigger di bawah tulisan CHOOSE A SNAP SHOT AND TRIGGER, klik saja pada radio button yang ada

  5. Apabila sobat ingin memasang logo milik sendiri, klik tombol Browse...., kemudian pilih gambar icon yang tersedia pada komputer sobat, apabila tidak mau ya biarkan saja

  6. Pilih ukuran snap shots di bawah tulisan CHOOSE SNAP SHOTS SIZE, beri tanda pada radio button nya

  7. Klik tombol Continue

  8. Masukan alamat blog sobat pada kotak di bawah tulisan Enter Your Site URL. contoh : http://template-unik.blogspot.com

  9. Masukan alamat email sobat di bawah tulisan Enter Your Email

  10. Beri tanda centang pada kotak di samping tulisan I agree to the Terms and Conditions below (kalau mau dibaca, silahkan baca dulu TOS nya)

  11. Klik tombol Continue

  12. Apabila sobat memakai template baru, klik banner logo Blogger, silahkan sign in di blogger dan pilih nama blog yang di inginkan

  13. Klik tombol MENAMBAH WIDGET, maka akan secara otomatis kode dari snaps shots akan di tambahkan

  14. Pindahkan elemen yang baru di tambahkan pada tempat yang di inginkan, karena kode tersebut memuat pula banner dari snapshot

  15. Klik tombol SIMPAN

  16. Selesai.






Bagi sobat yang memakai template klasik, pada langkah yang ke 12, sobat klik lagi tombol Continue. Klik link READ MORE yang berada di bawah tulisan yang berjudul Put a Snap Shots Badge on your site. Copy kode yang di berikan dan paste pada notepad. langkah terakhir tinggal memasukannya kedalam kode template sobat.



Selamat mencoba !






Minggu, 29 Juli 2007

Daftar Feedburner.com

Setelah kemarin yang di bicarakan adalah masalah duit, akhirnya kembali lagi deh seperti biasanya yaitu membicarakan soal blog tutorial. Artikel ini saya buat untuk memenuhi permintaan sahabat Setyo beberapa waktu yang lalu pada shoutbox, beliau meminta agar di buatkan tutorial bagaimana caranya memasang banner-banner seperti Add to Google, My Yahoo, dan lain sebagainya. Jawaban singkat dari saya adalah untuk mendapatkan semua banner tersebut (beserta fungsinya) anda harus bergabung dengan http://www.feedburner.com, apa itu http://www.feedburner.com? www.feedburner.com adalah satu situs yang memberikan layanan dalam hal syndikasi atau feed. Menurut berita yang saya baca dari halaman news miliknya feedburner, bahwa sekarang feedburner telah di akuisisi oleh google sehingga kita dapat mengalihkan feed blog kita ke feed yang dari feedburner.


Bagi anda yang ingin blognya lebih cepat terkenal saya sarankan untuk bergabung dengan feedburner, layanannya ditanggung gratis. Bagi yang ingin mendaftar tapi belum mengetahui caranya, silahkan ikuti langkah-langkah berikut ini :

  1. Silahkan kunjungi http://www.feedburner.com.

  2. Klik tulisan Register pada halaman bagian atas

  3. Isi seluruh form yang yang ada

    • Username --> isi dengan username yang diinginkan. contoh : japra
    • password --> isi dengan password yang diinginkan. contoh : japratea
    • Password (again) --> isikan kembali password yang tadi di tulis
    • Email address --> isi dengan alamat email yang sobat miliki
    • Secret Question --> isi dengan pertanyaan rahasia yang jawabannya nanti cuma sobat yang tau. Contoh : siapa nama pacar pertamamu ?
    • Secret Answer --> isi dengan jawaban yang sesuai dengan pertanyaan di atas. Contoh : juleha
    • Klik tombol Sigin


  4. Jika berhasil, muncul ucapan selamat datang (welcome) dari feedburner

  5. Isi kotak di bawah tulisan Burn a feed right this instant dengan alamat blog anda. Contoh : http://template-unik.blogspot.com

  6. Beri tanda pada radio buuton yang tersedia, terserah mau pilih yang mana, kemudian klik tombol Next

  7. Ubah Feed Title dengan Feed Address jika mau di ubah, kalo sudah tinggal klik tombol Active Feed

  8. Ada ucapan Conrats, klik saja langsung tombol Next

  9. Beri tanda centang pada kotak di samping tulisan Clickthroughs serta I want more ! have FeedBurner stats PRO also track (karena sekarang layanan yang PRO pun sudah gratis karena sudah di akuisisi oleh google)

  10. Klik tombol Next

  11. Klik tab Optimize

  12. Silahkan setting yang anda inginkan, tapi yang paling penting adalah anda harus mengaftifkan fitur SmartFeed, karena fitur ini berfungsi agar supaya fungsi dari feed kita kompatibel atau klop dengan berbagai feed reader yang ada

  13. silahkan klik SmartFeed lalu klik tombol Active

  14. Klik tab Publicize, silahkan pilih fitur yang anda inginkan, tapi yang sering di gunakan adalah fitur feedCount coba klik FeedCount

  15. Pilih bentuk style dari feedcount, yang biasa atau yang animasi, beri tanda pada radio button di sampingnya

  16. Klik tombol Active

  17. Copy kode HTML yang di berikan pada text area, paste pada notepad untuk nanti di pasang di blog anda

  18. Klik Chicklet Chooser untuk memilih berbagai banner atau chicklet seperti yang di tanyakan sahabat setyo

  19. Beri tanda pada radio button yang terletak di samping chicklet masing-masing, kemudian copy kode HTML yang di berikan yang ada pada text area, kemudian paste pada notepad. catatan : setiap sobat memberi tanda pada radio button masing-masing chicklet, maka secara otomatis kode HTML yang ada di bagian bawahpun akan berubah, jadi kesimpulannya beri tanda radio button lalu copy kode HTML nya beri tanda lagi lalu copy kodenya lagi

  20. Klik Pingshot, beri tanda pada kotak di samping Ping-O-matic serta Newsgator, klik menu dropdown yang ada, lalu pilih yang sobat inginkan, klik tombol Add, klik lagi menu dropdownnya bila ingin di tambahkan lagi, klik Add kembali

  21. Klik tombol Active

  22. Klik Headline Animator untuk mendapatkan banner animasi

  23. Klik menu dropdown di bawah tulisan Theme, pilih yang sesuai keinginan (yang paling banyak di minati adalah type classic)

  24. Klik tombol Active

  25. Klik menu dropdown di samping tulisan Add to, pilih Blogger blog

  26. Klik tombol Next

  27. Setelah muncul window baru, klik tombol Add to Blogger

  28. silahkan Sign in dulu di blogger

  29. Pilih blog yang mau di pasang banner animasi nya, lalu klik tombol Menambah Widget maka secara otomatis banner animasi akan di tambahkan. catatan : cara ini hanya berlaku bagi yang memakai template baru

  30. Silahkan sign out dari situs tersebut

  31. Selesai



Untuk fitur-fitur yang lain lainnya, silahkan anda coba-coba saja sendiri karena jika di terangkan semuanya, saya anggap terlalu banyak. alasan utamanya sih cape ngetiknya bro .

Untuk pemasangan kode-kode HTMl yang tadi di copy pada notepad, saya anggap anda sudah bisa melakukannya, karena sudah sering saya bahas. Yang pake template klasik tinggal paste saja pada kode template nya, bagi yang pake template baru ya tinggal tambah elemen trus pilih yang HTML/Javascript, paste kodenya udah deh.

Satu yang paling terakhir. Seperti yang saya katakan diatas tadi bahwa sekarang feedburner sudah di akuisisi sama google, maka untuk feed blogger bisa di alihkan ke feedburner. Caranya seperti ini :

  1. Sig in di blogger

  2. Klik menu Pengaturan

  3. Klik Feed Situs

  4. Di sebelah tulisan Ijinkan Feed Blog, pilih yang Penuh

  5. Simpan alamat feed dari feedburner pada kotak di samping tulisan posting URL Pengubahan Arah Feed. contoh alamat feed dari feed burner : http://feeds.feedburner.com/TemplateUnik

  6. Apabila anda mempunyai account google adsense, anda bisa menyimpan kode iklan google adsense anda pada kotak di samping tulisan Feed Item Footer

  7. Klik tombol Simpan Pengaturan

  8. Selesai.



Ok deh, semoga dengan bergabungnya anda ke feedburner, blog sobat menjadi cepat terkenal dan ramai di kunjungi.

Rasanya ada yang lupa nih, contoh-contoh banner yang bisa di dapatkan dari feedburner antara lain seperti di bawah ini :


blog tutorial



Add to Google Reader or Homepage



Powered by FeedBurner



Sabtu, 28 Juli 2007

1st Template Unik (XML)


Ada tambahan template nih, judulnya rada norak : 1st Template Unik, tapi saya suka dhenk dengan nama itu. mau lihat screenshootnya, coba klik gambar di bawah ini :








Tertarik? kalau iya, silahkan baca dulu petunjuknya ! template ini sudah saya pasang
sistem Readmore versi baru, sobat hanya tinggal menambakan kode <span id="fullpost"> .... </span>
pada saat posting, tapi jangan lupa postingnya harus pada posisi Edit HTML bukan pada posisi Compose. Agar lebih jelas coba baca lagi di sini !



Mengingat pengalaman yang lalu bahwa ada yang kesulitan menempatkan gambar pada bagian header, maka sebentar saya bahas tentang bagaimana menempatkan kode gambar pada header, kurang lebih caranya seperti ini :




  1. sign in di blogger




  2. Klik Layout




  3. Klik Edit HTML




  4. cari kode berikut :




  5. #header {

    margin: 0 2%;

    color: $headerTextColor;

    padding: 0;

    font: $headerFont;

    height:150px;

    background-color:$headerBgColor;

    }



    tambahkan alamat gambar yang sudah sobat miliki! contoh :



    misal alamat gambarnya seperti ini :



    http://i162.photobucket.com/albums/t253/rohman24/banner_4.gif



    maka penambahan kode seperti ini :



    #header {

    margin: 0 2%;

    color: $headerTextColor;

    padding: 0;

    font: $headerFont;

    height:150px;

    background-color:$headerBgColor;

    background:url('http://i162.photobucket.com/albums/t253/rohman24/banner_4.gif');

    }




    itu nanti gambar akan memenuhi seluruh ruang header, jika gambarnya kecil maka gambar akan di tampilkan ulang alias berderetan, kalau ingin gambar tampil seperti gambar aslinya (yang tampil cuma satu gambar) kodenya ada sedikit tambahan, seperti ini :



    #header {

    margin: 0 2%;

    color: $headerTextColor;

    padding: 0;

    font: $headerFont;

    height:150px;

    background-color:$headerBgColor;

    background:url('http://i162.photobucket.com/albums/t253/rohman24/banner_4.gif') no-repeat top center;


    }


    kode yang diatas akan menampilkan gambar pada posisi tengah bagian header. kode height:150px; adalah untuk menyesuaikan dengan tinggi gambar yang sobat miliki, nilainya silahkan ubah sesuai dengan tinggi gambar yang sobat miliki.




  6. Klik tombol Simpan Perubahan




  7. Selesai.






Langkah ini berlaku juga untuk template Denim yang kemarin lusa saya berikan.



Tidak seperti template Denim yang kemarin, template ini sudah saya masukan banyak variable agar sobat lebih mudah mengatur Font dan warna, bila tidak suka dengan warnanya, silahkan sobat masuk ke halaman Font dan warna ubahlah warna sesuai dengan keinginan sobat.



Agar tidak berlama-lama berimprovisasi, untuk mendownload template ini, silahkan klik di sini !



Selamat mendownload ria !



Jumat, 27 Juli 2007

Daftar Google Sitemap

Senada dengan postingan kemarin lusa yaitu agar blog kita lebih diperhatikan oleh mbah Google, salah satu caranya adalah dengan mendaftarkan blog milik anda ke Google sitemap.

Google, google, dan google lagi yang dibicarakan, ada apa dengan google? Memang tak dapat dipungkiri bahwa sebagaimana kita ketahui si mbah google ini merupakan situs yang mempunyai search engine atau mesin pencari terkenal di dunia untuk saat ini, ribuan atau bahkan jutaan website/blog bersaing memperebutkan perhatian mbah google agar situs miliknya di tempatkan pada urutan teratas pencarian. Dan tentunya apabila website/blog kita di tempatkan pada urutan teratas, niscaya website/blog kita berkesempatan di banjiri oleh pengunjung dari bebagai penjuru dunia, bukankah itu yang selama ini kita harapkan?


Dengan mendaftar ke Google sitemap maka setiap artikel yang kita posting akan secara otomatis di tangkap oleh google. Ada satu hal yang perlu di ketahui yaitu anda harus mempunyai account email di google, akan tetapi anda tidak perlu kawatir karena tak seperti waktu dulu yaitu untuk membuat email di google harus di invite oleh orang lain, sekarang sudah bisa sendiri. Bagi yang belum punya bikin dulu deh, jalan yang mudah adalah coba login di google dengan email yang di berikan untuk Blogger.com, nah nanti akan secara otomatis di suruh upgrade ama ntuh mbah google dan di suruh melengkapi formulir bikin account di google.

Agar intermezonya tidak terlalu panjang, bagi yang mau daftar Google sitemap silahkan ikuti langkah-langkah berikut ini :

  1. Login di google dengan ID GMAIL sobat, silahkan kunjungi Google sitemap

  2. Setelah berada di halaman account sobat, alihkan perhatian ke halaman sebelah atas ! di sana terdapat kotak isian di samping tombol Add Site, isilah kotak tersebut dengan alamat blog anda. Contoh : http://template-unik.blogspot.com

  3. Klik tombol Add Site

  4. Klik link Verify your site

    verify

  5. Klik menu dropdown yang ada, pilih metode yang di inginkan. Biar mudah pilih saja yang Add a meta tag

    add a meta tag

  6. Copy meta tag yang di berikan, lalu paste pada notepad atau text editor yang lainnya agar mudah di gunakan nantinya.

    metatag

  7. Silahkan masuk ke account blogger dan tuju blog yang di daftarkan tadi

  8. Copy paste meta tag yang di berikan tadi, sebaiknya di bawah kode <title><data:blog.pageTitle/></title> untuk template baru atau di bawah kode <title><$BlogPageTitle$></title> untuk template klasik, jangan lupa klik tombol Simpan perubahan.

  9. Bila sudah selesai, tuju kembali Goggle site map, lalu klik tombol Verify

    tombolverify 

  10. Jika semua berjalan dengan baik, akan ada tulisan  “You've successfully verified http://NamaBlogAnda.blogspot.com/

  11. Selesai.

 
 
Bila anda mempunyai beberapa blog, anda tinggal memasukan lagi ke Add Site, ikuti seperti langkah sebelumnya.

Semoga blog anda tampak lebih menarik di mata mbah google.

 

Update : Tutorial ini sudah di tambahkan bantuan gambar agar lebih mudah di fahami.

Tambahan : Sekarang webmaster tool sudah terintegrasi dengan blogger, silahkan login k webmastertool dan anda akan melihat blog dalam akun gmail tersebut, untuk selanjutnya tinggal ikuti seperti langkah di atas.

Rabu, 25 Juli 2007

Ubah Lebar Kolom Template


Lagi-lagi soal template nih. Mungkin ada beberapa dari sobat sekalian ada yang merasa sangat menyukai suatu template, akan tetapi ada ganjalan yakni lebar kolom yang ada tidak sesuai keinginan kita, baik itu lebar kolom sidebar atau pun mainbar (kolom tempat posting). Ada kalanya lebar kolom dari suatu template di rasa terlalu lebar ataupun terlalu sempit, nah jika sobat mengalami hal yang demikian, lumayan nih ada tips buat mengakalinya supaya lebar kolom menjadi sesuai dengan keinginan kita sendiri.



Untuk mengetahui lebar kolom suatu template, kita bisa mengenalinya melalui style sheet CSS nya. Akan tetapi tentu saja ada perbedaan antara satu template dengan template yang lainnya, ini tentunya terserah kepada si designer template nya sendiri. Sebagai contoh untuk bagian header, jika menurut standar template blogger di dalam style sheet CSS nya di namakan header, akan tetapi untuk template-template hasil buatan designer lain di luar blogger ada yang menamakan Banner ataupun nama-nama yang lainnya. Sebuah nama tentu tidak akan berpengaruh terhadap hasil yg di dapat, nama ini di pakai hanyalah agar mudah untuk di ingat atau di kenali oleh sang pemakai template apabila ingin melakukan editting template.



Agar tidak terlalu membingungkan, saya ambil contoh template minima 3 kolom yang bisa di download di sini !.Setelah melihat perkembangannya ternyata template ini banyak yang menyukainya. Jika sobat tidak puas dengan lebar kolom pada template tersebut, silahkan deh ikuti tips berikut biar lebar kolomnya sesuai dengan keinginan sobat. Dimanakah letak kode-kode untuk mengatur lebar kolom ? saya berikan contoh :





#header-wrapper {

width:900px;

margin:0 auto 10px;

border:1px solid $bordercolor;

}



#outer-wrapper {

width: 900px;

margin:0 auto;

padding:10px;

text-align:justify;

font: $bodyfont;

}

#main-wrapper {

width: 435px;

margin-left: 20px;

margin-right: 20px;

float: left;



}


#sidebar-wrapper {

width: 220px;

float: right;

}


#newsidebar-wrapper {

width: 200px;

float: left;

}





Seperti yang terlihat pada kode-kode diatas, yang mempengaruhi lebar kolom adalah
yang saya cetak merah. Width tentu saja dalam bahasa indonesia adalah lebar,
jadi gampangkan untuk mengenalinya. 900px adalah nilai lebar yaitu sebesar 900 pixel.



Agar lebih faham, kode-kode diatas saya uraikan :



#header-wrapper {

width:900px;

margin:0 auto 10px;

border:1px solid $bordercolor;

}



Ini artinya header-wrapper mempunyai lebar sebesar 900px dan mempunyai border (saya artikan border adalah bingkai atau garis tepi) sebesar 1 pixel dengan garis yang solid (solid = garis penuh. dashed = garis putus-putus. dotted = garis berupa titik-titik) dengan warna border yang bisa di ubah-ubah (pada bagian font dan warna).



header-wrapper adalah hanya penamaan saja, tidak mutlak. Jika di ganti dengan nama kepala juga tidak apa-apa. width:900px; berarti lebarnya sebesar 900 pixel. nah nilai 900 pixel inilah yang bisa di ubah sesuai keinginan sobat, mau ditambah nilainya biar lebih lebar, atau di kurangi biar lebih kecil. Akan tetapi saran saya, nilai dari header ini harus sama dengan nilai dari lebar body agar terlihat bagus. border:1px solid $bordercolor; adalah agar bagian header mempunyai garis tepi sebesar 1 pixel, jika ingin lebih tebal sobat tinggal tambahin nilainya, atau jika sobat menginginkan garis tepi ini tidak ada maka sobat hapus saja kode ini.





#outer-wrapper {

width: 900px;

margin:0 auto;

padding:10px;

text-align:justify;

font: $bodyfont;

}


Ini artinya outer-wrapper mempunyai lebar sebesar 900px, jarak sela sebesar
10 pixel dengan align nya adalah rata kiri-kanan dan jenis huruf yang bisa di ubah-ubah melalui panel huruf dan warna.



outer wrapper hanyalah nama saja. width:900px; berarti lebarnya 900 pixel. 900 pixel ini adalah lebar yang di sediakan untuk kolom-kolom yang ada, sebut saja dalam hal ini kolom main-wrapper, sidebar-wrapper, dan newsidebar-wrapper. Jadi dengan kata lain outer wraper adalah hasil penjumlahan lebar kolom main-wrapper, sidebar-wrapper,
dan newsidebar-wrapper. Apabila sobat memasukan content yang melebihi lebar kolom masing-masing, maka secara otomatis pula melebihi spek dari lebar yang di sediakan oleh outer wraper dan yang terjadi adalah salah satu kolom akan melorot ke bawah dan ini membuat blog kita menjadi kurang sedap untuk di pandang mata. Jadi apabila sobat ingin mengubah lebar salah satu kolom di antara yang tiga, maka lebar dari outer wraper pun harus di ubah dan di sesuaikan.




#main-wrapper {

width: 435px;

margin-left: 20px;

margin-right: 20px;

float: left;



}




Ini artinya kolom main-wrapper mempunyai lebar sebesar 435 pixel dengan margin kanan sebesar 20 pixel, margin kiri 20 pixel dan kolom ini di letakan sebelah kiri.



main-wrapper adalah kolom halaman posting, apa-apa yang kita posting maka akan masuk ke halaman ini. width: 435px; berarti lebar kolom ini sebesar 435 pixel, tapi karena menggunakan margin-left dan margin-right, maka lebar kolom sebenarnya adalah sebesar 475 pixel. Akan tetapi yang 40 pixel hanyalah jeda saja agar batas kolom menjadi terlihat tidak bersentuhan. Apabila sobat merasa kolom ini terlalu sempit atau kekecilan, maka sobat bisa menambahkan nilai, contoh 550 pixel. Apabila sobat berniat merubah kolom ini, kolom outer-wraper pun harus di tambah nilainya. contoh tadi apabila main-wrapper ingin menjadi 550 pixel, maka 550px-475px=75px. ini berarti kolom outer-wraper harus di tambah sebesar 75px, jadi 900px+75px=975px.




#sidebar-wrapper {

width: 220px;

float: right;

}




Ini artinya kolom sidebar-wrapper mempunyai lebar sebesar 220 pixel dan di tempatkan sebelah kanan layar.



Kolom sidebar-wrapper adalah kolom sidebar atau kolom tempat di mana kita menyimpan berbagai aksesoris atau yg lainnya. width: 220px; berarti mempunyai lebar sebesar 220 pixel, apabila ingin di persempit atau di perlebar, maka kita hanya
perlu mengubah nilai pixelnya saja. Cuma apabila merubah nilai kolom ini, jangan lupa untuk mengubah nilai space yang di sediakan oleh outer-wraper. contoh : apbila kolom ini ingin diperbesar menjadi 250pixel maka tambahan pixel adalah sebesar 30 pixel, nah jangan lupa untuk menambahkan pula pada kolom outer-wraper.



#newsidebar-wrapper {

width: 200px;

float: left;

}





Ini artinya kolom newsidebar-wrapper mempunyai lebar kolom sebesar 200 pixel dan di tempatkan pada layar sebelah kiri.



Seperti halnya sidebar-wrapper, kolom newsidebar-wrapper pun adalah tempat menyimpan berbagai aksesori ataupun blog tool. kolom ini di buat agar kita bisa lebih banyak memuat berbagai aksesori yang kita inginkan. Kolom newsidebar-wrapper ini lebarnya sebesar 200px, nah bila berniat merubahnya maka tinggal merubah nilai pixelnya saja, tapi jangan lupa untuk menambahkan pula pada kolom
outer-wraper.




Coba bandingkan antara dua blog ini, silahkan klik di sini ! dengan yang di sini !



Selamat berbingung ria !



Senin, 23 Juli 2007

Pasang Jadwal Sholat


Dari kemarin yang di omongin kayanya soal ngotak-ngatik template melulu, biar tidak jenuh kali ini saya akan membahas tentang aksesori blog. Bagi sobat yang notabene muslim, ada nih aksesori blog plus buat mengingatkan kepada kita akan waktu sholat biar para pengunjung blog kita tidak terlalu terlena ketika memmbaca berbagai artikel yang kita tulis di blog. Jadwal waktu sholat ini bisa sobat dapatkan di
http://www.islamicfinder.org, untuk cara mendapatkannya silahkan ikuti langkah-langkah berikut ini :





  1. Silahkan sobat kunjungi situs http://www.islamicfinder.org atau hanya klik di sini !





  2. Klik link yang bertuliskan Add new sevices to your site di halaman bagian bawah




  3. Alihkan perhatian ke nomor pilihan ke 2. Klik menu Dropdown yang bertuliskan Select a Country




  4. Klik nama negara yang sobat inginkan, lalu klik Go. Contoh : Indonesia




  5. Klik nama kota yang sobat inginkan. Contoh : Jakarta




  6. KLik tombol Generated Code




  7. Copy kode yang di berikan, lalu paste pada notepad untuk nanti keperluan di simpan ke blok kita




  8. Silahkan tutup window situs tersebut




  9. Selesai.






Itu tadi cara mendapatkan kode jadwal sholatnya, untuk memasukan kode tersebut ke dalam blog, silahkan ikuti langkah berikut :




Untuk Template Klasik




  1. Sign in di blogger




  2. Klik menu Template




  3. Klik menu Edit HTML




  4. Copy seluruh kode template, paste pada notepad lalu simpan untuk backup data




  5. Copy kode jadwal sho;at yang tadi lalu paste pada tempat yang sobat inginkan




  6. Klik tombol Pratinjau untuk melihat perubahan




  7. Bila sudah Ok, klik tombol Simpan Perubahan Template




  8. Selesai.






Untuk Template baru




  1. Sign in di blogger




  2. Klik menu Layout




  3. Klik menu Elemen Halaman




  4. Klik tulisan Tambahkan sebuah Elemen Halaman




  5. Klik tombol TAMBAHKAN KE BLOG di bawah tulisan HTML/JavaScript




  6. Paste kode Jadwal sholat tadi ke kolom yang di sediakan




  7. Klik tombol Simpan Perubahan




  8. Pindahkan elemen yang baru di buat pada tempat yang sobat sukai




  9. Klik tombol Simpan




  10. Selesai






Contoh jadwal sholat yang saya terangkan diatas seperti ini :




Yang arah vertical :









Yang arah horizontal












Selamat mempunyai jadwal sholat dan jangan lupa sholat ye jangan ngeblog melulu !