Membuat Buku Tamu Cbox dengan JQuery Fancybox

13:28  imam77  1 comment

Tutorial kali ini ialah cara membuat buku tamu dengan Fancybox.









Langkah 1



Pasang Cbox di sidebar blog Anda, lalu beri tajuk Cbox.







Langkah 2





Pergi ke halaman Edit HTML dan tick Expand Template Widget



Cari kode (yang sama) ini:







<b:widget id='HTML2' locked='false' title='Cbox' type='HTML'>



<b:includable id='main'>



<!-- only display title if it's non-empty -->





<b:if cond='data:title != &quot;&quot;'>



<h2 class='title'><data:title/></h2>



</b:if>



<div class='widget-content'>



<data:content/>



</div>



<b:include name='quickedit'/>





</b:includable>



</b:widget>



</b:section>











Ubah kode tersebut menjadi seperti ini:







<b:widget id='HTML2' locked='false' title='Cbox' type='HTML'>



<b:includable id='main'>



<!-- only display title if it's non-empty -->





<div style='display:none'><div id='cbox'>



<b:if cond='data:title != &quot;&quot;'>



<h2 class='title'><data:title/></h2>



</b:if>



<div class='widget-content'>



<data:content/>





</div>



</div></div>



<b:include name='quickedit'/>



</b:includable>



</b:widget>



</b:section>



Perhatikan kode yang berwarna orangeye. Kode tersebut berfungsi untuk menyembunyikan dan memberi identiti (id) pada Cbox.







Jangan lupa untuk menyimpan template Anda.









Langkah 3



Mari kita panggil Cbox yang telah disembunyikan tadi dengan kode berikut:







<a id="inline" href="#cbox">Klik untuk menampilkan Cbox</a>



Kode tersebut dapat ditempatkan di sidebar atau di postingan.





Semoga berjaya :)