https://github.com/nealrs/scrollpop

Place ads in between comments on your self-hosted WP blog
https://github.com/nealrs/scrollpop

Last synced: 1 day ago
JSON representation

Place ads in between comments on your self-hosted WP blog

• Host: GitHub
• URL: https://github.com/nealrs/scrollpop
• Owner: nealrs
• Created: 2013-06-03T22:21:24.000Z (over 11 years ago)
• Default Branch: master
• Last Pushed: 2013-07-22T15:55:29.000Z (over 11 years ago)
• Last Synced: 2023-07-31T17:26:01.210Z (over 1 year ago)
• Size: 125 KB
• Stars: 2
• Watchers: 3
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
#ScrollPop

ScrollPop is a set of javascript/php/css/html snippets which insert ads into the comment roll of your self-hosted WordPress blog. However, these aren't your run of the mill ad unit. ScrollPops are triggered, or pop, only when you mouse or scroll through the comment roll. This reduces page weight, combats ad-blindness, improves accuracy of impressions, and helps you monetize user generated content.

As my first experiment in jQuery/WP hacking, I developed ScrollPop in July of 2010 while I was interning at Entertainment Weekly. ScrollPop also incorporates [Brandon Aaron](http://brandonaaron.net/)'s [jQuery.mousewheel plugin](https://github.com/brandonaaron/jquery-mousewheel).

ScrollPop is freely available under the MIT license.

##Demo 

There is a live demo of both mouse & scroll triggers [here](http://www.stoutandporter.com/2010/07/14/cascabel-taqueria/#comments). Additionally, the [AudioShocker Podcast](http://www.audioshocker.com) uses ScrollPop, (always on, no trigger), to power both frontpage merchandise ads and comment-roll promotions for several independent webcomics.

##Installation

To enable ScrollPop ads on your WP blog:

 

1. Copy and paste the php snippet into [comments.php](#commentsphp) file where noted.

2. Copy the css/js includes into the head block of your [header.php](#headerphp) file. 

3. Create and upload [sp.css](#spcss) & [sp.js](#spjs) to your theme's root directory.

4. Edit [sp.js](#spjs) with your desired ad creative & URLs.

5. [optional] Edit [comments.php](#commentsphp) to adjust the ad frequency, (default is 1 every 5 comments).

###comments.php

Place after .postcomment div, and before $comment_number++ statement at end of each comment.

```php

advertisement
";

	}

?>

```


###header.php

```HTML

'

```

###sp.css

```css

.adbox {

  text-align: center;

  line-height:10px;

	font-size:10px;

	min-height:30px;

	overflow:hidden;

	padding: 0px;

	margin:10px 0 0 0;

	width:100%;

}

.adbox img {border:0;}

.adclear{clear: left;}

```

###sp.js

```js

mousead = 'http://nealshyam.com/scroll/iab.gif';

scrollurl = 'http://www.iab.org';

scrollad = 'http://nealshyam.com/scroll/iab2.gif';

mouseurl = 'http://www.google.com';

basead = 'http://nealshyam.com/scroll/iab.gif';

baseurl = 'http://www.google.com';

$(document).ready(function(){

	$(".adbox").mouseleave(function(){

		$(this).html('
advertisement
');		

	});

	

	$(".adbox").mousewheel(function(objEvent, delta){			  

		$(this).html('
advertisement
');		

	});

	

	// comment out previous two statements and enable bottom statement to make ads 'always on'

	//$(".adbox").html('
advertisement
');		

});

```