Kegiatan kerohanian SMP Negeri 3 sidoarjo

SMPN 3 sidoarjo selain memberikan bekal pendidikan umum juga melatih kesehatan rohan para siswanya. Untuk itu dari salah satu cabang pengembangan diri SMPN 3 di sisipkan Kerohanin . acara- acara kerohanian dikendalikan oleh guru agama yaitu

1) H. Halim s,Ag
2) Juzakijah S,Ag

dan dibantu oleh bapak-bapak relawan yang mengigninkan siswa SMPN 3 menjadi siswa yang sehat rohani yaitu :

Drs. H. M. SAubqi manan Msi
Charis S,pd
Achmad Madiono S, Pd
dan beberapa guru lainnya lagi.

Salah satu dari kegiatan kerohanian adalah kegian sholat dhuhur berjamaah setiap hari abtu untuk siawa pudtri, dan sholat Jummat di sekolah untuk siswa laki-laki.



Namun, sampai saat ini antusias dari para siswa siawi masih sangat kecil . terbukti dari sedikitnya siswa dan siwi yang mengikuti. tetapi walaupun begitu para guru pembimbing belum memberikan sanksi yang menjerakan siswa.

Selain itu juga ada extra kurikurel Qiroah, sayangnya extra tersebut tidak mendapat simpati darim para siswa. masalahnya SMPN 3 sendiri kelihatannya kuarang mendukung extra tersebut. ini terbukti dengan ditumpuknya jadwal extra tersebut dengan 3 extra yang lain yaitu
Desain Grafik (Komputer)
EFC (English Friendship Comunication)
dan Jurnalistik.
hali ini sangt menyulitkan siswa karena keempat extra ini maemeliki bobot yang sama. ditambah lagi larangan dari sekolah untuk mengikuti dua extra kurikuler.

Namun dalam maenghadaoi Un tahun ini pun sampn 3 tidak tinggalm diam dalam masalah agama. diakan istighosah setiap hari jumat dan sabtu ditambah istigoah dua hari seminggu sebelum ujian.

Juga ada kegiatan belajar ceramah yaitu diakan setiap hari jumat pagi dan sholat duha bersama-sama.

ini semua adalah kegiatan kerohanian SMPN 3 sidoarjo

posting image

Image. Kalau berbicara masalah image/gambar, memang sangat seru dan menyenangkan. Dengan adanya image maka blog kita akan tampil lebih menarik untuk di lihat,walaupun tentusaja apabila berlebihan akan berakibat buruk yaitu blog kita akan susah untuk di aksesoleh para pengunjung karena beban kapasitas data yang berlebihan dan bila itu terjadi maka para pengunjung akan menjadi malas untuk berkunjung. Memang segala sesuatu kalau berlebihan akan berakibat tidak baik, jalan keluarnya ya wajar-wajar saja Re....

Ok sobat, biar ga terlalu banyak berimpropisasi, langsung saja pada topik bahasan. topik yang akan kita bicarakan saat ini yaitu memasang image/gambar pada judul artikel. Artikel ini saya buat bagi yang senang akan pernak-pernik gambar,bagi yang tidak senang, ya sebagai pengetahuan saja lah.

Untuk memasang sebuah image pada judul artikel, ada beberapa tahapan yang harus dilakukan, antara lain :


Langkah pertama


Langkah pertama yang harus dilakukan adalah membuat image ataupun logo yang di inginkan. jika sobat mahir dalam program grafik & design semisal adobe photoshop ataupun coreldraw, ya tinggal buat saja yang nyentrik. Tapi kalau tidak bisa atau males bisa gunakan layanan di internet, ini sudah saya bahas pada artikel terdahulu, silahkan klik disini untuk membacanya kembali.


Langkah kedua


langkah kedua yaitu sobat harus upload image atau logo tersebut, bisa ke blogger ataupun ke hosting lain. Misalkan biasanya saya menyimpan setiap image yang saya punya di www.Photobucket.com untuk masalah upload gambarpun sudah saya bahas pada postingan yang lalu, kalau mau baca-baca lagi silahkan klik di sini.


Langkah ketiga


langkah ketiga adalah mengatur ukuran dari image tersebut agar sesuai dengan yang di inginkan, karena jika terlalu besar atau terlalu kecil maka tentu saja akan tidak enak dipandang mata. Misalkan saya mempunyai URL image seperti ini :

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

Sebagaimana kita ketahui untuk membuat sebuah image bisa online maka kita tambahkan kode :



