How to create a peel ad in a WordPress blog
Posted in Development, Wordpress by Alex | Tags: page peel, peel ad, wordpress peelA peel ad is often a great way to advertise a chosen product. It doesn’t matter if it’s your own product or a affiliate product. This type of ad is one of the most successful when it comes to get the users attention. The installation is fairly simple and it can be set up in just 5 min.

If you are the lazy type just like me, go ahead and download this plugin, it does the same thing. If you would like to find out how to code your peel ad here is how to do it:
Download the source files
In order for the ad to work you will need the peel files, that you need to upload to your web server. The best place to upload the peel file is wp-content/themes/your_current_theme/.
Edit the javascript file
Now we need to edit the peel.js javascript file. Open it in your favourite text editor and change the following files:
1. jaaspeel.ad_url – URL you intend to point the ad.
2. jaaspeel.small_path – Path to small.swf
3. jaaspeel.small_image – Path to small.jpg
4. jaaspeel.big_path – Path to large.swf
5. jaaspeel.big_image – Path to large.jpg
Here you have a actual example of how it can be done.
jaaspeel.ad_url = escape('http://www.designstrike.net'); jaaspeel.small_path = 'http://www.designstrike.net/wp-content/themes/simplified/peel/small.swf'; jaaspeel.small_image = escape('http://www.designstrike.net/wp-content/themes/simplified/peel/small.jpg'); jaaspeel.big_path = 'http://www.designstrike.net/wp-content/themes/simplified/peel/large.swf'; jaaspeel.big_image = escape('http://www.designstrike.net/wp-content/themes/simplified/peel/large.jpg');
What files you need to edit
The small image file is the image that the users sees when no hover is applied. You can change this according to your background.
The large image file is the actual ad image that the user sees when it hovers the ad and the peel is released. This can be edited accordingly.
Upload
Upload the entire peel folder inside your theme file. Be shure to specify the paths correctly.
Code insertion inside your theme
Ok, we need to add a little javascript call in your head section of the theme. To do this navigate to your header.php file and insert the following code before the ending head tag.
<script src="<strong>http://www.domain.com/peel.js</strong>" type="text/javascript"></script>
And there you go, instant peel ads without the help of any plugin.
You may be interested in these also:
One Comment to “How to create a peel ad in a WordPress blog”
Post comment
Sponsors
Pages
Recent Posts
- 35+ free Icon sets for your next web development project
- Grunge web design tools, brushes and patterns
- Rushhour: WordPress Corporate business blog template
- Autor comment highlight in WordPress 2.8+
- How to create a peel ad in a WordPress blog
- How to make a author box in WordPress
- Best 5 wordpress hosting providers
- A free Photoshop WordPress theme
- 15+ Internet Explorer comics
- How to debug for IE6 with multiple IE instances
- 20+ deviant inspirational design layouts
- How to make your very own CAPTCHA
- 25+ incredible Photoshop makeover videos
- 10 best of the best Joomla themes
- How to set up a hotel reservation form in a WordPress page
WP Themes says:
I would like to incorporate this to my website. Problem is finding the design material (banners) for the site.
Do you know any clean/simple peel banners for free or something cheap?
Thanks
WP Themes´s last blog ..WooThemes Themes Giveway Contest from WPThemes.com