Civitas Virtual SMP Negeri 2 Batangan Media Edukasi Informasi Komunikasi Akademika-----> (Smart, Kreatif, Inovatif, Unggul, Tangguh, Religius)

Manfaaf Jalan Kaki

Nah, tahukah Anda bahwa jalan kaki akan membantu memperkuat tulang, mengontrol berat badan, dan kondisi jantung dan paru-paru.Melakukan jalan kaki secara rutin dan konsisten adalah salah satu faktor terpenting dalam membentuk program aktivitas fisik yang sehat. Penelitian menunjukkan bahwa orang yang berjalan kira-kira 20-25 mil per minggu lebih panjang umur beberapa tahun dibanding mereka yang tidak.

Sholat Dhuhur Berjamaa

Pembiasaan Sholat dhuhur dilaksanakan dengan tujuan agar peserta didik terbiasa taat pada ajaran agama yang dianutnya. Dan pada akhirnya akan terbentuk generasi yang selain cerdas juga berakhlak karimah.Sholat dhuhur berjamaah di SMP Negeri 2 Batangan dilaksanakan setiap hari Senin sampai hari Kamis, sesuai dengan jadwal yang sudah ada.

Karya Wisata 2014

Pada tanggal 22 Oktober 2013 s.d. 23 Oktober 2013, Peserta didik SMP Negeri 2 Batangan telah melaksanakan karya wisata. Kegiatan yang dilaksanakan ini diikuti oleh seluruh peserta didik kelas VIII. Lokasi wisata yang dikunjungi diantaranya adalah : Koarmatim Surabaya, Batu Night Spectacular (BNS), Agrowisata Apel dan Jawa Timur Park 2. Suasana suka cita menghiasi rona wajah para peserta karya wisata ini.

Seni Bela Diri

Seni bela diri merupakan satu kesenian yang timbul sebagai satu cara seseorang mempertahankan / membela diri. Seni bela diri telah lama ada dan berkembang dari masa ke masa. Pada dasarnya, manusia mempunyai insting untuk selalu melindungi diri dan hidupnya. Dalam tumbuh atau berkembang, manusia tidak dapat lepas dari kegiatan fisiknya, kapan pun dan dimanapun.

Semangat Belajar

Belajar adalah hal yang menyenagkan, tetapi bisa juga menjadi hal yang membosankan. ini dikarenakan semangat belajar kita terkadang redup dan terkadang terang. Jadi semangat belajar ini harus terus kita pupuk agar menjadi jiwa yang rajin dan terus punyai animo untuk berhasil. Perlu kita ingat satu kata bijak yang berbunyi "Orang yang sukses adalah orang yang mampu mempertahankan semangatnya dikala orang lain hilang semangatnya.

Animasi KURSOR

Jumat, 12 Februari 2016

SEKOLAH RAMAH LINGKUNGAN


Global Warming, istilah yang menjadi pembicaraan akhir-akhir ini. Sebuah fenomena alam yang sungguh mengkhawatirkan seluruh penduduk bumi. Dan semua itu disebabkan oleh ulah manusia. Padahal manusia adalah mahluk biotik berakal yang dari kegiatannya mahluk lain bergantung kelangsungan hidup. Manusia kini cenderung lupa jika bumi ini cuma titipan dari anak-cucu. Emisi yang dihasilkan oleh pembakaran yang dilakukan industri besar, penebangan hutan tanpa control, gagalnya reboisasi, dan pemborosan energi adalah contoh pengelolaan alam yang salah.
Indonesia memiliki wilayah hutan tropis terbesar kedua setelah Brasil. Bahkan disebut sebagai paru-paru dunia. Sebagai Negara kepulauan dengan 65 persen penduduknya tinggal di pesisir pantai, pemanasan global tentu mempunyai dampak pada naiknya permukaan laut hingga mengancam kelangsungan hidup. Hanya dengan kenaikan suhu sebesar 4­ derajat Celcius di seluruh dunia, permukaan laut akan menjadi 5 meter lebih tinggi dari sekarang. Seluruh kota akan lenyap digenangi air(M. Bright, 1993). Sedangkan disisi agraris dengan adanya  perubahan iklim akan menurunkan tingkat hasil panen secara langsung karena para petani kesulitan dalam pengelolaan lahan dan tanaman.
Sumber anomali diyakini para ilmuwan akibat dari tingginya emisi gas-gas rumah kaca seperti Karbon dioksida (CO2), Klorofluorokarbon, ozon, metan dan Nitrogen dioksida (NO2) yang terakumulasi dan menutup lapisan atmosfer sehingga matahari yang sampai ke permukaan bumi terkurung di lingkungan atmosfer (Yuni Ikawati, 2007). Dan yang terjadi adalah pemanasan global bersama efek buruk yang mengikuti.
Terjadinya banjir, naiknya permukaan air laut, dan kekeringan yang sekarang ini telah melanda adalah efek dari pemanasan global. Saatnya melaksanakan langkah nyata guna meminimalisir akibat yang ditimbulkan. Lalu bagaimana fungsi dan peran pendidikan dalam hal ini? Sesuatu yang layak dibahas, mengingat pendidikan adalah proses pembentukan perilaku manusia.

