Gunakan Tag h2 untuk Judul Postingan!

Tag h1 Hanya Untuk Judul Blog.

Di blognya Mas Doyok pernah dibahas tentang cara membuat tag h1 untuk judul postingan. Tetapi, tag h1, apabila diulang dalam jumlah yang banyak, akan menyebabkan blog anda dianggap spamming oleh Google, dan akhirnya, blog anda dibanned. Untuk itu, untuk judul postingan seyogyanya menggunakan tag h2. Tertarik?

1. Login dulu ke Blogger, lalu klik Tata Letak > Edit HTML.

2. Backup template anda.

3. Cari kode yang mirip:

.post h3 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:#cc6600;
}
.post h3 a, .post h3 a:visited, .post h3 strong {
display:block;
text-decoration:none;
color:#cc6600;
font-weight:normal;
}
.post h3 strong, .post h3 a:hover {
color:#333333;
}

4. Ganti dengan:

.post h2.post-title {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:#cc6600;
}
.post h2.post-title a, .post h2.post-title a:visited, .post h2.post-title strong {
display:block;
text-decoration:none;
color:#cc6600;
font-weight:normal;
}
.post h2.post-title strong, .post h2.post-title a:hover {
color:#333333;
}

Ket: ganti semua kode .post h3 menjadi .post h2.post-title.

5. Cari kode:

<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

6. Ganti dengan:

<b:if cond='data:post.title'>
<h2 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h2>
</b:if>

7. Simpan.

Selamat mencoba, dan semoga bermanfaat.

NB: Kadang-kadang tampilan judul postingan akan berubah dengan menjalankan trik ini. Oleh karena itu, sebaiknya backup dulu template anda sebelum menjalankan trik ini.

Hasil Jajak Pendapat

Pada postingan yang INI, saya meminta pendapat anda tentang hal yang disebalkan oleh Blogger. Nah, berikut ini hasil dari polling tersebut.

2 orang tidak menyukai blog yang loadingnya lemot.
1 orang tidak menyukai blog yang tidak ada shoutbox-nya.

Semoga ini bisa dijadikan pembelajaran oleh kita.

Pengumuman: Info Tambahan Seputar Iklan Gratis dan Berbagi Artikel Anda

Pengumuman!!! Pengumuman!!!

Untuk pasang iklan gratis dan berbagi artikel anda, ada ketentuan yang akan diubah.

1. Untuk berbagi artikel anda, akan dinonaktifkan. Karena pada saat ini ada artikel yang sedang dipasang, maka artikel akan dicabut pada tanggal 28 Februari 2010.

2. Untuk pasang iklan gratis, semua iklan akan dicabut (kecuali iklan Forum Blogger) pada tanggal 28 Februari 2010. Tetapi iklan gratis tidak akan dinonaktifkan. Apabila ingin memperpanjang iklan silakan kirim email ke . Artikel akan diperpanjang hingga 30 hari. Perpanjangan bisa dilakukan sesuai keinginan. Dan yang baru ingin mengirim iklan anda silakan saja.

3. Saya berhak mengubah peraturan lagi tanpa pemberitahuan, kecuali pada pihak yang dipasang iklan/artikel nya.

Saya mengucapkan mohon maaf yang sebesar-besarnya dan terima kasih atas perhatiannya.

Konsultasi Matematika Part 11: Angka Romawi

Sudah cukup lama absen dari konsultasi matematika berseri... ya, paling tidak sekitar 2 mingguan. Jadi kangen nih pengen nulis lagi... Aku kangen kamu sayang... masih kangen kamu sayang... (Rasty - Kangen)

Waduh, kok jadi ngelantur gini ya??? Okelah kalo begitu... (Wartegboyz MODE: ON) kita mulai saja... Hehehe... Anda pasti pernah melihat angka romawi dong... Biasanya angka romawi ini ditemui di plang nama jalan. Misalnya: Melati IV, Mawar VI, dll (jika ada kesamaan nama dan tempat, itu hanya hal yang tidak disengaja. Hihihi... kayak film aja...)

Sebenarnya sih tadinya bingung mau nulis apa. Setelah mencari ide kesana kemari, akhirnya saya memutuskan untuk menulis postingan ini. Hihihi...

Angka romawi mempunyai beberapa angka dasar. Yaitu:

• I = 1
• V = 5
• X = 10
• L = 50
• C = 100
• D = 500
• M = 1000

Nah, ada beberapa aturan dalam penulisan angka romawi. Hanya angka I, X, C, dan M yang boleh diulang, dan hanya boleh diulang sampai tiga kali. Angka V, L, dan D tidak boleh diulang. Nah, dalam penulisan angka romawi ada yang disebut penjumlahan dan pengurangan.

Penjumlahan

Semua nilai dari angkanya dijumlah. Contoh:

XVIII = 10 + 5 + 1 + 1 + 1 = 18
CLXI = 100 + 50 + 10 + 1 = 61
MMCL = 1000 + 1000 + 100 + 50 = 2150

Pengurangan

Untuk pengurangan, biasanya digunakan untuk angka 4 atau angka 9. Caranya: Yang lebih kecil didepan, dan lebih besar dibelakang. Nah, lalu angka yang lebih besar dikurangi yang lebih kecil.

Contoh:

IV = 5 - 1 = 4
XCII = 100 - 10 + 1 + 1 = 92 (angka II dibelakangnya tidak berpengaruh, karena yang pengurangan hanyalah C dikurang X)
MCMXCVIII = 1000 + (1000 - 100) + (100 - 10) + 5 + 1 + 1 + 1 = 1998 (perhatikan yang berwarna)

Sekian dulu artikel kali ini. Kurang jelas? Silakan komen dibawah. Terima kasih dan semoga bermanfaat.

Lirik Lagu: Kotak - Pelan-pelan Saja

Ku tahu kamu pasti rasa
Apa yang kurasa
Ku tahu cepat atau lambat
Kamu kan mengerti

Hati bila dipaksakan
Pasti takkan baik
Pantasnya kamu mencintai
Yang juga cintai dirimu

Cinta kamu...

Lepaskanlah ikatanmu
Dengan aku biar kamu senang
Bila berat melupakan aku
Pelan-pelan saja...

Tak ada niat menyakiti
Inilah hatiku
Pantasnya kamu mencintai
Yang juga cintai dirimu

Cinta kamu...

Lepaskanlah ikatanmu
Dengan aku biar kamu senang
Bila berat melupakan aku
Pelan-pelan saja...

