Cara membuat efek stabilo pada posting

Assalamu'alaikum warahmaatullahi wabarakaatuh,. Alhamdulillah kita dipertemukan kembali di kursus blog pada hari ini... kaifahaluk akhi? Alhamdulillah, Luar Biasa, Allahu Akbar, Yes!!!. hi hi, emangnya kaya Iqro'nya akhwat ROHIS yang tiap Jum'at kumpul di Mushola. Eit kok malah ngomongin ROHIS ya. Ya udah sekalian promosi blognya ROhis, kunjungi www.rohis-smansapa.co.cc dan yang ini blognya Buletin Rohis KARISMA. Jangan lupa berkunjung ya!


OK, pada pertemuan kali ini ana ingin memberikan tutorial yang sangat sederhana,bagaimana membuat efek stabilo pada tulisan yang kita posting.


Contoh nya seperti ini :

Efek stabilo :

Ini adalah contoh tulisan di stabilo

Blogger tidak menyediakan short key ( cara cepat ) untuk melakukan hal diatas, jadi kita harus melakukan nya secara manual, tidak seperti efek bold, italic, maupun underline yang bisa kita buat dengan cepat.

Ok...cara membuat efek stabilo pada tulisan sangat mudah:

<span style="background-"> Masukkan tulisan yang ingin anda stabilo di sini </span>

Kode warna bisa anda ganti sesuai dengan keinginan antum, kalo nggak tahu kode warnanya bisa di lihat di sini

Gimana? gampang banget kan? Selamat mencoba...

OK akhirnya pertemuan hari ini selesai, mari kita tutup dengan do'a khifaratul majelis,
"Subhanakallahumma wabihamdika ashhaduallaaillaahaillaanta ashtaghfirukawaatuubuilaik"

Wassalamu'alaikum warahmaatullahi wabarakaatuh

Baca Selengkapnya .....

Pengaturan Profile Blogger

Assalamu'alaikum warahmaatullahi wabarakaatuh,. Bagimana kabarnya akhi?? ukhti?? smoga sehat2 slalu ya,.. Pasa kursus blog kali ini, ane pengin bagi2 ilmu pengaturan Profile Blogger di blog antum.

Salah satu pelajaran yang dibutuhkan oleh para newbie di kursus ini adalah pengaturan profile blogger. Secara umum, profile berisi identitas dari pemilik blog, dimana di dalamnya berisi foto, jenis kelamin (gender), astrologi, ocuupation, location, interests, contact, dan masih banyak lagi. Bagi sebagian orang yang masih awam, mungkin menganggap tidak penting profile ini. Padahal banyak hal yang bisa dibahas dalam mengatur profile Blogger ini misalnya saja: menambahkan foto dari URL web, menampilkan atau menyembunyikan profile, memberikan frame pada foto, mengubah bentuk kursor mouse, dan masih banyak lagi.

Sebenarnya banyak manfaat yang bisa kita ambil dari hal2 di atas, misalnya jika kita tidak ingin profile di-share atau ditampilkan pada halaman blog, tentunya dengan alasan privacy atau hal lainnya. Foto profile yang biasa saja sebenarnya bisa juga dibuat lebih unik, seperti dibuat seolah-olah memiliki frame atau bingkai. Untuk melakukan hal tersebut tentunya kita harus memodifikasi script CSS-nya terlebih dahulu. Insya Allah dalam postingan selanjutnya, ane akan membeberkan bagaimana cara mengatur profile Blogger secara gamblang. Just for Antum!!!

Sekian artikelnya, semoga bermanfaat ya,.. Wassalamu'alaikum warahmatullahi wabarakaatuh

Baca Selengkapnya .....

Auto Hide Navbar Blogger

Assalamualaikum warahmatullaahi wabarakaatuh,.. Setelah kemarin menulis tentang menghilangkan navbar blogger tapi cara itu melanggar TOS Blogger, Oleh karena itu Pak Guru menulis artikel yang bermanfaat ini. Karena, selain tidak melanggar TOS blogger kita juga bisa memperindah blog nahnu.

Auto Hide ini menyembunyikan Navbar Blogger bukan menghilangkan, Navbar akan tersembunyi bila Pointer tidak diarahkan pada Navbar blogger tapi jika Pointer Diarahkan pada bagian atas Blog atau tempat Navbar itu maka Navbar akan muncul.

Setidaknya kaya diatas pengertianya dan kita akan melangkah ke pemasanganya yaitu:

1. Pastiakan udah log in di blogger

2. Ke menu Layout Kemudian Edit HTML

3. Kemudian Cari Code seperti ini ]]></b:skin> (untuk mempermudah pencarian ketik ctrl+F)

4. Lalu Diatas Code ]]></b:skin> tambahkan Code seperti dibawah

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