Gerakan Sekolah Ramah Lingkungan
Pendidikan berwawasan lingkungan, inilah kuncinya. Selama ini tidak ada yang salah dengan pendidikan selama ini. Kita sudah tahu jika reboisasi itu penting, kita mengerti jika buang sampah di sungai berakibat banjir. Semua sudah diajarkan oleh para guru kita. Pengetahuan manusia tentang apa saja yang dapat menjadi sebab pemanasan global sudah lengkap. Tapi tetap ada saja penebangan hutan, juga industri yang menghasilkan emisi yang berlebih.
            Gerakan sayang lingkungan, di sekolah-sekolah sebagian besar sudah menggalakkan penghijauan. Misalnya, setiap peserta didik yang diberi tugas untuk membawa tanaman ke sekolah. Ini sebuah langkah yang perlu di puji.
            Lingkungan dan pendidikan adalah dua hal yang mengkait. Pendidikan tentang lingkungan saatnya pada hal-hal yang praktis. Bukan hanya sebatas                                              teori. Sebagai contoh kita semua tahu jika buang sampah sembarangan itu adalah hal yang mencemari lingkungan tapi masih saja melakukan.
            Sekolah sebagai lingkungan pendidikan dan pendidikan akan lingkungan sangat berpotensi memberi peran langsung dalam penanaman kecintaan peserta didik akan lestarinya lingkungan hidup.
            Berikut beberapa langkah yang dapat dilakukan di sekolah dalam rangka memberikan pendidikan lingkungan.
  1. Penanaman pohon
Penanaman di sebuah sekolah selayaknya dilakukan, untuk menjaga keseimbangan ekologi di lingkungan sekolah. Disini juga satu cara penanaman kebiasaan pada seluruh elemen sekolah untuk menanam pohon. Dengan kebiasaan ini diharapkan juga dipraktekan di seluruh elemen sekolah bermukim.  
  1. Kegiatan lomba dengan tema lingkungan
Banyak sekolah yang secara rutin mengadakan lomba kebersihan kelas.Ini sebagai motivator bagi peserta didik untuk dapat lebih menjaga kebersihan lingkungan kelasnya. Sehingga mereka tidak terlalu bergantung pada petugas kebersihan sekolah. Karena kebersihan adalah tanggung-jawab bersama. Karena memang kebutuhan bersama dan dinikmati bersama.
  1. Sanksi yang tegas pada pencemar lingkungan
Memberi sanksi yang tegas pada setiap pelaku pencemaran lingkungan, misalnya sanksi akademik bagi peserta didik yang membuang sampah sembarang tempat. Dan sekolah dapat memberi hadiah pada peserta didik yang berani melaporkan pelaku pencemaran pada sekolah. Ini juga wujud pendidikan akan kejujuran.
  1. Pemasangan slogan-slogan bertema lingkungan di sekolah
Slogan bertema lingkungan dapat ditempel di tempat-tempat strategis di sekolah. Hal ini guna menanamkan rasa cinta kebersihan dan lingkungan. Berikut contoh slogan; "hijau itu indah", "rindang sekolahku terpandang jiwaku", "bumi yang sejuk di mulai dari sekolahku", "satu pohon untuk bumiku" dan masih banyak contoh slogan lain yang dapat ditempel sebagai langkah sosialisasi tentang pentingnya kelestarian alam.
  1. Pengadaan literature atau buku-buku sebagai bahan ajar/tugas dengan tema      lingkungan. Tentu ini juga berkait dengan pengadaan buku di perpustakaan sekolah, jangan hanya terpaku pada literarure yang bertema mata pelajaran UNAS. Pendidikan lingkungan adalah penting mengingat kehidupan manusia juga menyangkut kenyamanan bumi dan pelestarian alam secara global.
  2. Setiap elemen sekolah memiliki tanggung jawab menjaga kelestarian dan keasrian lingkungan.