Pelan-pelan saja...

Lepaskanlah ikatanmu
Dengan aku biar kamu senang
Bila berat melupakan aku...

Pelan-pelan saja...

---

Copy-paste kode ini di website/blog anda untuk memasang lirik lagu diatas.

Ku tahu kamu pasti rasa<br /> Apa yang kurasa<br /> Ku tahu cepat atau lambat<br /> Kamu kan mengerti<br /> <br /> Hati bila dipaksakan<br /> Pasti takkan baik<br /> Pantasnya kamu mencintai<br /> Yang juga cintai dirimu<br /> <br /> Cinta kamu...<br /> <br /> Lepaskanlah ikatanmu<br /> Dengan aku biar kamu senang<br /> Bila berat melupakan aku<br /> Pelan-pelan saja...<br /> <br /> Tak ada niat menyakiti<br /> Inilah hatiku<br /> Pantasnya kamu mencintai<br /> Yang juga cintai dirimu<br /> <br /> Cinta kamu...<br /> <br /> Lepaskanlah ikatanmu<br /> Dengan aku biar kamu senang<br /> Bila berat melupakan aku<br /> Pelan-pelan saja...<br /> <br /> Pelan-pelan saja...<br /> <br /> Lepaskanlah ikatanmu<br /> Dengan aku biar kamu senang<br /> Bila berat melupakan aku...<br /> <br /> Pelan-pelan saja...<br /> <br /> Sumber: <a href="http://muhammadrizkifadillah.blogspot.com/">http://muhammadrizkifadillah.blogspot.com</a>

Template yang SEO Friendly Kriterianya Seperti Apa?

Di dunia maya banyak pilihan template Blogger tersedia. Ada beberapa pertimbangan dalam memilih template yang baik. Dan salah satunya adalah SEO friendly.

Tapi apa saja sih kriteria-kriteria template yang SEO friendly???

Yang kolom postingnya berada di sebelah kiri?

Anggapan ini tidak 100% benar. Template yang kolom postingnya berada di sebelah kanan (seperti blog ini misalnya) juga SEO friendly. Maksudnya, orang beranggapan yang kolom postingnya berada di sebelah kiri lebih SEO friendly, karena diload lebih dulu daripada yang sebelah kanan. Padahal, bisa juga kolom posting yang disebelah kanan diload dahulu. Untuk lebih mengerti, buka notepad, lalu buat file dengan isi sebagai berikut.

<html>
<head>
<title>Situs Webku</title>
<style type="text/css">
#sidebar{
width:200px;
float:left;
margin:50 10 10 50
}
#main{
width:400px;
float:right;
margin:50 50 10 10
}
</style>
</head>
<body bgcolor="lime">
<div id="sidebar">
<h3>Navigations</h3>
<hr/>
<a href="Index.htm">Index</a><br/>
<a href="Daftar isi.htm">Daftar Isi</a><br/>
<a href="About.htm">About</a><br/>
</div>
<div id="main">
<h2>Situs Webku</h2>
<hr/>
Ini adalah Homepage.
</div>
</body>
</html>

Simpan file tersebut dengan ekstensi .htm atau .html. Nah, lalu buat juga file HTML dengan notepad berisi:

<html>
<head>
<title>Situs Webku</title>
<style type="text/css">
#sidebar{
width:200px;
float:left;
margin:50 10 10 50
}
#main{
width:400px;
float:right;
margin:50 50 10 10
}
</style>
</head>
<body bgcolor="lime">
<div id="main">
<h2>Situs Webku</h2>
<hr/>
Ini adalah Homepage.
</div>
<div id="sidebar">
<h3>Navigations</h3>
<hr/>
<a href="Index.htm">Index</a><br/>
<a href="Daftar isi.htm">Daftar Isi</a><br/>
<a href="About.htm">About</a><br/>
</div>
</body>
</html>

Lalu simpan juga file tersebut dengan ekstensi .htm atau .html. Nah, coba lihat tampilan kedua file tersebut dengan browser. Sama saja kan? Teksnya sama-sama berada di kanan? Bedanya, pada file pertama bagian utama (yang berwarna merah) akan diload belakangan. Sedangkan pada file yang kedua bagian utama akan diload lebih dahulu.

Yang warna teksnya tidak mirip dengan backgroundnya

Kalau yang ini sih, mungkin benar. Karena warna yang teksnya mirip dengan background-nya akan dianggap invisible keywords oleh search engine. dan akhirnya blog anda anjlok posisinya di jajaran search engine.

Nah, anda punya pendapat lain? Silakan komentar dibawah...

Lirik Lagu: Ungu - Cinta Gila

Tahukah kau apa yang kau lakukan itu
Tahukah kau siksa diriku
Bertahun kunantikan jawaban dirimu
Bertahun-tahun ku menunggu

Kau sangka aku akan menyerah
Kau sangka aku akan pasrah
Dirimu tak pedulikan aku
Walau cinta hanya untukmu
Walau kasih hanya untukmu
Walau sayang hanya untukmu

Untukmu... untukmu... untukmu...

Kau... mimpi-mimpiku, cinta gilaku, hanya padamu...
Hanya kau, belahan jiwa, cinta membara, tiada tara...

Tahukah kau apa yang kau lakukan itu
Tahukah kau siksa diriku
Bertahun kunantikan jawaban dirimu
Bertahun-tahun ku menunggu

Kau sangka aku akan menyerah
Kau sangka aku akan pasrah
Dirimu tak pedulikan aku
Walau cinta hanya untukmu
Walau kasih hanya untukmu
Walau sayang hanya untukmu

Untukmu... untukmu... untukmu...

Kau... mimpi-mimpiku, cinta gilaku, hanya padamu...
Hanya kau, belahan jiwa, cinta membara, tiada tara...

Untukmu... untukmu... untukmu...

Kau... mimpi-mimpiku, cinta gilaku, hanya padamu...
Hanya kau, belahan jiwa, cinta membara, tiada tara...

Tahukah kau apa yang kau lakukan itu
Tahukah kau siksa diriku
Bertahun kunantikan jawaban dirimu
Bertahun-tahun ku menunggu

Kau sangka aku akan menyerah
Kau sangka aku akan pasrah
Dirimu tak pedulikan aku
Walau cinta hanya untukmu
Walau kasih hanya untukmu
Walau sayang hanya untukmu

Untukmu... untukmu... untukmu...

---

Copy-paste kode ini di website/blog anda untuk memasang lirik lagu diatas.

