Cara Membuat Popup jQuery (Update)

Trik Cara Membuat Popup dengan jQuery

Membuat popup adalah salah satu dalam kiat kita menghias blog,ini akan memiliki peran sebagai penghemat tempat namun blog tetap dalam keadaan full performance.

Langsung gan,untuk melihat contohnya (ini mungkin akan bekerja pada browser di kompi ya seperti mozilla dan selainnya,alias kurang bekerja baik pada handphone ataupun IE:() sobat bisa lihat gambar dibawah ini:

Atau sobat bisa lihat situsnya di sini.(jika situs masih tersedia ya :D)

Gimana sob,tertarik?

Gini nih cara bikinnya,Pertama langkahnya seperti biasanya ya hanya pilih Dashboard (gb.1),lalu Tata Letak (gb.2) kemudian contreng tulisan Expands Widget Templates (gb.3).



(1)



(2)



(3)

Letakkan kode berikut tepat diatas kode </head>

<!-- Kode Menampilkan berita muslim sahih -->
<script type="text/javascript" src="http://layanan.oposisi.net/tampilan/highslide-with-html.js"></script>
<link rel="stylesheet" type="text/css" href="http://layanan.oposisi.net/tampilan/highslide.css" />
<script type="text/javascript">
hs.graphicsDir = 'http://layanan.oposisi.net/tampilan/bingkai/';
hs.outlineType = 'rounded-white';
hs.wrapperClassName = 'draggable-header';
</script>
<!-- Kode Menampilkan berita muslim sahih Sampai di sini -->

Lalu simpan templates.
Selanjutnya,untuk menampilkannya pada widget coba pilih Tata Letak / Rancangan seperti gambar no (1),dan klik tulisan Add New Widget atau Tambah Gadget,lihat Gambar no (4)




(4)


(5)

Selanjutnya pilih HTML/Javascript lihat Gb(5)kemudian letakkan kode berikut:

<a href="http://1.bp.blogspot.com/-8mQnRA_9rpw/TYh3n0lPDDI/AAAAAAAAAxs/gi5Vv6PqqpA/s1600/berita%2Bmuslim%2Bsahih.jpg" class="highslide"
onclick="return hs.htmlExpand(this, { objectType: 'iframe', width: 270, height: 300,} )">Lihat Gambar Al-Qur'an</a>

Lalu Simpan.Selesai deh :D

Ket:

Kode yang berwarna merah sesuaikan dengan keinginan sobat ya :D
http://1.bp.blogspot.com/-8mQnRA_9rpw/TYh3n0lPDDI/AAAAAAAAAxs/gi5Vv6PqqpA/s1600/berita%2Bmuslim%2Bsahih.jpg rubahlah dengan url gambar sobat atau bisa juga alamat situs seperti http://www.google.co.id/,http://www.youtube.com/,dll.

Membuat Anchor Popup dengan jQuery (Popup Keren dengan Klik)

UPdate! Trik Membuat Membuat Anchor Popup dengan jQuery (Popup Keren dengan Klik),Sudah Direvisi! Dijamin Berhasil 100%

Trik Cara Membuat Popup dengan jQuery

Membuat popup adalah salah satu dalam kiat kita menghias blog,ini akan memiliki peran sebagai penghemat tempat namun blog tetap dalam keadaan full performance.

Langsung gan,untuk melihat contohnya (ini mungkin akan bekerja pada browser di kompi ya seperti mozilla dan selainnya,alias kurang bekerja baik pada handphone ataupun IE:() sobat bisa lihat gambar dibawah ini:

Atau sobat bisa lihat situsnya di sini.(jika situs masih tersedia ya :D)

Gimana sob,tertarik?

Gini nih cara bikinnya,Pertama langkahnya seperti biasanya ya hanya pilih Dashboard (gb.1),lalu Tata Letak (gb.2) kemudian contreng tulisan Expands Widget Templates (gb.3).

(1)


(2)


(3)

Letakkan kode berikut tepat diatas kode </head>

<!-- Kode Menampilkan berita muslim sahih -->
<script type="text/javascript" src="http://layanan.oposisi.net/tampilan/highslide-with-html.js"></script>
<link rel="stylesheet" type="text/css" href="http://layanan.oposisi.net/tampilan/highslide.css" />
<script type="text/javascript">
hs.graphicsDir = 'http://layanan.oposisi.net/tampilan/bingkai/';
hs.outlineType = 'rounded-white';
hs.wrapperClassName = 'draggable-header';
</script>
<!-- Kode Menampilkan berita muslim sahih Sampai di sini -->

Lalu simpan templates.
Selanjutnya,untuk menampilkannya pada widget coba pilih Tata Letak / Rancangan seperti gambar no (1),dan klik tulisan Add New Widget atau Tambah Gadget,lihat Gambar no (4)



(4)


(5)

Selanjutnya pilih HTML/Javascript lihat Gb(5)kemudian letakkan kode berikut:

<a href="http://1.bp.blogspot.com/-8mQnRA_9rpw/TYh3n0lPDDI/AAAAAAAAAxs/gi5Vv6PqqpA/s1600/berita%2Bmuslim%2Bsahih.jpg" class="highslide"
onclick="return hs.htmlExpand(this, { objectType: 'iframe', width: 270, height: 300,} )">Lihat Gambar Al-Qur'an</a>

Lalu Simpan.Selesai deh :D

Ket:

Kode yang berwarna merah sesuaikan dengan keinginan sobat ya :D
http://1.bp.blogspot.com/-8mQnRA_9rpw/TYh3n0lPDDI/AAAAAAAAAxs/gi5Vv6PqqpA/s1600/berita%2Bmuslim%2Bsahih.jpg rubahlah dengan url gambar sobat atau bisa juga alamat situs seperti http://www.google.co.id/,http://www.youtube.com/,dll.

Cara Membuat Link Anchor Satu Halaman / Navigasi Halaman Back to Top

Membuat Link ke Atas,Menuju Tengah,ke Bawah Dalam satu Halaman

Emang susah ya sob njelasin dari judul postingan kali ini,intinya,kali ini saya ingin sekali membagikan inpo masalah membuat link anchor satu halaman.
Seperti apa sih bentuk fisiknya,sobat bisa lihat di salah satu posting blog sahabat saya mas Arya di Ramadhan Bersama Prambors.

Tampilan atas:



Saat sobat klik anchor link 'testimonial' maka langsung tertuju seperti pada gambar berikut:

Dan saat sobat klik anchor link 'help' maka langsung tertuju seperti pada gambar berikut:

Jika sobat perhatikan,dari screenshot gambar diatas,jika postingan blog sahabat saya tersebut dibuka / dibaca menggunakan browser Mozilla misalnya,maka setiap kita mengklik salah satu link anchor tertuju,misal 'testimonial','about' atau 'help' (dalam gambar diatas) maka akan denga sendirinya menentukan link yang dituju.
Lebih jelasnya ya,sobat lihat di sini (coba gunakan browser mozilla ya).

Nah,gimana sob dah jelas ya tutorial apa yang ingin saya sampaikan malam hari ini :D

Langkah dan Cara Membuat Link Anchor Satu Halaman / Link Tombol Kembali ke Atas

Pertama,baca bismillah ya..
Selanjutnya,buatlah posting seperti berikt ini,untuk mengetahui triknya,sobat bisa copy paste aja dari beberapa barisan artikel berikut,da modifikasi sendiri ya :D

Pergilah ke posting dan pilihlah type edit htmlnya,lihat gambar dibawah ini:



Kemudian buatlah posting seperti ini (hanya contoh saja ya,INGAT,penulisan huruf kecil dan besar pada link anchornya sangat sensitiv ya gan pent-)

Mulai posting dari sini..
<a href="#about">About</a> | <a href="#help">Help</a> | <a href="#testimonial">Testimonial</a>
<a name="about"></a>
<h4>About</h4>

Kami adalah jasa membuat website dan blog dengan menawarkan harga paling rendah namun dengan hasil berkualitas tinggi.
Pelajaran Blog adalah sarana online dalam belajar membuat blog juga belajar seo blogspot bagi blogger tingkat pemula.
Selain daripada itu,kami juga menyediakan berbagai pilihan blogger template yang seo friendly namun tetap tidak mengabaikan akan keindahannya.

Untuk seo,kami menyediakan tutorial dasar dalam teknik seo,trik seo,rahasia seo juga tips dan trik seo agar situs menjadi nomor 1 di halaman serach engine Google.
Buktikan dan bersiaplah menjadi miliarder baru dalam dunia internet!

<a name="testimonial"></a>
<h4><strong>Testimonial</strong></h4>

Pelajaran Blog is an online tool for the study also learn seo blog blogger blogspot for beginner level.
Other than that, we also provide a wide selection of blogger templates seo friendly but still do not ignore its beauty.

For SEO, we provide a basic tutorial in seo techniques, seo tricks, seo secrets seo tips and tricks as well to the site to be number 1 on page serach engine Google.
Prove it and be prepared to become new millionaires in the internet world!

<a name="help"></a>
<h4><strong>Help</strong></h4>

Pelajaran Blog adalah sarana online dalam belajar membuat blog juga belajar seo blogspot bagi blogger tingkat pemula.
Selain daripada itu,kami juga menyediakan berbagai pilihan blogger template yang seo friendly namun tetap tidak mengabaikan akan keindahannya.
Untuk seo,kami menyediakan tutorial dasar dalam teknik seo,trik seo,rahasia seo juga tips dan trik seo agar situs menjadi nomor 1 di halaman serach engine Google.
Buktikan dan bersiaplah menjadi miliarder baru dalam dunia internet!

Pelajaran Blog is an online tool for the study also learn seo blog blogger blogspot for beginner level.
Other than that, we also provide a wide selection of blogger templates seo friendly but still do not ignore its beauty.
For SEO, we provide a basic tutorial in seo techniques, seo tricks, seo secrets seo tips and tricks as well to the site to be number 1 on page serach engine Google.
Prove it and be prepared to become new millionaires in the internet world!

Akhir posting disini.

Nah,kemudian publikasikan.Selesai.

Hasilnya,kurang lebih akan seperti ini gan:

About | Help | Testimonial

About

Kami adalah jasa membuat website dan blog dengan menawarkan harga paling rendah namun dengan hasil berkualitas tinggi.
Pelajaran Blog adalah sarana online dalam belajar membuat blog juga belajar seo blogspot bagi blogger tingkat pemula.
Selain daripada itu,kami juga menyediakan berbagai pilihan blogger template yang seo friendly namun tetap tidak mengabaikan akan keindahannya.

Untuk seo,kami menyediakan tutorial dasar dalam teknik seo,trik seo,rahasia seo juga tips dan trik seo agar situs menjadi nomor 1 di halaman serach engine Google.
Buktikan dan bersiaplah menjadi miliarder baru dalam dunia internet!

Testimonial

Pelajaran Blog is an online tool for the study also learn seo blog blogger blogspot for beginner level.
Other than that, we also provide a wide selection of blogger templates seo friendly but still do not ignore its beauty.

For SEO, we provide a basic tutorial in seo techniques, seo tricks, seo secrets seo tips and tricks as well to the site to be number 1 on page serach engine Google.
Prove it and be prepared to become new millionaires in the internet world!

Help

Pelajaran Blog adalah sarana online dalam belajar membuat blog juga belajar seo blogspot bagi blogger tingkat pemula.
Selain daripada itu,kami juga menyediakan berbagai pilihan blogger template yang seo friendly namun tetap tidak mengabaikan akan keindahannya.
Untuk seo,kami menyediakan tutorial dasar dalam teknik seo,trik seo,rahasia seo juga tips dan trik seo agar situs menjadi nomor 1 di halaman serach engine Google.
Buktikan dan bersiaplah menjadi miliarder baru dalam dunia internet!

Pelajaran Blog is an online tool for the study also learn seo blog blogger blogspot for beginner level.
Other than that, we also provide a wide selection of blogger templates seo friendly but still do not ignore its beauty.
For SEO, we provide a basic tutorial in seo techniques, seo tricks, seo secrets seo tips and tricks as well to the site to be number 1 on page serach engine Google.
Prove it and be prepared to become new millionaires in the internet world!

Semoga berhasil ya sob,dan tunggu artikel selanjutnya yang tak kalah Hot!!
See you guys..