Setiap mahluk hidup di bumi adalah komponen biotik yang mesti menjaga tempat tinggalnya. Keseimbangan ekosistem adalah tanggungjawab manusia sebagai bagian dari lingkungan yang memiliki akal. Karena punya akal manusia menjadi penentu mau dibuat apa bumi ini.
  1. Galakan kegiatan bersifat memupuk kecintaan pada lingkungan.
Kegiatan ekstra kurikulum sekolah juga dapat sebagai sarana penanaman kecintaan akan lingkungan. Kegiatan seperti Pramuka, Palang Merah Remaja, Pecinta Alam. Memang salah satu tujuannya mendidik anggota untuk cinta pada bumi. Juga kegiatan karya wisata. L. Safii dalam bukunya Cintailah Lingkungan Hidupku menyebutkan tujuan khusus karya wisata salah satunya menimbulkan sikap menghargai dan mencintai lingkungan hidup.
  1. Pembuatan Kebun sekolah.
Program ini layak dikembangkan kembali, melihat manfaat yang begitu besar. Manfaat yang muncul diantarannya; untuk kesejukan dan kesegaran lingkungan sekolah, untuk sarana praktikum biologi, merangsang kreatifitas guru dan peserta didik untuk desain  kebun sesuai dengan kemauan, melatih peserta didik untuk menyenangi berkebun, dan menghasilkan hasil kebun. Dengan ini pendidikan lingkungan telah terterapkan.
  1. Pertahankan lapangan rumput.
Banyak sekolah yang dengan alasan kebersihan mengorbankan lapangan rumput dengan pemasangan paving block. Sedikit banyak langkah ini mengurangi daya serap tanah akan air dan penyerapan CO2menjadi berkurang, begitu pula dengan oksigen yang dihasilkan.
Bumi menjadi tanggung-jawab kita, bukan tidak mungkin jika masih maraknya ulah manusia yang merugikan kelangsungan hidup di bumi disebabkan oleh gagalnya pendidikan lingkungan di bumi tercinta ini.
            Dengan adanya ancaman pemanasan global yang memberi efek berbahaya bagi kelangsungan hidup manusia, semestinya menjadi pemacu akan penggalakan pendidikan yang berwawasan lingkungan, hingga terwujud bumi yang sejuk.

Minggu, 04 Januari 2015

Cara Mempercepat Loading Mozilla Firefox

Cara Mempercepat Loading Mozilla Firefox


Mozilla Firefox adalah web browser open-source yang dikembangkan untuk Windows, OS X dan Linux. Pertama kali dirilis pada tahun 2002, saat ini terdapat juga Firefox versi Android yang juga dengan cepat menjadi populer di kalangan pengguna mobile.
Berdasarkan informasi dari Wikipedia, saat ini Firefox memiliki pangsa pasar sebesar 18%-23% dari pengguna Internet di seluruh dunia. Menurut Mozilla sendiri, Firefox memiliki 450 juta pengguna dan meraih sukses khususnya di Indonesia, Jerman, Polandia dan Iran dimana Firefox dapat meraup pasar browser hingga 40%-50% di negara-negara tersebut.
Sebagai salah satu negara pengguna Firefox terbesar, sudah tentu banyak dari kamu yang menggunakan browser Firefox untuk menjelajah Internet. Nah, kali ini JalanTikus akan berbagi tips cara mempercepat loading Mozilla Firefox sehingga tidak lemot atau berat, atau membuat komputer blank/ hang.
Berikut ini adalah cara untuk mempercepat loading Firefox kamu :
  • Jalankan browser Firefox kamu. Buat yang belum punya, download Firefox di JalanTikus.
  • Ketikkan about:config pada address bar, kemudian tekan Enter.Selanjutnya akan muncul jendela dialog, klik tulisan “Saya berjanji akan berhati-hati” atau “I’ll be careful, I promise!”.
  • Cari Key atau kata kunci dibawah ini untuk mengubahnya. Copy kata kunci/ key, kemudian Paste di kotak pencarian yang sudah disediakan, tekan Enter.Daftar Key atau kata kunci yang perlu di ubah agar loading Mozilla firefox jadi cepat:
    • network.http.pipelining ubah false menjadi true
    • network.http.proxy.pipelining ubah false menjadi true
    • network.dns.disableIPv6 ubah false menjadi true
    • network.http.max-connections ubah nilai nya jadi ‘64’
    • network.http.max-connections-per-server ubah nilai nya jadi ‘21’
    • network.http.max-persistent-connections-per-server ubah nilai nya jadi ‘8’
    • network.http.pipelining.maxrequests ubah nilai nya jadi ‘100’
    Klik Kanan Pada Area kosong, dan ikuti langkah di bawah ini :
    • Klik kanan - Pilih new - integer - Ketik "content.max.tokenizing.time" - Masukan dengan nilai "1000000"
    • Klik kanan - Pilih new - integer - Ketik "content.notify.interval" - Masukan dengan nilai "500000"
    • Klik kanan - Pilih new - integer - Ketik "content.notify.backoffcount" - Masukan dengan nilai "5"
    • Klik kanan - Pilih new - integer - Ketik "content.switch.threshold" - Masukan dengan nilai "500000"
    • Klik kanan - Pilih new -integer - Ketik "nglayout.initialpaint.delay" – Masukan dengan nilai "0"
    • Klik kanan - Pilih new - boolean - Ketik "content.interrupt.parsing" - Pilih "true" - Klik Oke
    • Klik kanan - Pilih new - boolean - Ketik "content.notify.ontimer" - Pilih "true" - Klik Oke
  • Restart Firefox