Tahukah kau apa yang kau lakukan itu<br /> Tahukah kau siksa diriku<br /> Bertahun kunantikan jawaban dirimu<br /> Bertahun-tahun ku menunggu<br /> <br /> Kau sangka aku akan menyerah<br /> Kau sangka aku akan pasrah<br /> Dirimu tak pedulikan aku<br /> Walau cinta hanya untukmu<br /> Walau kasih hanya untukmu<br /> Walau sayang hanya untukmu<br /> <br /> Untukmu... untukmu... untukmu...<br /> <br /> Kau... mimpi-mimpiku, cinta gilaku, hanya padamu...<br /> Hanya kau, belahan jiwa, cinta membara, tiada tara...<br /> <br /> Tahukah kau apa yang kau lakukan itu<br /> Tahukah kau siksa diriku<br /> Bertahun kunantikan jawaban dirimu<br /> Bertahun-tahun ku menunggu<br /> <br /> Kau sangka aku akan menyerah<br /> Kau sangka aku akan pasrah<br /> Dirimu tak pedulikan aku<br /> Walau cinta hanya untukmu<br /> Walau kasih hanya untukmu<br /> Walau sayang hanya untukmu<br /> <br /> Untukmu... untukmu... untukmu...<br /> <br /> Kau... mimpi-mimpiku, cinta gilaku, hanya padamu...<br /> Hanya kau, belahan jiwa, cinta membara, tiada tara...<br /> <br /> Untukmu... untukmu... untukmu...<br /> <br /> Kau... mimpi-mimpiku, cinta gilaku, hanya padamu...<br /> Hanya kau, belahan jiwa, cinta membara, tiada tara...<br /> <br /> Tahukah kau apa yang kau lakukan itu<br /> Tahukah kau siksa diriku<br /> Bertahun kunantikan jawaban dirimu<br /> Bertahun-tahun ku menunggu<br /> <br /> Kau sangka aku akan menyerah<br /> Kau sangka aku akan pasrah<br /> Dirimu tak pedulikan aku<br /> Walau cinta hanya untukmu<br /> Walau kasih hanya untukmu<br /> Walau sayang hanya untukmu<br /> <br /> Untukmu... untukmu... untukmu...<br /> <br /> Sumber: <a href="http://muhammadrizkifadillah.blogspot.com/">http://muhammadrizkifadillah.blogspot.com</a>

Lirik Lagu: Armada - Mau Dibawa Kemana

Semua telah kuberi
Dengan ketulusan hati
Untukmu, Hanya untukmu

Tak perlu kau tanya lagi
Siapa pemilik hati ini
Kau tahu, pasti dirimu

Tolong lihat aku
Dan jawab pertanyaanku

Mau dibawa kemana hubungan kita
Jika kau terus menunda-nunda
Dan tak pernah nyatakan cinta

Mau dibawa kemana hubungan kita
Ku tak akan terus jalani
Tanpa ada ikatan pasti
Antara kau dan aku...

Na na na na...
na na na na na...

Tak perlu kau tanya lagi
Siapa pemilik hati ini
Kau tahu, pasti dirimu

Tolong lihat aku
Dan jawab pertanyaanku

Mau dibawa kemana hubungan kita
Jika kau terus menunda-nunda
Dan tak pernah nyatakan cinta

Mau dibawa kemana hubungan kita
Ku tak akan terus jalani
Tanpa ada ikatan pasti
Antara kau dan aku...

Tolong lihat aku
Dan jawab pertanyaanku

Mau dibawa kemana hubungan kita
Jika kau terus menunda-nunda
Dan tak pernah nyatakan cinta

Mau dibawa kemana hubungan kita
Ku tak akan terus jalani
Tanpa ada ikatan pasti
Antara kau dan aku...

---

Apabila anda ingin memasang lirik lagu ini di situs/blog anda, copy kode HTML dibawah ini.

Semua telah kuberi<br /> Dengan ketulusan hati<br /> Untukmu, Hanya untukmu<br /> <br /> Tak perlu kau tanya lagi<br /> Siapa pemilik hati ini<br /> Kau tahu, pasti dirimu<br /> <br /> Tolong lihat aku<br /> Dan jawab pertanyaanku<br /> <br /> Mau dibawa kemana hubungan kita<br /> Jika kau terus menunda-nunda<br /> Dan tak pernah nyatakan cinta<br /> <br /> Mau dibawa kemana hubungan kita<br /> Ku tak akan terus jalani<br /> Tanpa ada ikatan pasti<br /> Antara kau dan aku...<br /> <br /> Na na na na...<br /> na na na na na...<br /> <br /> Tak perlu kau tanya lagi<br /> Siapa pemilik hati ini<br /> Kau tahu, pasti dirimu<br /> <br /> Tolong lihat aku<br /> Dan jawab pertanyaanku<br /> <br /> Mau dibawa kemana hubungan kita<br /> Jika kau terus menunda-nunda<br /> Dan tak pernah nyatakan cinta<br /> <br /> Mau dibawa kemana hubungan kita<br /> Ku tak akan terus jalani<br /> Tanpa ada ikatan pasti<br /> Antara kau dan aku...<br /> <br /> Tolong lihat aku<br /> Dan jawab pertanyaanku<br /> <br /> Mau dibawa kemana hubungan kita<br /> Jika kau terus menunda-nunda<br /> Dan tak pernah nyatakan cinta<br /> <br /> Mau dibawa kemana hubungan kita<br /> Ku tak akan terus jalani<br /> Tanpa ada ikatan pasti<br /> Antara kau dan aku...<br /> <br /> Sumber:<br /> <a href="http://muhammadrizkifadillah.blogspot.com">Muhammad Rizki Fadillah's Blog</a>

Membuat Efek Timbul pada Banner

Assalamualaikum. Akhir-akhir ini santer terdengar isu tentang RUU nikah siri. Katanya, kalo nikah siri bakalan dipidana. Tapi saya tidak setuju sama RUU ini. Ok, setuju nggak setuju, itu kan kebebasan berpendapat. Lagipula saya tidak akan berbicara tentang RUU nikah siri ini. Tapi, nggak papa. Cuma nembak keyword aja... Lagipula saya nggak suka siri, saya sukanya cengkeh...

Kali ini kita akan membahas tentang cara membuat efek timbul pada banner. Anda tahu kan efek timbul atau relief, yang biasa ada di candi-candi itu, Kita bisa membuat efek timbul pada Banner. Nah, Kita akan mencoba membuat efek timbul pada banner. Tetapi, pada saat mouse berada diatasnya, image akan tampak seperti tenggelam. Contohnya bisa anda lihat di http://beritaduniamaya.blogspot.com.

