Xceria Blogger Indonesia
Showing posts with label html. Show all posts
Showing posts with label html. Show all posts

11 Conditional Tag pada Blogger
Conditional Tag Blogger
Kali ini Xceria akan membahas artikel mengenai berbagai tag kondisional yang ada di blogger.

Jika Anda melihat template blog Anda, pasti akan banyak ditemukan conditional tag. Conditional tag ini diawali dengan kode <b:if cond='...'> dan diakhiri dengan kode </b:if>.

Blogger conditional tag merupakan kode yang terdapat pada blogger untuk menentukan kondisi dari kode yang ada di dalamnya, seperti widget atau suatu elemen, apakah kode ini ditampilkan atau tidak pada halaman tertentu.

Penggunaan tag ini paling sering kita lihat pada fungsi auto read more. Biasanya isi artikel pada halaman indeks (misalnya halaman depan, label, dan search) tidak dimunculkan semuanya atau hanya cuplikannya saja.

Berbeda dengan halaman artikelnya yang menampilkan seluruh isi artikel. Untuk melakukan hal ini harus ditentukan terlebih dahulu kondisinya. Contoh penggunaan:

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/> --- muncul pada halaman posting
<b:else/> (jika bukan halaman posting, maka)
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/> --- muncul pada halaman statis
<b:else/> (jika bukan halaman posting dan bukan halaman statis, maka)
AUTO READ MORE SCRIPT --- muncul pada halaman indeks (selain halaman posting dan statis)

Contoh lainnya, misalnya pada widget recent post (artikel terkait).

Widget ini tidak perlu ditampilkan pada halaman depan, karena pada halaman depan sudah dimunculkan artikel terakhir yang ditulis.

Anda bisa menyembunyikan widget ini pada halaman depan juga dengan menggunakan tag kondisional.

Bagi seorang perancang template untuk blogspot sangat perlu mengetahui dan memahami berbagai tipe tag kondisional ini. Dengan tujuan supaya dapat meracik atau membuat template blog blogspot yang berkualitas dan sesuai dengan keinginan sang pembuat template.

11 Conditional Tag Blogger

Dibawah ini terdapat 11 jenis conditional tag pada blogger. Berikut daftar tag kondisional tersebut.

1. Conditional Tag untuk "Halaman Depan"

<b:if cond='data:blog.url == data:blog.homepageUrl'>
...
</b:if>

2. Halaman Posting dan Statis

<b:if cond='data:blog.url == data:post.url'>
...
</b:if>

3. Halaman Statis

<b:if cond='data:blog.pageType == "static_page"'>
...
</b:if>

4. Halaman Posting/Artikel

<b:if cond='data:blog.pageType == "item"'>
...
</b:if>

5. Halaman Indeks

Contohnya halaman depan, label, dan search.
<b:if cond='data:blog.pageType == "index"'>
...
</b:if>

6. Halaman Label

<b:if cond='data:blog.searchLabel'>
...
</b:if>

7. Halaman Search/Pencarian

<b:if cond='data:blog.searchQuery'>
...
</b:if>

8. Halaman Archive/Arsip

<b:if cond='data:blog.pageType == "archive"'>
...
</b:if>

9. Posting Pertama

Untuk post pertama misalnya pada halaman depan, label, search, atau archive.
<b:if cond='data:post.isFirstPost'>
...
</b:if>

10. Halaman Error

<b:if cond='data:blog.pageType == "error_page"'>
...
</b:if>

11. Halaman/URL Tertentu

<b:if cond='data:blog.url == "URL"'>
...
</b:if>

Multiple Condition

Untuk lebih dari satu kondisi, tambahkan kode <b:else/> seperti di bawah.
<b:if cond='data:blog.pageType == "item"'>
jika kondisi benar
<b:else/>
jika kondisi salah
</b:if>

Pengingkaran (Reverse Condition)

Kondisi pengingkaran merupakan kondisi dimana kode yang ada di dalamnya tidak tampil pada halaman yang tertulis pada tag kondisional, melainkan tampil pada semua halaman selain halaman yang tertulis pada tag kondisional.

Untuk kondisi pengingkaran cukup ubah kode == menjadi kode !=
<b:if cond='data:blog.url != data:post.url'>
...
</b:if>

Jika terjadi error coba ubah tanda " menjadi &quot;

Sekian artikel mengenai macam-macam conditional tag pada blogger, semoga artikel ini dapat bermanfaat bagi Anda.

Cara Buat Halaman Tukar Link & Banner yang Baik
Buat Halaman Tukar Link
Cara buat halaman tukar link & banner. Tutorial ini termasuk tutorial dasar. Anda hanya perlu mengetahui beberapa kode HTML, khususnya kode link dan image.

Sebenarnya tanpa halaman dan tanpa memberikan kode, anda juga bisa bertukar link ataupun banner. Tapi, dengan kode HTML yang telah anda sediakan apalagi dengan instruksi yang jelas, pengunjung akan lebih mudah bertukar link dengan anda.

Selain itu, dengan kode/script ini anda bisa membuatkan link atau banner yang anda inginkan untuk ditampilkan di blog parnter anda. Misalkan pada kode "title" dan "alt" untuk banner. Yang terpenting dari script yang Anda buat ini adalah untuk memaksimalkan keyword pada link dan banner anda di website-website lainnya.


Pertama, anda harus membuat halaman khusus untuk tukar link atau banner. Sebaiknya, halaman tukar link dan tukar banner anda bedakan agar lebih tertata dan lebih jelas bagi pengunjung.


Setelah itu, tulis beberapa kalimat yang sifatnya mengajak agar pengunjung mau bertukar link. Kemudian berikan petunjuk bagaimana cara untuk melakukannya.


Terakhir, buat kode untuk link dan banner blog anda untuk dipasangkan ke blog pengunjung. Berikut kodenya.

Link
&lt;a href="http://www.alamat-blog.com/" title="Judul dari blog anda yang akan tampil ketika ditunjuk"&gt;nama link&lt;/a&gt;
contoh: Xceria

Banner
&lt;a href="http://www.alamat-blog.com/" title="Judul dari blog anda yang akan tampil ketika ditunjuk"&gt;&lt;img src="http://www.url-banner.com/banner.gif" alt="text yang tampil sebelum gambar terbuka" border="0"/&gt;&lt;/a&gt;
contoh:
text yang tampil sebelum gambar terbuka


Anda bisa meletakkan script tersebut dalam textarea dengan kode <textarea>script tukar link</textarea> atau dengan menggunakan CSS

Agar pengunjung bisa memberi tahu ingin bertukar link, anda bisa menyediakan halaman kontak saya, chatbox, alamat email, ataupun kotak komentar di bawah halaman.

Semoga bermanfaat!

Cara Memposting Kode HTML di Blog
Posting Kode HTML
Cara memposting kode HTML di blog. Jika anda ingin menulis kode HTML atau script lainnya di postingan anda, anda harus memparsenya terlebih dahulu. Banyak mungkin yang sudah mengetahui tentang ini dan memang banyak blog yang menulis beberapa script di postingnya.

Bagaimana anda bisa mengatasi masalah penulisan kode HTML ini? Sebenarnya tidak rumit untuk melakukannya. Di bawah ini ada 3 kode yang sering digunakan dalam penulisan kode HTML.

< » ganti dengan &lt;
> » ganti dengan &gt;
& » ganti dengan &amp;

Tapi jika script yang ingin ditulis dalam jumlah besar tentu akan repot untuk mengganti satu persatu kode tersebut. Untuk mengatasi ini, ada tool online yang bisa anda gunakan untuk memparse kode HTML ke dalam bentuk teks.

Untuk melakukannya kunjungi link berikut.
http://centricle.com/tools/html-entities/
  1. Copy-paste kode HTML yang ingin anda parse ke dalam kotak yang disediakan.
  2. Tekan tombol encode.
  3. Terakhir, copy kode HTML yang sudah diparse ke dalam postingan anda.
Dengan tool ini dalam seketika kode HTML atau script yang anda masukkan akan segera berubah dan siap dimasukkan ke dalam postingan anda.

Ada satu lagi yang mau saya tulis berhubungan dengan penulisan kode HTML di website, yaitu seputar background yang digunakan. Kebanyakan para blogger memberi background yang berbeda pada script yang ditulisnya. Ini tentu akan memudahkan pengunjung dalam membaca tulisan atau tutorial yang telah dibuat.

Langsung saja ikuti tutorial di bawah ini untuk menerapkannya di blog anda.

CSS
  1. Sign in ke blogger.
  2. Pilih menu Layout (Tata Letak) » Edit HTML.
  3. Cari kode ]]></b:skin>.
  4. Copy kode berikut ke atas kode tadi.

    .code {background: #f1f1f1; border: 1px solid #cccccc; border-left: 5px solid #cccccc; padding: 15px;}

  5. Simpan template.
HTML

Pada posting gunakan format seperti di bawah ini untuk menerapkan kode css di atas.

<div class="code">
ketik scriptnya di sini
</div>

Cukup sampai di sini dulu posting kali ini mengenai cara memposting kode HTML di blogspot, semoga bermanfaat.

Selamat mencoba!

»
 
Back to top