5. Selesai Deh tinggal SImpan Template dan lihat hasilnya..


Sekian yah semoga bermanfaat bagi antum.. terus berkreasi majukan komunitas blogger SMA Negeri 1 Pati dan Indonesia tentunya.

Wassalamualaikum warahmatullaahi wabarakaatuh,

Baca Selengkapnya .....

Permohonan Maaf & Konfirmasi

Blog ini baru saja mengalami eror. Bagi teman2 yang sudah pernah tukar Link dengan blog ini mohon memberi konfirmasi. Karena banyak Link yang hilang ketika blog ini eror. Silahkan tulis di kotak komentar ini.

Nama
alamau url

Karena ana pelupa, nanti akan ana cek dulu ke blog teman2. Baru kemudian ana pasang lagi.

Mohon maaf atas ketidaknyamanan ini! Semoga teman2 mau memaafkan kesalahan ana.

Syukron atas konfirmasinya

Terima Kasih

Baca Selengkapnya .....

Cara Menghilangkan Navbar Blogger

Assalamualaikum warahmatullahi wabarakaatuh. Alhamdulillah,.. setelah kemarin membahas penampilan Navbar, kali ini Pak Guru Blogger SMAN 1 Pati akan mengajar tentang Bagaimana Caranya Menghilangkan Navbar. Tahu nggak Antum? bahwa Navbar yang posisinya berada di atas blog sebenarnya bisa dihilangkan (disembunyikan), dengan melakukan pengaturan pada kode HTML (CSS). Dengan menggunakan CSS yang tepat, maka Nahnu bisa menyembunyikan Navbar tersebut, tetapi jika Antum menginginkannya kembali, maka tinggal menghapus skripnya saja.

Eittt, ntar dulu... sebelum menghilangkan navbar tersebut ada baiknya Antum berfikir-fikir dahulu dan silahkan baca TOS (Term Of Service) blogger secara seksama, karena resiko yang akan di pikul sangatlah berat yaitu akan di tutupnya account blogger antum atau dengan kata lain sobat akan kehilangan blog kesayanangannya. Lumayan mengerikan bukan? memang beberapa waktu yang lalu tersiar kabar bahwa pernah ada yang menanyakan ke pihak blogger apakah boleh menghilangkan navbar blogger atau tidak? dan katanya sekarang pihak blogger membolehkan untuk menghapus navbar, tapi entahlah apakah berita tersebut benar atau tidak yang jelas Antum harus selalu membaca TOS secara seksama.

Tergantung ijtihad antum, kalo ane sih mau ambil yang aman saja, namun jika antum mau mencobanya silahkan.

Berikut langkah-langkahnya:

1. Pertama-tama, Login dulu ke Blogger dan otomatis antum masuk ke halaman Dasbor

2. Sesudah itu, klik Tata Letak

3. Jika antum sudah masuk ke halaman Tata Letak, Pilih link Edit HTML.

4. Antum akan masuk ke halaman Edit HTML. Di dalam kolom HTML, cari kode berikut:

]]></b:skin>

Lalu ketikkan kode CSS berikut ini di bawahnya:

/* navbar menghilang di kursus blog smansapati */

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

5. Jika sudah, klik SAVE TEMPLATE

6. Klik Lihat Blog,

Jika antum menempatkan scriptnya dengan benar, maka Navbar sudah tidak nampak lagi.

Wassalamualaikum warahmatullahi wabarakaatuh.

Baca Selengkapnya .....

Hadapi Olimpiade Sains, Minta Pamitan dan Do'a

Assalamualaikum warahmatullahi wabarakaatuh.Salam buat sobat blogger semuanya seluruh Indonesia . Kali ini ane tidak mengulas tentang kursus blogging ataupun yang semacamnya. Ane cuma mau titip pesan buat teman-teman Blogger semuanya yang baek hati.

Dalam satu minggu kedepan sepertinya saya tidak lagi menulis di Blog lagi. Hmmmmm,... rasanya sedih juga selama seminggu nggak ngurus blog, nggak bisa bantu teman-teman yang lagi belajar blog, nggak bisa bagi-bagi informasi, dan yang paling sedih adalah menahan jemari-jemariku yang sangat gatal ingin pijat-pijat keyboard menulis inspirasi yang meledak ibarat supernova ini. Namun rasanya inilah hal yang terbaik yang bisa ane lakukan.

Insya Alloh besok mulai tanggal 8 Juni sampai selesai akan diadakan perlombaan Olimpiade Sains Tingkat Provinsi se-Indonesia. Perlombaan paling bergengsi tingkat SMA itu diadakan oleh DIKMENUM. Ada delapan mapel yang akan dilombakan. Matematika, Fisika, Kimia, Biologi, Komputer, Astronomi, Ekonomi, dan Kebumian. Kebetulan ane dipercaya sekolah ane, SMA Negeri 1 Pati Jawa Tengah menjadi salah satu wakilnya di Olimpiade Astronomi.

