128 Menayangkan iklan bergaya PageEar (PagePeel)

Date → Minggu, Oktober 12, 2008
Tags → Java Script | Tutorial Blogger | Widgets

PagePeel atau biasa disebut juga dengan istilah PageEar, Magic Corner, PeelAd, peel away ad atau apalah namanya, merupakan salah satu cara lain menayangkan iklan dengan gaya (style) yang berbeda. Tidak seperti tampilan iklan banner pada umumnya, jika anda mengarahkan mouse pada area PagePeel ini, maka akan terlihat halaman menggulung layaknya anda membuka selembar kertas dan menemukan halaman lain dilembar sebaliknya. Tujuan utama memasang PagePeel tentu saja ingin mendapatkan perhatian lebih besar dari pengunjung untuk mengkliknya.

Salah satu contoh blog populer yang menerapkan PagePeel adalah Johnchow.com. Namun sangat disayangkan ia sendiri malah menjual layanan PagePeel (peel away ad) ini seharga $37.00. Yah bayar..tidak perlu berkecil hati dan jangan sampai mengeluarkan dana paypal anda untuk membelinya.  Dari semua nama PagePeel yang saya sebut diatas, terus terang hanya ada satu layanan saja yang berani mengratiskanya, yaitu PageEar.

Meskipun gratis.. PageEar tidak kalah dengan versi PagePeel berbayar, salah satu fitur unggulannya yaitu kemampuan PageEar untuk menjalankan gambar dan suara sekaligus. Karena PageEar dijalankan via Flash dan JavaScript based, jadi anda dapat menggunakannya pada platform (blog/site) apa saja, termasuk blogger dong tentunya :)

Beberapa Fitur menarik dari PageEar:

• NEW! Pageear is scalable now. You can change the peel size 100×100 and 500×500 Pixel by your own.   
• Plays MP3-Files on startup, open and close of Pagepeel.
• Possibility to leave peel open and wait for userklick to close. Close text is editable.  
• Place it on the left or right upper corner
• Open and close automaticly after X seconds
• Speed of the small pageear could be changed
• Flashcheck (Adobe© Flash Detection)
• Reflecting image on corner
• Color of the pagecorner
• Link target on external side or own (self, new)
• Downwardcompatibly up to Flashversion 6
• Runs on nearly all Browser (FireFox, InternetExplorer, Opera, Safari, etc.)

Tutorial Cara Pasang (Installasi):

1. Download dulu file PageEar v1.4

2. Kemudian Extrack file pageear_v14.zip di folder anda.

3. Silahkan Edit File pageear.js (menggunakan notepad misalkan)

Note: dalam file pageear.js inilah semua konfigurasi yang anda perlukan. Agar anda tidak pusing tujuh keliling, saya sertakan saja contoh dari beberapa kemungkinan yang perlu anda edit. Lihat code yang diedit dengan warna merah.

var pagearSmallImg = 'http://alamat-server-anda.com/pageear_s.jpg';

var pagearSmallSwf = 'http://alamat-server-anda.com/pageear_s.swf';

var pagearBigImg = 'http://alamat-server-anda.com/pageear_b.jpg';

var pagearBigSwf = 'http://alamat-server-anda.com/pageear_b.swf';

var jumpTo = 'http://alamatbloganda.com/'

Sebenarnya masih banyak configurasi yang lain, selebihnya dibaca saja ya pada manualnya.

4. Upload semua file yang ada dalam folder pageear_v14/pageear/ ke server milik anda (pages.google.com misalkan)

5. Langkah akhir lakukan pemanggilan javascript, atau dari pada puyeng langsung copy paste aja kode dibawah ini. jangan lupa mengganti alamat url dibawah ditandai dengan warna merah dibawah.

<script language='javascript' src='http://alamat-server-anda.com/AC_OETags.js'/>
<script src='http://alamat-server-anda.com/pageear.js' type='text/javascript'/>
<script type='text/javascript'>
writeObjects();
</script>

Untuk pengguna blogger silahkan meletakan script diatas di bawah kode <title><data:blog.pageTitle/></title> pada halaman Edit HTML.

Bagaimana mengubah image sesuai keinginan anda?

Pertama buat image dengan ukuran 100x100 pixel, lalu simpan dengan nama pageear_s.jpg kemudian dengan cara yang sama, buat lagi image dengan ukuran 500x500 pixel, lalu simpan dengan nama pageear_b.jpg Jika anda sudah membuat kedua image diatas, silahkan upload kembali ke server milik anda.

Selamat Mencoba..happy blogging with o-om.com

Dengan memasukan alamat email dibawah ini, berarti anda akan dapat kiriman artikel terbaru dari o-om.com di inbox anda: