Arsip Bulan August 2010

Bermain dengan Style Message Box

18 August 2010

Di era web 2.0 sekarang, memunculkan pesan kepada pengguna setelah melakukan satu eksekusi adalah satu hal yang diperlukan. Para developer wordpress plugin juga semestinya melakukan hal ini terhadap plugin yang dikembangkannya.

Di dasbor wordpress sering kita jumpai informasi yang muncul di atas halaman (contohnya: informasi mengenai adanya wordpress versi terbaru). Bagi para developer, hal ini berguna untuk meng-generate error atau pesan lainnya tanpa perlu membuat style tambahan.

Output untuk message box pada wordpress di-generate sebagai berikut:

<div id="message" class="updated">
  <p>
    Output
  </p>
</div>

Message yang di-generate untuk keperluan (misalnya) plugin, tentu memuat informasi yang berbeda. Untuk itu, wordpress sendiri memiliki beberapa class stylesheet untuk message box tersebut. Berikut adalah beberapa class yang bisa digunakan…

<div id="message" class="updated">...</div>

Class Updated

<div id="message" class="error">...</div>

Class Error

<div id="message" class="updated highlight">...</div>

Class Highlight

<div id="message" class="updated below-h2">...</div>

Class Below

Catatan:
Sebaiknya tidak menggunakan format sendiri, karena secara psikologis, dengan menggunakan format yang terintegarsi dengan wordpress akan membuat plugin yang dikembangkan menjadi lebih “terpercaya”.

Sumber: wpengineer


Mencegah Klien Mengubah Theme WordPress

4 August 2010

Ketika kita menggunakan wordpress untuk proyek-proyek pembangunan website, terkadang kita menjumpai klien (yang notabene “awam”) yang begitu “kreatif” mengeksplorasi halaman wordpress admin, sehingga tanpa sengaja mengganti/switch theme menjadi theme default tanpa dia sadari.

Untuk mencegah kasus seperti itu, sedikit tips dari soulsizzle.com bisa menjadi alternatif pemecahannya.

Tambahkan kode berikut pada file functions.php anda:

add_action('admin_init', 'remove_theme_menus');
function remove_theme_menus() {
	global $submenu;	

	unset($submenu['themes.php'][5]);
	unset($submenu['themes.php'][15]);
}

Unit PNG Fix: Alternatif Siasat untuk Mengatasi Masalah PNG Transparan pada IE 6

3 August 2010

Tempo hari, saya pernah membahas mengenai PNG Transparan untuk Windows IE 5.5 dan 6. Di situ saya menggunakan jquery.pngFix.js untuk mengatasi permasalahan transparansi file PNG untuk IE 6 ke bawah. Namun ternyata, siasat tersebut terbentur ketika kita menggunakan file png untuk background repeat.
Setelah saya coba cari lagi, saya menemukan solusi yang terbaik (saat ini) untuk mengatasi permasalahan png transparan pada IE 6 ke bawah ini, yaitu unitpngfix.
Berikut adalah beberapa fakta, mengapa saya merekomendasikan unitpngfix ini:

  • Javascript yang dipakai terbilang ringan (kurang dari 2kb!).
  • Menyelesaikan masalah yang diakibatkan oleh atribut filter IE.
  • Bisa diimplementasikan untuk objek img dan background-
  • image.
  • Berjalan secara otomatis sebelum halaman di-load untuk semua elemen atau elemen tertentu.
  • Bisa dipakai untuk elemen auto width dan auto height.
  • Mudah dalam hal deployment atau teknis pemakaiannya.

Demo

Contoh PNG

Petunjuk Pemakaian

  1. Unduh file unigpngfix.zip di sini.
  2. Sisipkan tag berikut pada header (antara tag <head> dan </head>)
    <!--[if lt IE 7]>
            <script type="text/javascript" src="unitpngfix.js"></script>
    <![endif]-->
    
  3. Unggah file clear.gif ke folder images Anda. Bukalah unitpngfix.js lalu sesuaikan path dengan directory tempat file clear.gif diunggah.
  4. Secara default, unigpngfix akan bekerja pada semua gambar PNG di halaman situs Anda, namun jika dibutuhkan untuk beberapa elemen tertentu, Anda cukup menambahkan class="unitPng" pada elemen yang dibutuhkan. Penambahan class tersebut akan membuat unigpngfix hanya bekerja pada elemen yang memiliki class tersebut.

That’s it! Mulai sekarang Anda tidak akan menganggap Internet Explorer “hanya” sebagai tool untuk mengunduh Mozilla Firefox saja :p

Note:
Bagi pengguna wordpress, Unit PNG Fix ini sudah bisa digunakan dalam bentuk plugin (Unduh di sini).