Oleh karena itu,

Ane mohon do'anya

dari sobat2 Blogger smua!! Semoga ane dan teman2 bisa lolos ke tingkat Nasional. Amin 1000X...

Oleh karena itu mungkin selama seminggu ini ane vakum di dunia Blogger. Ane harus prihatin. Keberhasilan harus diraih dengan usaha keras. Doakan ane ya sob, semoga setelah vakum ane bisa bersilaturahmi lagi dengan sobat Blogger lagi.

Syukran Katsiron, Barakallahu fiikum

Wassalamualaikum warahmatullahi wabarakaatuh.

Baca Selengkapnya .....

DAPATKAN HADIAH 1 MAJALAH ASY-SYARIAH TERBARU ED.51 GRATIS

Alhamdulillah, ada angin segar bagi para blogger untuk mendalami ilmu Din. Sekarang www.al-ilmu.com telah bagi-bagi majalah Asy-syariah secara gratis. OK nggak usah panjang lebar, berikut petikannya.

.........Nah khusus antum ikhwah yang mengelola blog atau web kami sediakan GRATIS 1 MAJALAH ASY-SYARIAH TERBARU ED.51, caranya:
1. Pasang gambar banner berikut ini di web antum berikut link ke halaman informasi ini minimal selama sebulan:




<a href="http://al-ilmu.com/headline.php?id=90" target="_blank"><img src="http://al-ilmu.com/images/syariah-gratis.jpg" /></a>

2. Setelah antum pasang, lalu kirim email ke info@al-ilmu.com berisi keterangan nama/url web blog antum, tanggal mulai dipasangnya banner, dan alamat lengkap pengiriman hadiahnya.
Insya Allah segera kami kirim hadiahnya ke alamat antum setelah kami cek bannernya.

Demikian, semoga bermanfaat! Jazakumullahu khairan.

Baca Selengkapnya .....

Mengubah Tampilan Navbar

Assalamualaikum warahmatullahi wabarakaatuh. Dalam Kursus Blog kali ini ane mau mengulas tentang tampilan Navbar. navbar blogger adalah suatu frame yang berukuran kecil miliknya blogger yang terdapat di bagian atas blog. frame ini berfungsi untuk login ke blogger atau bisa juga sebagai jalan untuk melihat blog lain atau bisa juga untuk menandai blog yang sekiranya melanggar TOS blogger seperti blog yang mengandung unsur SARA ataupun pornografi untuk dilaporkan ke pihak blogger.

Bagi pemula blogger yang baru saja berkecimpung di dunia blog, khususnya Blogger SMA Negeri 1 Pati, biasanya tampilan Layoutnya masih default dari Blogger. Begitu pula dengan Navbarnya.

Navbar atau Navigasi Bar yang posisinya berada di atas secara default memiliki tampilan berwarna biru. Jika Antum ingin mengubahnya dengan tampilan yang berbeda, maka hal tersebut bisa dilakukan dengan sangat mudah, berikut langkah-langkahnya:

1. SIGN IN ke halaman Dashboard Anda.

2. Jika Antum telah masuk ke halaman Dasbor, klik pada link Tata Letak.


3. Antum akan masuk ke halaman Tata Letak, pada bagian Navbar Antum Klik link Edit.


4. Akan tampil jendela Navbar Configuration, pilih jenis Navbar yang hendak Antum ubah.
Gb Navbar Configuration

5. Jika sudah, klik SAVE CHANGES.

6. Akses alamat blogspot milik Antum, maka bisa dilihat tampilan Navbar yang sudah berubah warnanya.

Alhamdulillah, akhirnya selesai juga Kursus Blog kali ini,.. Saatnya istirahat, enjoy menikmati secangkir kopi panas, he he

Allahu musta'an, wallahu ta'ala a'lam bishowab. Wassalamualaikum warahmatullahi wabarakaatuh

Baca Selengkapnya .....

Kode-kode Warna HTML

Assalamu'alaikum warahmaatullahi wabarakaatuh,. Seperti yang Pak Guru janjikan di pertemuan yang lalu, kali ini blogger smansapati akan belajar tentang kode-kode warna HTML yang sangat lengkap. Hal ini bertujuan untuk menyesuaikan warna background, text, links, table dll sesuai selera masing2. Cara penggunaannya cukup mudah, antum tinggal klik warna yang antum pilih, maka kode warnanya akan tampil di kotak "kode warna:" Ok silahkan dicoba.

Semoga bermanfaat dan barokah,.. Wassalamu'alaikum warahmatullahi wabarakaatuh

Baca Selengkapnya .....

Menampilkan / Pasang Emoticon di Kotak Komentar