Sudah lihat kan? Tertarik? Begini nih, cara membuatnya.

1. Seperti biasa, kita login ke Blogger terlebih dahulu.

2. Tuju Tata Letak > Edit HTML.

3. Backup dulu templatenya. Sudah tau kan cara membackup template?

4. Cari kode:

]]></b:skin>

5. Taruh kode ini diatasnya.

.banner, img.banner{
border: 5px outset;
border-color:#FFFFFF #000000 #000000 #FFFFFF;
}
.banner:hover, a:hover .banner{
border: 5px inset;
border-color: #585858 #A4A4A4 #A4A4A4 #585858;
}

6. Simpan.

Kini anda bisa meletakkan banner tersebut di postingan atau di sidebar. Untuk meletakkannya di sidebar, tuju menu Elemen Halaman, lalu klik Tambah Gadget, lalu pilih HTML/Javascript. Lalu, isikan bagian isi dengan kode berikut.

<a href="LINKYANGDIINGINKAN"><img class="banner" src="URLGAMBAR" /></a>

Ganti LINKYANGDIINGINKAN dengan link yang diinginkan. Sedangkan URLGAMBAR dengan URL dari gambar yang akan dibuat timbul. Lalu simpan.

Anda juga bisa memasukkannya di posting dengan mode Edit HTML. Masukkan kode yang sama dengan yang diatas, lalu klik Terbitkan Entri.

Selamat mencoba...

Cara Membuat Kata Bijak Acak pada Blog

Anda bisa memasang kata bijak pada blog anda, yang nantinya akan memotivasi pengunjung blog anda. Anda bisa mengganti-ganti kata bijak tersebut setiap harinya. Tapi, repot kalau setiap hari ganti kata bijak tersebut. Bagaimana kalau kita buat saja kata bijak random. Jadi, kata bijak itu akan muncul bergantian setiap kali pengunjung mengunjungi halaman blog anda. Penasaran? Ikuti langkah-langkah berikut.

1. Login ke Blogger.

2. Klik menu Tata Letak > Elemen Halaman.

3. Klik Tambah Gadget, lalu klik pada pilihan HTML/Javascript.

4. Pada bagian isi, isikan kode berikut.

<script type="text/javascript">
<!--
var kata_bijak=new Array()
kata_bijak[0]="Uang bisa membeli segalanya, kecuali kebahagiaan";
kata_bijak[1]="Surga berada di telapak kaki ibu";
kata_bijak[2]="Berfikirlah sebelum mengerjakan sesuatu. Menyesal di kemudian hari tiada berguna";
kata_bijak[3]="Berjalan peliharalah kaki. Berkata peliharalah lidah";
kata_bijak[4]="Hati-hati meniti buih selamatlah badan ke seberang";
kata_bijak[5]="Jangan melihat buku dari sampulnya";
var acak=Math.floor(6*Math.random());

document.write("Refresh browser untuk melihat kata-kata bijak ini bergantian.");
document.write("<br/><br/>");
document.write("<i>");
document.write(kata_bijak[acak]);
document.write("</i>");
-->
</script>

Ket: Anda bisa menambah atau mengurangi kata bijak diatas. Sesuaikan angka 6 dengan jumlah kata bijak yang diinginkan.

5. Simpan.

Lihat blog anda. Ada widget kata bijak yang bisa memotivasi pengunjung blog anda.

Contoh dari widget kata bijak bisa dilihat di http://beritaduniamaya.blogspot.com

Cara Membuat Read More

Ini adalah salah satu contoh dalam pembahasan mempelajari bahasa XML template Blogger. Walaupun sekarang Blogger telah menyediakan fasilitas readmore, tetapi tidak ada salahnya apabila anda ingin mencoba atau mempelajari bagaimana cara memasang readmore versi lama ini. Begini caranya.

1. Login dulu ke Blogger, lalu klik menu Tata Letak > Edit HTML.

2. Backup dulu yah templatenya...

3. Centang checkbox Expand Template Widget.

4. Cari kode:

<p><data:post.body/></p>

5. Lalu hapus dan ganti dengan:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/>
<a expr:href='data:post.url'>KLIK DISINI UNTUK BACA SELENGKAPNYA</a></p>
</b:if>

6. Simpan template anda.

7. Beralih ke tab Posting, klik menu Edit Entri, lalu edit setiap entri anda. Editlah dengan format:

(bagian artikel yang akan ditampilkan)
<span class="fullpost">
(bagian artikel yang akan disembunyikan)
</span>

8. Terbitkan entri anda.

9. Lihat homepage blog anda. Akan tampil sebagian artikel, lalu bagian lainnya akan terbuka setelah anda mengeklik link dibawah artikel pada homepage. Mau tahu kenapa?

Penjelasan:

Lihat lagi perintahnya.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/>
<a expr:href='data:post.url'>KLIK DISINI UNTUK BACA SELENGKAPNYA</a></p>
</b:if>

Artinya: Pada halaman postingan, bagian yang termasuk dalam kelas (class) fullpost, akan ditampilkan. Sedangkan pada halaman selain halaman postingan, bagian yang termasuk dalam kelas (class) fullpost akan disembunyikan (tidak ditampilkan). Lalu dibawah postingan akan tampil link yang menuju ke postingan anda. Mengerti?

Terima kasih, dan semoga bermanfaat.

Konsultasi Matematika Part 10: Dalil Phytagoras

Sudah lama absen dari konsultasi matematika berseri (sekitar 2 minggu), akhirnya saya pun rindu ingin menulis artikel konsultasi matematika berseri ini. Pada postingan kali ini, kita akan membahas tentang dalil Phytagoras. Sebelumnya kita pernah membahas tentang dalil Phytagoras DISINI. Namun, kali ini kita akan lebih memperdalam lagi tentang dalil Phytagoras.

Masih ingat bunyi rumusnya? Yup! Tepat sekali. a² + b² = c². Kali ini kita akan membahas beberapa contoh variasi soal yang berhubungan dengan rumus Phytagoras tersebut.

Contoh:

1. Jika alas sebuah segitiga 3 cm dan tingginya 4 cm, berapakah sisi miringnya?

Jawab:

Diketahui (diket):

a = 3
b = 4

Ditanya (dit):

c = ?

Penyelesaian (peny):

a² + b² = c²
3² + 4² = c²
9 + 16 = c²
25 = c²
c = √25
c = 5

