<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Design strike &#187; page peel</title>
	<atom:link href="http://designstrike.net/tag/page-peel/feed" rel="self" type="application/rss+xml" />
	<link>http://designstrike.net</link>
	<description>Striking with the latest design info</description>
	<lastBuildDate>Fri, 18 Jun 2010 13:51:26 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>How to create a peel ad in a WordPress blog</title>
		<link>http://designstrike.net/development/how-to-create-a-peel-ad-in-a-wordpress-blog.html</link>
		<comments>http://designstrike.net/development/how-to-create-a-peel-ad-in-a-wordpress-blog.html#comments</comments>
		<pubDate>Wed, 07 Oct 2009 19:26:39 +0000</pubDate>
		<dc:creator>Alex</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[page peel]]></category>
		<category><![CDATA[peel ad]]></category>
		<category><![CDATA[wordpress peel]]></category>

		<guid isPermaLink="false">http://designstrike.net/?p=1309</guid>
		<description><![CDATA[A peel ad is often a great way to advertise a chosen product. It doesn&#8217;t matter if it&#8217;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 [...]]]></description>
			<content:encoded><![CDATA[<div class="tweetmeme_button" style="float: left; margin-right: 10px;">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fdesignstrike.net%2Fdevelopment%2Fhow-to-create-a-peel-ad-in-a-wordpress-blog.html"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fdesignstrike.net%2Fdevelopment%2Fhow-to-create-a-peel-ad-in-a-wordpress-blog.html&amp;source=designstrike&amp;style=normal" height="61" width="50" /><br />
			</a>
		</div>
<p>A peel ad is often a great way to advertise a chosen product. It doesn&#8217;t matter if it&#8217;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.</p>
<p><img src="http://designstrike.net/wp-content/uploads/2009/10/page-peel.jpg" alt="page-peel" title="page-peel" width="500" height="285" class="alignnone size-full wp-image-1311" /></p>
<p>If you are the lazy type just like me, go ahead and <a href="http://wordpress.org/extend/plugins/page-peel/" rel='nofollow'>download this plugin</a>, it does the same thing. If you would like to find out how to code your peel ad here is how to do it:<br />
<span id="more-1309"></span><br />
<strong>Download the source files</strong></p>
<p>In order for the ad to work you will need <a href='http://designstrike.net/wp-content/uploads/2009/10/peel.zip'>the peel files</a>, that you need to upload to your web server. The best place to upload the peel file is <strong>wp-content/themes/your_current_theme/</strong>.</p>
<p><strong>Edit the javascript file</strong></p>
<p>Now we need to edit the <strong>peel.js</strong> javascript file. Open it in your favourite text editor and change the following files:</p>
<p>   1. jaaspeel.ad_url – URL you intend to point the ad.<br />
   2. jaaspeel.small_path – Path to small.swf<br />
   3. jaaspeel.small_image – Path to small.jpg<br />
   4. jaaspeel.big_path – Path to large.swf<br />
   5. jaaspeel.big_image – Path to large.jpg</p>
<p>Here you have a actual example of how it can be done.</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;">jaaspeel.<span style="color: #006633;">ad_url</span> <span style="color: #339933;">=</span> escape<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'http://www.designstrike.net'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> 
jaaspeel.<span style="color: #006633;">small_path</span> <span style="color: #339933;">=</span> <span style="color: #0000ff;">'http://www.designstrike.net/wp-content/themes/simplified/peel/small.swf'</span><span style="color: #339933;">;</span> 
jaaspeel.<span style="color: #006633;">small_image</span> <span style="color: #339933;">=</span> escape<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'http://www.designstrike.net/wp-content/themes/simplified/peel/small.jpg'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> 
jaaspeel.<span style="color: #006633;">big_path</span> <span style="color: #339933;">=</span> <span style="color: #0000ff;">'http://www.designstrike.net/wp-content/themes/simplified/peel/large.swf'</span><span style="color: #339933;">;</span> 
jaaspeel.<span style="color: #006633;">big_image</span> <span style="color: #339933;">=</span> escape<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'http://www.designstrike.net/wp-content/themes/simplified/peel/large.jpg'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>

<p><strong>What files you need to edit</strong></p>
<p>The small image file is the image that the users sees when no hover is applied. You can change this according to your background.</p>
<p>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.</p>
<p><strong>Upload</strong></p>
<p>Upload the entire peel folder inside your theme file. Be shure to specify the paths correctly.</p>
<p><strong>Code insertion inside your theme</strong></p>
<p>Ok, we need to add a little javascript call in your head section of the theme. To do this navigate to your <strong>header.php</strong> file and insert the following code before the ending <strong>head</strong> tag.</p>

<div class="wp_syntax"><div class="code"><pre class="xhtml" style="font-family:monospace;">&lt;script src=&quot;&lt;strong&gt;http://www.domain.com/peel.js&lt;/strong&gt;&quot; type=&quot;text/javascript&quot;&gt;&lt;/script&gt;</pre></div></div>

<p>And there you go, instant peel ads without the help of any plugin.  </p>
]]></content:encoded>
			<wfw:commentRss>http://designstrike.net/development/how-to-create-a-peel-ad-in-a-wordpress-blog.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>