tentu saja bila kita memajang image sesuai ukuran image yang aslinya, ini menjadi kurang enak di lihat jika di padukan dengan tulisan judul posting. Untuk mengakalinya kita bisa menambahkan beberapa atribut kedalam kode image tersebut, antara lain atribut width="..." untuk lebar, height="..." untuk tinggi, dan border="..." untuk bingkai, dan dalam hal ini yang dipakai adalah border dengan nilai 0 (nol) agar terhindar dari setting template yang memakai nilai border.


Langkah keempat


langkah keempat yaitu memasukan kode gambar yang sudah kita modifikasi tadi ke dalam kode template blog milik kita. Silahkan ikuti langkah-langkah berikut ini :

Untuk yang memakai template klasik :

Sign in ke blogger dengan id sobat

Klik menu Template

Klik menu Edit HTML

Copy 'n paste seluruh kode HTML ke dalam notepad, ini dimaksudkan untuk mengurangi resiko apabila terjadi kesalahan pada saat kita melakukan editting kode template

Cari kode berikut pada kode HTML sobat :


<$BlogItemTitle$>

cara yang mudah untuk menemukan kode tersebut adalah : klik menu Edit yang berada bar menu browser lalu klik Find kemudian tuliskan kode diatas tadi lalu klik tombol Find, maka secara otomatis kita akan langsung di bawa ke tulisan kode tadi. Nah kode <$BlogItemTitle$> adalah merupakan kode untuk menampilkan judul postingan, maka kita harus menyimpan kode image yang kita miliki di dekatnya, bisa sebelum atau sesudahnya tergantung dari keinginan kita. Tentunya bila di simpan sebelum kode judul posting maka image pun akan muncul sebelum judul posting, jika di simpan sesudah kode judul posting sudah barang tentu image pun akan muncul sesudah tulisan judul.

pemasangn kode adalah untuk memberi jarak spasi antara image dengan tulisan judul, sebab jika tidak menambahkan kode maka image dengan tulisan akan bersatu walaupun kode image dengan kode judul di tulis ada jarak spasinya.

Klik tombol Preview untuk melihat perubahan yang dilakukan


Jika sudah OK, klik tombol Save Settings


Selesai


Maka setiap anda posting artikel, secara otomatis image yang kita pasang tadi akan muncul tanpa harus di tuliskan kembali.



Untuk yang memakai templat baru :

Catatan awal bagi yang memakai template baru yaitu setiap tag yang kita pakai harus selalu di tutup tidak seperti template klasik,
kode image tersebut tag nya harus ditutup dengan tag penutup :




Sehingga kode image jadi bertambah menjadi :


Untuk memasukan kode gambar yang sudah di tambahi tag penutup tadi, silahkan ikuti langkah berikut :

Sign in ke blogger dengan id sobat

Klik menu Layout

Klik menu Edit HTML

Klik tulisan Download Full Template

Silahkan save dulu template anda, ini untuk back up data apabila terjadi kesalahan editting

Beri tanda centang pada kotak disamping tulisan Expand Widget Templates. Sekali lagi jangan lupa beri tanda centang, sebab kalau tidak, nanti tidak akan sesuai dengan langkah selanjutnya

Tunggu beberapa saat sampai proses selesai



Sisipkan kode gambar yang kita miliki diantara kode :





Klik tombol PREVIEW untuk melihat perubahan

bila sudah OK, klik tombol SAVE TEMPLATE

Selesai

Format Font

Di bawah adalah langkah untuk mengatur Fonts And Colors (khusus untuk blogger baru dengan template baru, sedangkan untuk blogger yang memakai template klasik, menu ini tidak disediakan). Klik menu "Fonts and Colors", maka akan muncul beberapa pengaturan : (ini khusus untuk template "minima")

1. Page Background color --> pengaturan warna background blog. Silahkan klik warna yang ada di sebelah kanan yang di sukai



2. Text Color --> pengaturan warna hurup dari posting-an



3. Link Color --> pengaturan warna hurup yang di link



4. Blog Title Color --> pengaturan warna hurup judul Blog



5. Blog Description Color --> pengaturan warna hurup deskripsi blog



6. Post Title Color --> pengaturan warna hurup judul posting-an



7. Border Color --> pengaturan warna kotak yang mengelilingi judul blog, serta garis pemisah



8. Sidebar Title Color --> pengaturan warna hurup judul yang anda di sidebar (kolom samping)



9. Sidebar Title Color --> pengaturan warna hurup yang ada di sidebar(kolom samping)



10. Visited link Color --> pengaturan warna hurup link ketika pengunjung mengarahkannya ke tulisan yang mengandung link



11. Text Font --> pengaturan jenis hurup,berlaku untuk hurup hasil dari posting-an ataupun hurup yang ada di sidebar



12. Sidebar Title Font --> pengaturan jenis hurup untuk judul yang ada di sidebar serta tanggal postingan