Nah, itulah cara untuk mempercepat loading Firefox menjadi lebih cepat dan kamu bisa menikmati perbedaannya setelah berhasil diterapkan. Punya tips lain untuk meningkatkan kecepatan Firefox? Silakan share di kolom komentar dibawah.

Jumat, 21 November 2014

Cara membuat Blogroll

Cara membuat Blogroll


Sebelumnya kita cari tahu dulu, apa itu Blogroll?? Apa ya...
Blogroll adalah sebutan kode script untuk membuat box yang dilengkapi dengan tulisan teks, sementara box tersebut dapat ditarik-tarik dengan menggunakan scroll jika terdapat kelebihan muatan teks.

Blogroll sering digunakan untuk link halaman pos pada widget, atau link sahabat untuk tukeran link.

Gimana ya cara buatnya:
  1. Masuk ke blogger kamu
  2. Pada dashboard pilih > Tata Letak > Tambah gadget > HTML/Javascript
  3. Nah, masukin kode berikut ini
<div style="border:0px none;overflow:auto;width:160px;height:400px;text-align:left;background:#FFFFFF">

<div style="background:#020D8A;"><font color="#FFFFFF"><b>Alat Listrik</b></font></div>

<div style="background:#E7F5FF;"><a title="Klik untuk masuk halaman" href="http://raihanlistrik.blogspot.com/2013/07/lampu-philips.html"><font color="#000000">- Lampu Philips</font></a></div>

<div style="background:#E7F5FF;"><a title="Klik untuk masuk halaman" href="http://raihanlistrik.blogspot.com/2013/07/lampu-osram.html"><font color="#000000">- Lampu Osram</font></a></div>

<div style="background:#E7F5FF;"><a title="Klik untuk masuk halaman" href="http://raihanlistrik.blogspot.com/"><font color="#000000">- Kabel Listrik</font></a></div>

<div style="background:#E7F5FF;"><a title="Klik untuk masuk halaman" href="http://raihanlistrik.blogspot.com/2013/07/box-mcb.html"><font color="#000000">- Box MCB</font></a></div>

<div style="background:#E7F5FF;"><a title="Klik untuk masuk halaman" href="http://raihanlistrik.blogspot.com/2013/07/inbox-outbox.html"><font color="#000000">- Inbox & Outbox</font></a></div>

<div style="background:#E7F5FF;"><a title="Klik untuk masuk halaman" href="http://raihanlistrik.blogspot.com/2013/07/stop-kontak-1-6-way.html"><font color="#000000">- Stop Kontak 1-6 Way</font></a></div>

<div style="background:#E7F5FF;"><a title="Klik untuk masuk halaman" href="http://raihanlistrik.blogspot.com/2013/07/stop-kontak-saklar.html"><font color="#000000">- Stop Kontak + Saklar</font></a></div>

<div style="background:#020D8A;"><font color="#FFFFFF"><b>Elektronik</b></font></div>

<div style="background:#E7F5FF;"><a title="Klik untuk masuk halaman" href="http://raihanlistrik.blogspot.com/2013/07/microphone-yamaha-ya-7970-memiliki.html"><font color="#000000">- Microphone Yamaha</font></a></div>