Jadi, panjang sisi miringnya adalah 5 cm.

2. Sebuah persegi panjang dengan lebar 9 cm dan panjang 12 cm, maka berapa panjang diagonalnya?

Jawab:

Apabila persegi panjang tersebut dipotong pada diagonalnya, maka akan terbentuk dua buah segitiga siku-siku dengan alas (pada persegi panjang adalah panjang) 12 cm dan dengan tinggi (pada persegi panjang adalah lebar) 9 cm. Maka:

Diket:

a = 12
b = 9

Dit:

c = ?

Peny:

a² + b² = c²
12² + 9² = c²
144 + 81 = c²
225 = c²
c = √225
c = 15

Jadi panjang diagonal dari persegi panjang tersebut adalah 15 cm.

3. Ada sebuah segitiga sama kaki (bisa nggak gambar segitiga sama kaki? Kalo saya bisanya gambar segitiga sama tangan. Hehehe... Just kidding...) dengan tinggi 8 cm dan alasnya 12 cm. Berapakah panjang sisi miringnya (panjang kaki segitiganya)?

Jawab:

Apabila segitiga sama kaki tersebut dipotong pada tingginya, maka akan membentuk dua buah segitiga siku-siku dengan alas 6 cm dan tinggi 8 cm. Sehingga seperti ini.

Kalau sudah bergitu, maka:

Diket:

a = 6
b = 8

Dit:

c = ?

Peny:

a² + b² = c²
6² + 8² = c²
36 + 64 = c²
100 = c²
c = √100
c = 10

Jadi, panjang sisi miring segitiga sama kaki tersebut adalah 10 cm.

Sekian artikel di blog ini. Berkomentarlah untuk kemajuan blog ini. Akhir kata, semoga bermanfaat dan memberikan anda inspirasi.

Cara Membuat Banner untuk Link Exchange

Link exchange sangat diperlukan untuk menjalin persahabatan dan silaturahmi dengan blogger lain, dan juga untuk menambah backlink ke blog anda yang otomatis akan mendongkrak pagerank blog anda.

Salah satu cara ber-link-exchange dengan blogger lain adalah dengan memasang banner untuk link exchange di blog anda. Nah, langkah-langkah membuat banner untuk link exchange seperti ini.

1. Buat gambarnya terlebih dahulu. Bisa pake Photoshop, CorelDraw, atau Paint. Saya sendiri menggunakan Paint karena simpel dan mudah digunakan (bahkan anak SD aja sekarang sudah jago gambar pake Paint).

2. Simpan gambar tersebut dengan format JPG. Klik File > Save As, lalu pilih JPG sebagai formatnya.

3. Lalu, upload gambar tersebut ke image hosting (seperti Photobucket, dll.)

Nah, kode untuk menampilkan banner tersebut adalah:

<a href="ALAMATBLOGANDA"><img src="URLGAMBARBANNERANDA" alt="Keyword 1, keyword 2, keyword 3, dst."/></a>

Ganti ALAMATBLOGANDA dengan alamat blog anda, ganti juga URLGAMBARBANNERANDA dengan URL gambar banner anda. Ganti juga keyword pada bagian alt="..." dengan keyword dari blog anda.

4. Tampilkan kode diatas pada sidebar/postingan. Anda bisa menampilkannya di textarea. Untuk membuat textarea (yang read only), klik DISINI.

5. Selesai...

Nah, itu tadi adalah cara membuat banner untuk link exchange. Silakan komen dibawah untuk kemajuan blog ini. Terima kasih dan semoga bermanfaat.

Cara Membuat Template Blogger

Template yang disediakan Blogger lewat menu Tata Letak > Pilih Template Baru hanya terdiri dari (kalau nggak salah) 38 jenis template. Dengan begini, template anda juga bisa sama dengan template blog lain. Anda bisa sih, memakai template gratisan yang tersebar di dunia ayam maya. Tetapi juga bisa saja template blog anda sama dengan template blog yang lainnya. Nah, solusinya, anda bisa membuat template blog sendiri. Sulitkah? Oh, tentu saja tidak, bahkan sangat menyenangkan apabila anda menikmati pekerjaan membuat template ini. Anda hanya perlu pengetahuan tentang HTML, CSS, dan bahasa XML Blogger.

Pertama-tama, anda bisa membuat gambarnya terlebih dahulu. Buatlah gambar untuk background body, header, kolom posting, dan kolom sidebar. Untuk background body, bikinnya bisa kecil-kecil aja (sekitar 200 x 200). Karena nanti backgroundnya akan diulang-ulang (repeat). Untuk header, anda bisa buat lebar (lebarnya misalnya 660 x 100, karena akan menggunakan kode: repeat-y), atau buat besar (;ebarnya sekitar 660 x 300, karena akan menggunakan kode no-repeat). Untuk kolom main dan sidebar, bikinlah gambar yang lebar (misalnya untuk main 410 x 50. 400 kesamping, 10 kebawah. Dan untuk sidebar misalnya 200x50). Karena gambar untuk kolom main akan diulang-ulang ke bawah (repeat-y). Untuk kolom footer anda bisa menggunakan gambar ataupun warna. Apabila menggunakan gambar, maka buatlah gambar yang lebar juga (karena akan menggunakan kode repeat-y).

Lalu hitunglah lebar antara main dan sidebar. Lebar outer wrapper yang ideal adalah:

main wrapper + sidebar wrapper + 20

Misal:

Misal main wrapper adalah 450 px. dan sidebar wrapper=-nya adalah 250 px. Maka lebar main wrapper yang ideal adalah: 450 + 250 + 20 = 720 px.

Kalau sudah, anda bisa mengupload gambar-gambar tersebut ke image hosting. Lalu, buatlah blog baru dengan template Minima Putih. Lalu lakukan langkah-langkah berikut.

1. Tujulah Tata Letak > Edit HTML.

2. Cari kode:

body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}

3. Ganti kode berikut sehingga menjadi:

body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;

}

Ganti URLGAMBARBACKGROUND dengan URL gambar anda. Kode repeat disampingnya berfungsi untuk mengulang background secara horizontal dan vertikal.

4. Cari kode berikut:

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

5. Ganti sehingga menjadi seperti ini:

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
background:url(URLGAMBARHEADER) repeat-y;
}