Assalamualaikum wr wb,.. Tahukah Antum???? Semenjak Blogger membuat sistem kotak komentarnya "Embedded Comments form" Atau kotak komentar langsung dibawah komentar, populasi para komentator semakin meningkat, tidak seperti dulu jika ingin menulis komentar harus mengklik link post comments yang akan membuka jendela baru atau jendela pop-up. Dulu jika ingin membuat kotak komentar dibawah postingan harus pakai jasa pihak ke-3 misalnya haloscan, tetapi sekarang yang menggunakan jasa haloscan berbondong-bondong memindah kotak komentarnya menjadi default blogger lagi karena blogger sudah membuka sistem "embedded comments form".

Nah, karena yang komentar lebih banyak. Rasanya blog akan lebih hidup dengan adanya emoticon di kotak komentar. Para komentator menjadi lebih bisa mengekspresikan perasaannya melalui emoticon. Mungkin kalau di Wordpress fasilitas ini sudah tersedia, tapi kalau di Blogger belum. Maka dari itu, antum mesti pintar2 mengakalinya, he he... Gimana sob? are you ready???

Untuk emoticon yang ana sediakan dari mas Kendhin ada dua jenis, yaitu emoticon yahoo (seperti punyaku) dan emoticon kucing (seperti blognya SC'eight). Terserah, silahkan pilih yang antum suka:

Emoticon Yahoo :




Emoticon Kucing :



Gini nih cara membuatnya :

1. Pertama login ke blogger, trus ke "Layout (Tataletak) --> Edit HTML "
2. Beri tanda centang pada kotak "expand widget template"
3. Lalu letakkan script berikut sebelum kode </body>

<script src='http://kendhin.890m.com/emoticon/smile1.js' type='text/javascript'/>

Untuk Emoticon Kucing :

<script src='http://kendhin.890m.com/emoticon/smile2.js' type='text/javascript'/>

4. Kemudian cari kode berikut ini :

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>

5. Kalo sudah ketemu letakkan kode2 berikut setelah kode <p class='comment-footer'>

Ini untuk Yahoo emoticon :

<b><img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif'/>
:))
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif'/>
:)]
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif'/>
;))
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif'/>
;;)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif'/>
:D
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif'/>
;)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif'/>
:p
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/>
:((
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/>
:)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif'/>
:(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif'/>
:X
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif'/>
=((
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif'/>
:-o
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif'/>
:-/
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif'/>
:-*
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif'/>
:|
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif'/>
8-}
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif'/>
~x(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif'/>
:-t
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif'/>
b-(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif'/>
:-L
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif'/>
x(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif'/>
=))
</b>

Kalo mo yang emoticon kucing pake yang ini :

<b><img border='0' src='http://kendhin.890m.com/emoticon/capek.gif'/>
:f
<img border='0' src='http://kendhin.890m.com/emoticon/bigsmile.gif'/>
:D
<img border='0' src='http://kendhin.890m.com/emoticon/hi.gif'/>
:)
<img border='0' src='http://kendhin.890m.com/emoticon/kagum.gif'/>
;;)
<img border='0' src='http://kendhin.890m.com/emoticon/love.gif'/>
:x
<img border='0' src='http://kendhin.890m.com/emoticon/malu.gif'/>
:$
<img border='0' src='http://kendhin.890m.com/emoticon/marah.gif'/>
x(
<img border='0' src='http://kendhin.890m.com/emoticon/bingung.gif'/>
:?
</b>
<br/>
<b>
<img border='0' src='http://kendhin.890m.com/emoticon/mumet.gif'/>
:@
<img border='0' src='http://kendhin.890m.com/emoticon/muntah.gif'/>
:~
<img border='0' src='http://kendhin.890m.com/emoticon/mentok.gif'/>
:|
<img border='0' src='http://kendhin.890m.com/emoticon/ngakak.gif'/>
:))
<img border='0' src='http://kendhin.890m.com/emoticon/sedih.gif'/>
:(
<img border='0' src='http://kendhin.890m.com/emoticon/senang.gif'/>
:s
<img border='0' src='http://kendhin.890m.com/emoticon/tolong.gif'/>
:((
<img border='0' src='http://kendhin.890m.com/emoticon/wow.gif'/>
:o </b>

6. Kalo sudah trus di "save" dan coba lihat hasilnya

Oya hampir lupa, sebagai catatan kadang2 ada beberapa template memiliki kode yang berbeda. Jadi apabila salah seorang antum ada yang sudah melaksanakan instruksi diatas dengan benar tapi masih gagal, berarti memang template yang antum gunakan berbeda. Atau bisa jadi kodenya sama tapi memang hosting tempat emoticonnya yang error.

Wallohu'alam, wassalamualaikum wr wb,..

Baca Selengkapnya .....