<div style="background:#E7F5FF;"><a title="Klik untuk masuk halaman" href="http://raihanlistrik.blogspot.com/2013/07/energizer-recharge-mini.html"><font color="#000000">- Baterai Charge</font></a></div>

<div style="background:#E7F5FF;"><a title="Klik untuk masuk halaman" href="http://raihanlistrik.blogspot.com/2013/07/lampu-emergency.html"><font color="#000000">- Lampu Emergency</font></a></div>

<div style="background:#E7F5FF;"><a title="Klik untuk masuk halaman" href="http://raihanlistrik.blogspot.com/2013/07/seterika.html"><font color="#000000">- Seterika</font></a></div>

</div>
  • Setelah itu klik simpan, dan lihat hasilnya, mantap bukan??
Cara modifikasi kode diatas:
  • width:160px;height:400px = lebar dan tinggi, sesuaikan dengan blog kamu ya
  • Kamu bisa merubah warna latar belakang dan huruf yang digunakan, dengan mengganti kode warna HTML yang berwarna merah
  • Tulisan berwarna biru adalah link untuk halaman kamu, dan juga tulisan yang timbul di blog nantinya
Contoh jadinya seperti ini dengan width:160px;height:200px :



Selamat Mencoba...
Kalo berhasil, komen boleh lah... :)

Membuat Content Slider Image Otomatis

Membuat Content Slider Image Otomatis

Sebelum template pada demo slider ini saya bagikan nantinya, saya akan mengulas satu persatu terlebih dahulu fitur yang ada pada template ini. Dan disini Anda akan mengetahui bagaimana sebuah template akan bekerja bersama dengan beberapa fitur yang ada di dalamnya secara otomatis. Prinsip kerja dari Content Slider ini hampir sama pada artikel saya sebelumnya tentangmembuat slider otomatis pada template Sporty Magazine 2, bedanya hanya pada tampilan thumbnail kecil yang saya letakkan di bawah dan efek mouseover yang ditambahkan pada slider ini.

Banyak sekali tutorial membuat image slider yang sudah beredar di internet, dari beberapa kasus yang saya temui kebanyakan masih memasukkan URL gambar dan keterangan satu persatu, dan itu sangat merepotkan dan membutuhkan ketelitian, meskipun ada beberapa diantaranya yang sudah otomatis, disini saya hanya memberikan alternatif lain untuk memperbanyak koleksi teman-teman semua mengenai prinsip dasar dari kerja sebuah image slider otomatis pada blog platform blogger.  Tampilan image slider seperti gambar dibawah, jika anda perhatikan sebenernya inilah dasar dari pembuatan Yahoo slider sederhana yang saya pasang pada template Johny Simplemag. Anda bisa modifikasi sendiri sesuai selera.

image slider otomatis


Di blog demo ada slider image Carousel otomatis, jika Anda tertarik silahkan baca tutorialnya padaMembuat Slider Carousel Otomatis Berdasarkan Label.

Cara Pembuatan

