Integrasi MultiBox di Blogger

MultiBox adalah sebuah aplikasi lightbox sebagai penampil konten seperti gambar, mp3, video, html, ajax, frame, dan lain-lain. yang dapat membuat blog anda terlihat menarik dan dinamis. Aplikasi MultiBox ini, tidak menggunakan Jquery melainkan MooTools.  

Oeminfo sendiri masih awam soal Jquery. tapi hasil penelusuran di google dengan keyword "jquery vs javascript" Untuk info tentang Jquery dan MooTools Oeminfo menemukan artikelnya disini, ataupun tentang Prototype v.s. jQuery disini.

Bagaimana Memasang/Mengintegrasikan MultiBox di Template Blogger  ?
Langkahnya adalah sebagi berikut :

Pertama
- Login ke Blogger
- di Dashboard kita langsung ke Rancangan atau Design Lalu pilih Edit HTML
- Cari kode </head>
- Letakan kode MultiBox di bawah ini, diatas kode </head>

<link href="http://www.virtuosomaster.com/tutorials/samples/MultiBox/multibox/multibox.css" rel="stylesheet" type="text/css"/>
<script src="http://www.virtuosomaster.com/tutorials/samples/MultiBox/multibox/js/mootools.js" type="text/javascript"></script>
<script src="http://www.virtuosomaster.com/tutorials/samples/MultiBox/multibox/js/overlay.js" type="text/javascript"></script>
<script src="http://www.virtuosomaster.com/tutorials/samples/MultiBox/multibox/js/multibox.js" type="text/javascript"></script>

- Cari kode </body>
- Letakan kode JS di bawah ini, diatas kode </body>

<script type=”text/javascript”>
var box = {};
window.addEvent(‘domready’, function(){box = new MultiBox(‘mb’, {descClassName: ‘multiBoxDesc’, useOverlay: true}); });
</script>

- Simpan Template
Sampai tahap ini anda telah berhasil memasang  MultiBox di Blogger.
Untuk  menerapkan pada postingan, cobalah buat sebuah postingan, terus upload sebuah gambar.
tambah kan :

id="mb1" class="mb" title="Image Title"

lihat gambar.

tambahkan kode di bawah untuk memberikan deskripsi gambar:

<div style="display: none;" class="multiBoxDesc mb1">This is my descrition text 1. It can support html.</div>

sehingga tampak seperti pada gambar dibawah :

Terakhir Pratinjau hasil kerjanya, jika sudah benar maka Publish atau Terbitkan Entri
Untuk Demonya bisa di lihat disini atau di Blog Oemar yang www.oem4r.co.cc, Oemar pake MultiBox ini untuk penampil gambar dan Widget ChatBox atau buku tamu.

Dowload MultiBox
Source : virtuosomaster