Ganti tulisan URLGAMBARHEADER dengan URL gambar header anda. Lalu ganti juga tulisan repeat-y dengan no-repeat apabila anda ingin menggunakan gambar yang besar. Jika anda ingin membuat gambar yang besar, tambahkanlah kode center supaya backgroundnya terletak ditengah-tengah. Jadi seperti ini.

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
background:url(URLGAMBARHEADER) no-repeat center;
}

6. Cari kode:

/* Outer-Wrapper
------------------------------------------ */
#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}
#main-wrapper {
width: 410px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Ubah kodenya menjadi seperti ini.

/* Outer-Wrapper
------------------------------------------ */
#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}
#main-wrapper {
width: 410px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
background:url(URLGAMBARMAINWRAPPER) repeat-y;
}
#sidebar-wrapper {
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
background:url(URLGAMBARSIDEBARWRAPPER) repeat-y;
}

Ganti:

• 660px dengan lebar outer wrapper ideal
• 410px dengan lebar gambar main wrapper
• 220px dengan lebar gambar sidebar wrapper
• URLGAMBARMAINWRAPPER dengan URL gambar main wrapper.
• URLGAMBARSIDEBARWRAPPER dengan URL gambar sidebar wrapper.

7. Cari kode:

#footer {
width:660px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
}

Ubah:

a. Untuk yang menggunakan warna, ubah dengan:

#footer {
width:660px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
background:WARNAYANGDIINGINKAN;
}

Ganti 660px dengan lebar ideal outer wrapper. Ganti juga WARNAYANGDIINGINKAN dengan kode hex dari warna yang diinginkan.

b. Untuk yang menggunakan gambar, ubah menjadi:

#footer {
width:660px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
background:url(URLGAMBARFOOTER) repeat-y;
}

Ganti URLGAMBARFOOTER dengan URL gambar footer yang diinginkan.

9. Lalu simpan.

Sebenarnya sih, tidak harus begitu juga... Anda bisa menggunakan kreatifitas anda. Misalnya membuat kolom menjadi 3 kolom, atau menambah hiasan lainnya. Pokoknya, sesuai kreatifitas anda...

Selamat mencoba, semoga berhasil, dan semoga artikel ini bermanfaat.

Memasukkan Variabel Font dan Warna pada Template HTML Blogger

Pada template baru Blogger, disediakan menu yang praktis untuk mengubah "wajah" dari template blogger anda. Salah satunya adalah menu Font dan Warna. Pengguna yang awam maupun master bisa mengedit warna template dan font huruf pada template lebih mudah pada menu ini tanpa perlu memasuki menu Edit HTML.

Nah, supaya bisa diedit di menu Font dan Warna, anda perlu memasukkan variabel font dan warna. Caranya adalah:

1. Login ke Blogger, lalu seperti biasa, klik menu Tata Letak > Edit HTML.

2. Silakan backup template dulu.

3. Cari tulisan:

/* Variable definitions
====================

4. Lalu dibawahnya, ketikkan:

a. Untuk variabel warna:

<Variable name="contohvariabelwarna" description="Contoh Variabel Warna"
type="color" default="#81F781" value="#81F781">

b. Untuk variabel font:

<Variable name="contohvariabelfont" description="Contoh Variabel Font"
type="font"
default="12px bold 'Trebuchet MS', Verdana" value="12px bold 'Trebuchet MS', Verdana">

Ket: name="..." adalah nama variabel. description="..." adalah deskripsi variabel (tulisan yang akan muncul pada menu Font dan Warna). type="..." adalah jenis variabel. Isi dengan color bila variabel tersebut berupa variabel warna, atau font bila variabel tersebut adalah variabel font. default="..." adalah nilai default variabel, sedangkan value="..." adalah nilai variabel. Isi default dan value dengan nilai yang sama. Contohnya bisa anda lihat seperti diatas.

5. Lalu cari kode CSS yang akan diberi variabel tersebut. Misalnya anda ingin supaya background dan jenis huruf pada kode CSS body diberi variabel tersebut, maka yang harus dicari adalah kode CSS untuk body. Misalnya:

body {
background:#000000;
font:12px Arial;
}

maka gantilah nilai #000000 dengan kode: $(nama variabel). Dalam contoh ini nama variabel adalah contohvariabelwarna, maka gantilah dengan kode: $contohvariabelwarna. Begitu juga dengan font. pada contoh ini gantilah 12px Arial dengan $contohvariabelfont, sehingga menjadi:

body{
background:$contohvariabelwarna;
font:$contohvariabelfont;
}

6. Kalau sudah simpan.

Memang sih, trik ini tidak akan mengubah warna dan jenis font template. Tetapi bisa memudahkan anda mengolah warna dan jenis font template cukup dengan melalui menu Font dan Warna. Trik ini sangat berguna apabila anda ingin membuat free template, dimana pemakai template anda bisa dengan mudah mengutak-atik warna dan font template anda. Semoga bermanfaat.

10 Widget/Aksesori Blog yang Harus Anda Miliki

Widget/aksesoris blog sangat banyak jumlahnya. Tetapi terlalu banyak widget/aksesori justru akan membuat loading blog anda lemot. Maka dari itu, pilihlah widget/aksesori yang penting saja. Berikut ini 10 widget yang harus anda miliki dimulai dari 10.

10. Recent Posts.

Widget ini berguna untuk membuat pengunjung mengetahui post terbaru di blog anda.

Cara memasangnya: Tuju menu Tata Letak > Elemen Halaman > Tambah Gadget, lalu isikan Recent posts di kotak pencarian dan akan muncul hasilnya.

9. Recent Comments.

Widget ini berguna untuk mengetahui komentar yang masuk.

Cara memasangya: sama seperti diatas, tapi keywordnya adalah Recent comments.

8. Breadcrubs Navigasi.

Breadcrumbs navigasi berguna untuk mendongkrak posisi blog anda di search engine dan memudahkan pengguna untuk menjelajahi isi blog.

Cara memasang: Lihat cara membuatnya DISINI.

7. Artikel Terkait.

Fungsinya membuat pengunjung lebih betah berada di blog anda dengan menampilkan posting-posting yang kategorinya sama dengan posting yang pengunjung sedang buka.

Cara memasang: Cari di Google dengan keyword Cara membuat artikel terkait di Blogspot.

6. Hit Counter.

Fungsinya adalah untuk mencatat jumlah pengunjung blog anda.

Cara memasang: Anda dapat mendapatkannya dari penyedia hit counter gratisan. Seperti HiStats atau www.amazingcounter.com

5. Share Pack.

Share pack berguna untuk membagi-agikan artikel anda ke jejaring sosial, seperti Facebook, dll.

Cara memasang: Cari di Google dengan keyword Cara membuat share pack di Blogspot.

4. Tautan Berlangganan.

Fungsinya untuk pengunjung berlangganan artikel blog kita.

Cara memasang: Tuju menu Tata Letak > Elemen Halaman > Tambah Gadget > Tautan Berlangganan, atau gunakan fasilitas dari FeedBurner.

3. Shoutbox.

Fungsinya untuk memberikan pesan singkat/salam tanpa perlu berkomentar di blog anda.

Cara memasang: Manfaatkan fasilitas penyedia shoutbox gratis, seperti Shoutmix, Oggix, atau CBox.

2. Label.

Widget ini sangat berguna untuk pengunjung mencari artikel yang sekategori/selabel.

Cara pasang: Tujulah menu Tata Letak > Elemen Halaman > Tambah Gadget > Label.

Dan, ini dia nomer 1 dari widget yang harus anda miliki yaitu...

1. Arsip Blog

Ini dia widget nomor 1 yang harus anda miliki. Karena arsip blog memuat artikel blog anda dari yang pertama sampai yang terbaru.

Cara memasang: Masuki menu Tata Letak > Elemen Halaman > Tambah Gadget > Arsip.

Itu dia 10 widget dan aksesori blog yang harus anda miliki. Jika ada kritik dan saran, silakan komen di bawah. Akhir kata, semoga artikel ini memberi manfaat untuk anda.

Menambahkan Signature/Tanda Tangan Dibawah Posting

Anda tahu signature/tanda tangan? Signature/tanda tangan biasanya dibuat untuk memastikan bahwa posting itu dibuat oleh si pembuat tanda tangan tersebut. Tanda tangan ini bisa berupa image, teks, link, dll. Tanda tangan ini bisa diletakkan dibawah posting. Dan hanya akan muncul apabila halaman posting dibuka. Mau tahu bagaimana caranya?

1. Login ke Blogger, lalu seperti binasa biasa kita tuju Tata Letak > Elemen Halaman.

2. Backup template anda.

3. Centang kotak Expand Template Widget.

4. Cari kode:

<p><data:post.body/></p>

5. Tepat dibawahnya, ketikkan kode berikut:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p>
<img src='URLGAMBARANDA'/>
</p>
</b:if>

Ganti URLGAMBARANDA dengan URL gambar tandatangan anda. Apabila anda hanya ingin menggunakan teks, gunakan kode berikut.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p>
Isi dengan teks tanda tangan anda.
</p>
</b:if>

6. Lalu Simpan.

7. Lihat Hasilnya.

Akhir kata, semoga bermanfaat.

Mengotak-atik Header/Judul Blog

Header blog anda bisa dituak-atik sesuai keinginan. Bisa ditambahkan dengan gambar, diubah huruf dan warnanya, dan mdifikasi lainnya. Yuk, ikuti langkah-langkah dibawah ini.

Mengubah judul blog dan deskripsi blog, serta memasukkan gambar kedalamnya.

Untuk melakukan langkah ini, login ke Blogger, lalu klik menu Tata Letak > Elemen Halaman. Lalu cari bagian header anda (biasanya berformat: Judul Blog anda (Header)). Lalu klik Edit di pojok kanan bawahnya.

Nah, untuk mengganti judul blog, ubah bagian Judul Blog dengan judul blog anda. Untuk menentukan judul blog, baca: Menentukan Judul Blog. Untuk mengubah deskripsi blog, isilah bagian Deskripsi Blog dengan deskripsi blog anda. Lalu pada bagian Gambar, klik Browse untuk mengambil gambar dari komputer anda. Tapi apabila ingin mengambil gambar dari web, masukkan URL gambar anda ke kotak dibawah tulisan Dari web. Untuk penempatan, pilih Di balik judul dan keterangan jika anda ingin gambar tersebut berada dibalik judul dan keterangan (sebagai background). Namun, pilihlah Selain judul dan keterangan jika anda ingin supaya hanya gambar yang terlihat (judul dan keterangannya tidak terlihat). Beri tanda centang pada checkbox Susutkan agar sesuai. untuk menyesuaikan gambar dengan lebar header.

Kalu sudah, klik Simpan.

Mengubah font dan warna dari judul dan deskripsi blog.

Ada 2 cara untuk ini. Bagi yang masih pemula, anda bisa menuju ke menu Tata Letak > Font dan Warna. Sedangkan bagi yang sudah mahir, anda bisa menuju ke menu Tata Letak > Edit HTML.

Untuk para pemula, tujulah menu Tata Letak > Font dan Warna. Lalu editlah poin-poin berikut.

• Untuk mengedit warna judul blog, kliklah bagian Warna Judul Blog, lalu ganti dengan warna yang diinginkan.
• Untuk mengedit warna deskripsi blog, kliklah bagian Warna Deskripsi Blog, lalu ganti dengan warna yang diinginkan.
• Untuk mengedit font judul blog, kliklah bagian Font Judul Blog, lalu utak-atik sesuai keinginan.
• Untuk mengedit font deskripsi blog, kliklah bagian Font Deskripsi Blog, lalu utak-atik sesuai keinginan.

Lalu klik Simpan Perubahan.

Bagi yang sudah mahir, anda bisa menuju menu Tata Letak > Edit HTML. Pertama-tama backup dulu template. Lalu cari kode-kode berikut:

1. Untuk kode judul blog, cari kode yang mirip dengan kode berikut.

#header h1 {
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
}

2. Sedangkan untuk kode deskripsi blog, cari kode yang mirip dengan kode:

#header .description {
margin:0 5px 5px;
padding:0 20px 15px;
max-width:700px;
text-transform:uppercase;
letter-spacing:.2em;
line-height: 1.4em;
font: $descriptionfont;
color: $descriptioncolor;
}

Lalu, editlah sesuai keinginan anda. Misalnya, ingin menambahkan background untuk judul blog dengan warna #AC58FA, maka tambahkan kode background:#AC58FA; sebelum tanda tutup kurung kurawal (}), sehingga menjadi seperti ini.

#header h1 {
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
background:#AC58FA;
}

Anda juga bisa mengotak-atik sesuai keinginan. Misalnya menambahkan border di sekelilingnya, ataupun variasi lainnya.

Kalau sudah, klik Simpan Template.

Artikelnya lumayan panjang yah? Sudah capek nih tangan. Jangan lupa komen dibawah untuk kemajuan blog ini. Semoga bermanfaat

Cara Mengubah Text Align Secara Otomatis

Biasanya di Blogger, untuk mengubah tata letak dari artikel anda, anda cukup menekan tombol diatas text editor blogger untuk mengubah posisi text atau text align seperti gambar di bawah.

Tapi apabila anda harus mengatur text align setiap kali mengetik artikel, merepotkan juga. Nah, ini dia cara otomatis untuk mengubah text align dari setiap artikel anda.

1. Login ke Blogger, lalu klik Tata Letak > Edit HTML.

2. Silakan backup dulu templatenya.

3. Cari kode yang mirip dengan kode berikut.

.post-body {
color:#444;
}

4. Tambahkan kode berikut sebelum tanda tutup kurung kurawal (})

text-align:TATA LETAK YANG DIINGINKAN;

Bagian TATA LETAK YANG DIINGINKAN adalah posisi yang diinginkan. Ganti dengan left untuk posisi rata kiri, center untuk rata tengah, right untuk rata kanan, atau justify untuk rata kiri-kanan. Misalnya ingin mengubahnya menjadi rata tengah, maka kodenya jadi seperti ini.

.post-body {
color:#444;
text-align:justify;
}

5. Lalu klik Simpan Template.

Coba lihat blog anda. kini anda tidak perlu repot-repot mengubah posisi teks ketika sedang membuat artikel.

Semoga bermanfaat.

Menentukan Kondisi Tertentu pada Postingan Tertentu

INNALILLAHI WA INNA ILAIHI RAJIUN... Turut berduka cita atas meninggalnya seorang blogger bernama Sandhi Pratama atau yang juga dikenal dengan nama Kang Jaiman pemilik blog niat-belajar.blogspot.com. Posting terakhirnya adalah posting berjudul "Software Untuk Memblokir Situs Porno". Semoga amal ibadahnya diterima oleh Allah SWT. Amin...

Sudahlah, kita kembali ke laptop tutorial blogging. Pada postingan lalu kita pernah membahas tentang bahasa XML template Blogger. Kita akan membahas tentang cara menentukan kondisi tertentu pada postingan tertentu. Maksudnya kondisi yang hanya muncul pada postingan tertentu saja.

Sintaksnya seperti ini.

<b:if cond='data:blog.url == &quot;URLPOSTINGAN&quot;'>...</b:if>

Ganti URLPOSTINGAN dengan URL postingan anda.

Misal: saya ingin membuat halaman "Email Me" yang beralamat di http://muhammadrizkifadillah.blogspot.com/2009/11/email-me.html supaya backgroundnya berwarna putih, maka kodenya adalah:

<b:if cond='data:blog.url == &quot;http://muhammadrizkifadillah.blogspot.com/2009/11/email-me.html&quot;'>
<style type="text/css">
body{background:white;}
</style>
</b:if>

Akhir kata, semoga bermanfaat dan memberikan anda inspirasi.

Jajak Pendapat: Apakah Menurut Anda Hal-hal yang Paling Menyebalkan Bagi Blogger

Polling ditutup.

Cara Menghilangkan Tulisan "Langgan: Entri (Atom)"

Anda pasti pernah melihat link Langgan: Entri (Atom) atau Langgan: Poskan Komentar (Atom) dibawah postingan. Link ini berguna untuk pengguna yang ingin berlangganan artikel blog kita. Tapi jika link tersebut cukup menggangu, anda bisa menghilangkan link tersebut dengan langkah-langkah sebagai berikut.

1. Login ke Blogger, lalu klik Tata Letak > Edit HTML.

2. Silakan backup dulu templatenya untuk jaga-jaga jika terjadi kerusakan pada template anda.

3. Cari kode berikut.

]]></b:skin>

4. Diatasnya, ketikkan kode berikut.

.feed-links{
display:none;
}

5. Kalau sudah, simpan.

Lalu lihat hasilnya. Tulisan Langgan: Entri (Atom) sudah lenyap kan?

Mempelajari Bahasa XML Template Blogger

Kini mengedit template tidak susah lagi. Cukup mengklik menu Tata Letak > Elemen Halaman untuk merubah tata letak dari widget atau Tata Letak > Font dan Warna untuk merubah font dan warna dari blog. Tapi untuk mempelajari bahasa XML dari template blogger ya tidak ada salahnya.

Pada artikel kali ini kita akan membahas tentang kode <b:if cond="KONDISI">HASIL</b:if>. Arti dari kode tersebut adalah: jika (if) kondisinya (cond) seperti ini (cond="KONDISI") maka hasilnya akan seperti ini (<b:if cond="KONDISI">HASIL</b:if>).

Kali ini kita akan mempelajari kondisi <b:if cond='data:blog.pageType == "item"'>...</b:if> dan <b:if cond='data:blog.pageType != "item"'>...</b:if>. Kondisi <b:if cond='data:blog.pageType == "item"'>...</b:if> artinya kondisi pada halaman postingan blog. sedangkan <b:if cond='data:blog.pageType != "item"'>...</b:if> yaitu kondisi pada halaman muka/halaman selain halaman post.

Misal:

<b:if cond='data:blog.pageType == "item"'>
<title>Muhammad Rizki Fadillah's Blog</title>
</b:if>

Artinya: pada halaman postingan, maka judul halamannya adalah Muhammad Rizki Fadillah's Blog.

<b:if cond='data:blog.pageType != "item"'>
<style type="text/css">
body{background:black;color:white;}
</style>
</b:if>

Artinya: pada halaman selain postingan, maka warna latar belakang adalah hitam dan warna teks adalah putih.

Lalu ada pula <b:else/> yang artinya selain itu (else). Maksudnya adalah hasil selain pada kondisi yang ditentukan. Sintaksnya seperti <b:if cond='data:blog.pageType == "item"'>HASIL<b:else/>HASIL SELAIN KONDISI YANG DITENTUKAN</b:if> atau <b:if cond='data:blog.pageType != "item"'>HASIL<b:else/>HASIL SELAIN KONDISI YANG DITENTUKAN</b:if>.

Misal:

<b:if cond='data:blog.pageType == "item"'>
<style type="text/css">
body{background:black;}
</style>
<b:else/>
<style type="text/css">
body{background:white;}
</style>
</b:if>

Artinya: Pada halaman postingan, warna latar belakang akan berwarna hitam. Sedangkan pada halaman selain halaman postingan, warna latar belakang akan berwarna putih.

Semoga artikel ini bermanfaat. Silakan komen untuk kemajuan blog ini.