Langsung saja pada langkah-langkah pembuatan Content Slider Image otomatis ini :
  1. Langkah pertama, Anda mesti login ke blogger dengan akun Anda
  2. Pilih blog yang ingin anda tambahkan slider image ini.
  3. Setelah itu masuk ke template >> Edit HTML, kemudian centang expand widget templates
  4. Untuk berjaga-jaga agar tidak terjadi kesalahan dalam pengeditan nantinya, backup dulu template anda.
  5. Langkah berikutnya, letakkan kode berikut ini diatas kode ]]></b:skin> :
    #featuredContent{float:left;width:407px;margin-right:10px;display:inline}
    #featured-slider{position:relative;overflow:hidden;width:407px;height:245px}
    #featured-slider .sliderPostInfo{position:absolute;bottom:2px;width:407px;min-height:30px;height:auto!important;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKZDD7bhnb0pHwFQWt93RMb3oaLJSuW0oC_n9OPe7Dcqd7RdBKJa3d_HLCa1f_1mM8lzY1-tsnizSw_rfTxt-Qi4tQpVl_2yd2Y5c04W4qtji2r0PtQlgvQdyLLYJqqt_kZgCRskmqbA7s/s1600/transparant.png)}
    #featured-slider .sliderPostInfo p{color:#fff;font-size:1.1em;padding:0 5px}
    #featured-slider .sliderPostInfo h2{color:#FFF;font:bold 14px Tahoma;text-transform:none;padding:0 5px}
    #featured-slider .contentdiv{visibility:hidden;position:absolute;left:0;top:0;z-index:1}
    #paginate-featured-slider{display:block;background-color:#f0f0f0;margin-bottom:0;padding:0 0 5px}
    #paginate-featured-slider ul{width:415px;padding-bottom:0;list-style:none}
    #paginate-featured-slider ul li{display:inline;width:75px;float:left;margin-left:0;margin-right:8px;margin-bottom:3px}
    #paginate-featured-slider img{padding-top:5px;background:#f0f0f0}
    #paginate-featured-slider a img{border-top:4px solid #f0f0f0}
    #paginate-featured-slider a:hover img,#paginate-featured-slider a.selected img{border-top:4px solid #357798}
    Tulisan warna biru diatas adalah panjang dan lebar slider pada demo, silahkan sesuaikan ukurannya.
  6. Masih pada posisi Edit HTML, masukkan kode berikut ini diatas kode </head> :
    Keterangan :
    Kode script warna merah (paling atas) adalah kode script jQuery.min.js seri terbaru yang saya gunakan untuk membuat slider ini. Jika pada template Anda sudah terdapat jQuery.min.jswalaupun serinya berbeda, kode warna merah diatas tidak perlu lagi Anda masukkan. Cukup satujQuery.min.js yang ada di template, terserah mau seri berapa, kalau bisa versi yang terbaru.
    Warna biru : Jumlah post yang ditampilkan dalam slider
    Warna hijau : Panjang dan lebar image besar
    Warna merah tua : Panjang dan lebar image kecil
  7. Setelah langkah diatas, save templates terlebih dahulu. Setelah itu menuju ke layout >> add gadget masukkan kode ini pada kotak HTML/Javascript :
    Keterangan :
    Perhatikan tulisan warna biru diatas, itu adalah label yang saya masukkan pada slider. Silahkan anda ganti sesuai keinginan. Dan warna merah adalah keterangan slider yang berupa kecepatan, slider efek mouseover dan lain-lain, tidak harus dimasukkan.
    Jika Anda ingin menggantinya dengan recent post atau artikel terbaru ganti kode (ada dua ganti semua) :
    script src=\"/feeds/posts/default/-/sport?max-results
    dengan kode berikut :
    script src=\"/feeds/posts/default?max-results
  8. Jika anda ingin meletakkannya langsung pada template, anda bisa letakkan kode nomer 7 dibawah kode <div id='main-wrapper'>, bagi yang ingin meletakkannya pada kotakHMTL/Javascript bisa dibuat dulu satu kolom kosong diatas blog post. Cara membuatnya, letakkan kode berikut diatas ]]></b:skin>
    /* Slide Content
    ----------------------------------------------- */
    .slide-wrapper {padding:0 auto;margin:0 auto;width:auto;float: left;
    word-wrap: break-word; overflow: hidden;}
    .slide {color: #666666;line-height: 1.3em;}
    .slide ul {list-style:none;margin:0 0 0;padding:0 0 0;}
    .slide li {margin:0;padding-top:0;
    padding-right:0;padding-bottom:.25em;
    padding-left:0px;text-indent:0px;line-height:1.3em;}
    .slide .widget {margin:0px 0px 6px 0px;}
  9. Kemudian untuk memunculkannya pada layout (diatas blog post), anda harus memanggilnya. Cari kode <div id='main-wrapper'> kemudian letakkan kode berikut dibawahnya :
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <div id='slide-wrapper'>
    <b:section class='slide' id='slide' preferred='yes'/>
    </div>
    </b:if>
    slider otomatis
Jika diperhatikan kode script yang ada diatas memang terlalu banyak, dan tentunya akan semakin memperlambat loading sebuah blog. Untuk mengatasinya Anda bisa menyimpan kode-kode yang terlalu panjang tersebut di tempat penyimpanan Google Code. Nah, itu tadi salah satu fitur slider image yang saya ulas kali ini. Saya berharap dengan mengulas satu persatu fitur dalam sebuah template, nantinya teman-teman semua bisa membuat sebuah tampilan template sendiri dengan memodifikasi dari dasar tampilan yang sudah saya berikan diatas.Selamat mencoba dan semoga bermanfaat

Cara Membuat Menu/Tombol DropDown di Blogger

Cara Membuat Menu/Tombol DropDown di Blogger

Cara Membuat Menu/Tombol DropDown di Blogger – Menu dropdown(combo box) merupakan menu yang jika di-klik akan menampilkan submenu dari menu tersebut. Preview dari menu drop down dapat Anda lihat seperti gambar dibawah ini. Cobalah untuk memilih salah satu submenunya, maka Anda akan dibawa pergi ke url yang terdapat dalam submenu tersebut. Menu drop down ini dapat digunakan sebagai alternatif pengganti menu bar blog Anda, karena menu drop down ini kecil dan hanya sedikit memakan tempat.

Cara Mudah Membuat / Memasang Menu Dropdown/Combo Box di Blogger/Blogspot - Preview menu drop down di Blogger
Menu/tombol drop down ini dapat digunakan untuk navigasi dalam blog, seperti navigasi laman, daftar tags/label, tautan menuju situs favorit dan lain sebagainya. Untuk memasang menu drop down ini, perhatikan script menu drop down dibawah ini :

<select onchange='javascript:window.open(this.options[this.selectedIndex].value);'style="width: 100%";>
<option value="#" />
--Judul Drop Down--
<option value="
url1" /> title link 1
<option value="
url2" /> title link 2
<option value="
url3" /> title link 3
</select>
Jika script menu drop down tersebut dipasang di blogger (melalui Tambah Gadget -> HTML/Javascript), script tersebut akan terlihat seperti tombol menu drop downdibawah ini.



Nah, misalkan saya menginginkan title menu dropdown ini adalah Label Blog, kemudiantitle link 1 pada menu dropdown itu menjadi Tips Trik Blogging, dan jika di klik akan menuju ke url : http://xxpc123xx.blogspot.com/search/label/tips%20trik%20blogging, maka tinggal lakukan pengubahan pada --Judul DropDown-- , url1 dan title link 1. Selengkapnya, lihat beberapa pengubahan yang saya lakukan pada script menu drop down dibawah ini :

<select onchange='javascript:window.open(this.options[this.selectedIndex].value);'style="width: 100%";>
<option value="#" />
Label Blog
<option value="
http://xxpc123xx.blogspot.com/search/label/tips%20trik%20blogging" /> Tips + Trik Blogging
<option value="
url2" /> title link 2
<option value="
url3" /> title link 3
</select>

Sehingga previewnya akan seperti ini :


Untuk mengetes menu drop down ini, cobalah untuk mengklik salah satu menu diatas.Untuk Anda yang menginginkan menu dropdown ini memiliki submenu lebih dari 3, Anda dapat menambahkan <option value=’link tujuan’/> Judul Link, sebelum </select>

Cara Memasang Menu DropDown di Blogger :
1.     Buka blog Anda di blogger, lalu klik Tata Letak.

Cara Mudah Membuat / Memasang Menu Dropdown/Combo Box di Blogger/Blogspot - Buka blog Anda, lalu klik tombol Tata Letak yang terdapat pada pojok kiri bawah akun Blogger Anda
2.     Pada Tata Letak, pilih Tambahkan Gadget -> HTML/Javascript.

Cara Mudah Membuat / Memasang Menu Dropdown/Combo Box di Blogger/Blogspot - Pada window Tambahkan Gadget, klik HTML/Javascript, lalu lanjutkan ke step selanjutnya.
3.     Berikan judul pada kotak isian Judul, lalu pastekan kode HTML pada kotak dibawahnya.

Cara Mudah Membuat / Memasang Menu Dropdown/Combo Box di Blogger/Blogspot - Pastekan kode menu drop down diatas (yang telah Anda ubah sesuai dengan keperluan), lalu klik Simpan untuk menyimpannya
4.     Klik Simpan untuk menyimpan menu dropdown.
5.     Buka blog Anda untuk melihat preview menu drop down di blog Anda

Sekarang, visitor blog Anda dapat menggunakan menu drop down tersebut sebagai alternatif navigasi di blog Anda. Selamat mencoba membuat menu drop down di blog!
Salam Blogger!

Cara BackUp/Mengembalikan Template Blogger

Cara BackUp/Mengembalikan Template Blogger


Ketika saya membuat blog dengan menggunakan platform Blogger untuk pertamakalinya, seringkali mengalami kesalahan/error pada saat melakukanperubahan/editing kode html template blog. Dan akan lebih repot untuk mengatasinya jika kita tidak melakukan backup template/menyimpan cadangan template dalam kondisi normal sebelum terjadi error/kesalahan. Nah..untuk mengatasi masalah tersebut, Panduan Bloggers sangat menyarankan Anda untuk selalu melakukannya sebelum mengutak-atik code html template blog, agar apabila suatu saat terjadi maka akan sangat mudah mengembalikannya ke kondisi semula.

Mari kita praktek cara memback-up template dan mengembalikan ke kondisi sebelum kesalahan editing.

1. Login Dashboard > Template > contoh berikut :
Cara BackUp/Perbaikan Template Blogger
Anda akan melihat tombol Backup / Restore di sudut kanan atas halaman Template
Cara BackUp/Perbaikan Template Blogger

2. Klik tombol Backup / Restore :
Cara BackUp/Perbaikan Template Blogger
Akan muncul popup seperti contoh berikut :
Cara BackUp/Perbaikan Template Blogger
3. Klik tombol Download full template : seperti berikut :
Cara BackUp/Perbaikan Template Blogger
4. Akan muncul popup download, lalu Save file ke folder PC Anda :
Cara BackUp/Perbaikan Template Blogger
Simpan baik-baik template backup terakhir hasil download (Sebaiknya pada folder dgn nama Blog yang di backup)

Nah..lalu bagaimana cara mengembalikan template ke posisi semula sebelum terjadi error setelah melakukan editing template?.
Caranya mudah aja, sama seperti mengubah/mengganti template defaul/bawaan Blogger dengan meng-upload custom template file XML buatan pribadi/desainer template lain.
1. Caranya ikuti point 1 dan 2 di atas, kemudian klik tombol Browse untuk mengambil cadangan template backup hasil download tadi dari folder PC. Lihat contoh berikut :
Cara BackUp/Perbaikan Template Blogger
Setelah masuk ke file template xml yang tersimpan, klik tombol Open atau double click pada file. contoh di bawah :
Cara BackUp/Perbaikan Template Blogger
 Maka akan terlihat seperti berikut :
Cara BackUp/Perbaikan Template Blogger
Silahkan klik tombol Upload, tunggu sampai proses upload template backup selesai.

Setelah berhasil upload template, makan akan Anda lihat hasilnya seperti gambar berikut :
Cara BackUp/Perbaikan Template Blogger

Selesai dalam cara mudah backup/restore template blogger. Semoga berguna dan selanjutnya keep nice blogging.

Cara Mudah Membuat Slide Show Foto di Blog

Cara Mudah Membuat Slide Show Foto di Blog

Sebuah halaman blog yang tidak ada sentuhan foto atau gambar akan terasa membosankan. Jika sudah bosan, maka pengunjung blog tidak akan lama bertahan. Bukan hanya sebagai pernak-pernik, sebuah foto juga bisa memberikan kesan tersendiri. Orang akan lebih hafal dengan gambar daripada tulisan.

Sekarang, kita akan belajar untuk membuat slide show, yaitu foto-foto yang ditampilkan secara bergantian dengan otomatis. Slide show bisa digunakan untuk menampilkan banyak foto tanpa menyita banyak space. Karena foto akan diputar layaknya sebuah video, sehingga lebih menarik dan hemat tempat.

Slide show bisa digunakan untuk menampilkan foto liburan yang banyak, atau memajang foto-foto produk untuk toko online. Cara untuk membuat slide show ini sangat mudah, tidak perlu pintar photoshop atau flash. Kita tinggal menyiapkan foto yang sudah diupload (dihosting). Kita bisa memanfaatkan post blogger, Picasa, Photobucket, dan lain-lain.

Cara Mudah Membuat Slide Show Foto di Blog
1. Login ke blogger
2. Pilih Tata Letak kemudian Tambah Gadget
3. Pilih HTML/JavaScript
4. Masukan kode HTML berikut ini:

<script src='http://yourjavascript.com/53816065231/Database5.js' type='text/javascript'></script>
<script type="text/javascript" src="http://yourjavascript.com/65160840132/cycle.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#content-slider').cycle({
fx: 'fade'
});
});
</script>
<style type="text/css">
#content-slider {
   position: relative;
   width: 100%;
   height: 250px;
   overflow: hidden;
   margin:0 auto;
}
#content-slider img {
   display: block;
   width: 100%;
   height: 250px;
}
</style>
<div id="content-slider">
<img src="URL Foto 1" />
<img src="URL Foto 2" />
<img src="URL Foto 3" />
<img src="URL Foto 4" />
</div>

5. Ganti URL Foto 1 dengan URL foto yang sudah dihost (upload)
6. Kita bisa juga menyesuaikan tinggi foto (height) dan lebarnya.
7. Kita bisa menambahkan atau menampilkan foto lebih banyak lagi dengan menambahkan kode sama seperti <img src="URL Foto 4" /> dan seterusnya.
7. Simpan jika sudah selesai.