13. Blog Title Font --> pengaturan jenis hurup Judul blog



14. Blog Description Font --> Pengaturan jenis hurup dekripsi blog



15. Post Footer Font --> pengaturan jenis hurup footer (contoh : posted by )



16. Klik “ SAVE CHANGES” untuk mengakhiri pengaturan. Selesai

Untuk template-template selain template "minima", pada dasarnya sama aja, hanya saja ada sedikit perbedaan, tapi itu tidak sulit. Untuk mengetahui tulisan mana yang sedang di rubah oleh anda, anda cukup melihat mana yang berubah tulisannya pada preview yang terletak sebelah bawah.

Mengganti Template

Mengganti Warna Background


Untuk template minima klasik :

Sign in

Klik menu Template

Klik menu Edit HTML

Copy seluruh kede Template, paste pada notepad lalu save untuk backup data



Klik tombol Pratinjau untuk melihat perubahan

Jika sudah OK, klik tombol Simpan Perubahan Template

Selesai.


Jika sobat kebingungan tentang kode warna, sobat bisa menggunakan bantuan program photoshop, kapan-kapan akan saya posting khusus tentang bagaimana cara mengetahui kode warna.


Untuk template minima baru :

sign in

Klik menu Layout

Klik menu Fon dan Warna

Pada gambar teks area sebelah kiri, pilih yang Warna latar Belakang Halaman (biasanya yg pertama sih langsung ini, jadi tidak usah di pilih lagi)

Klik warna yang sobat sukai pada gambar warna-warna yang di tampilkan, lalu lihat perubahannya pada gambar di sebelah bawah

Jika merasa sudah cocok, klik tombol SIMPAN PERUBAHAN

Selesai.



Mudah bukan?


Mengganti Background Dengan Image


Hal yang pertama tentu saja sobat harus mempunyai file image. Image ini bisa berbentuk imaage biasa, photo, bahkan animasi pun bisa. hal yang kedua adalah menguploadnya ke situs untuk menyimpan gambar, saya anggap sobat sudah bisa melakukannya karena sudah saya bahas pada postingan terdahulu, atau masih bingung? kalau iya, coba baca kembali di sini !

Untuk ukuran gambar, sobat tidak usah membuatnya dalam bentuk yang sangat besar, karena walaupun ukuran asli dari image (gambar) adalah kecil, nanti akan di tampilkan dalam jumlah yang sangat banyak hingga memenuhi layar monitor, contoh saya sudah menguload sebuah gambar dengan ukuran yang kecil saja, gambarnya seperti ini (ukuran gambar dalam ukuran aslinya) :

alamat gambarnya adalah

http://amen24.googlepages.com/pattern_096.gif

Untuk cara instalasinya, silahkan ikuti langkah-langkah berikut !

Untuk template minima klasik :

Sign in

Klik menu Template

Klik menu Edit HTML

Copy seluruh kede Template, paste pada notepad lalu save untuk backup data

Tambahkan kode berikut pada style sheet css sobat (yang warna merah adalah kode yang harus di tambahkan) :



body {
background:#fff url('http://amen24.googlepages.com/pattern_096.gif');
margin:0;
padding:40px 20px;
font:x-small Georgia,Serif;
text-align:center;
color:#333;
font-size/* */:/**/small;
font-size: /**/small;
}

Klik tombol Pratinjau untuk melihat perubahan

Jika sudah OK, klik tombol Simpan Perubahan Template

Selesai.


Kode warna background sengaja tidak saya hilangkan, ini di maksudkan agar apabila background image yang kita pakai gagal di loading oleh komputer pengunjung blog, maka yang bekerja duluan warna background.


Untuk template minima baru :

Sign in


Klik menu Layout


Klik menu Edit HTML


Klik tulisan Download Template Lengkap, silahkan save dulu template sobat untuk backup data


Klik kotak kecil di samping tulisan Expand Template Widget


Tunggu beberapa saat sampai proses selesai


Tambahkan kode berikut pada style sheet css sobat (yang warna merah adalah kode yang harus di tambahkan) :



body {
background:$bgcolor url('http://amen24.googlepages.com/pattern_096.gif');
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}


Klik tombol Pratinjau untuk melihat perubahan


Bila sudah OK, klik tombol SIMPAN TEMPLATE


Selesai.



Saya rasa ini sangat mudah dilakukan, karena tidak banyak kode yang harus di tambahkan, Untuk melihat contoh blog yang sudah saya pasang background dengan gambar yang saya contohkan di atas, silahkan sobat klik di sini !

Eh lupa, bagi sobat yang malas membuat gambar, sobat bisa mendownload berbagai gambar pattren di sini.


Selamat mencoba !