Code: IBM Mobile Web Push (Reactor) code for my blog

GitHub-MarkAs promised, in this post I will share the code I have on my WordPress blog to have it enabled with the Reactor code. You can download the code snippets directly from GitHub or follow the instructions below to insert the code into your Twenty Eleven Theme.

Step 1:

You will need an account on the IBM Mobile Web Push, you can use the trial for now to get start because its a fully functional trial.

Step 2:

Add this line to your header.php file, I have highlighted the code with comments that you should insert:

[codesyntax lang=”php”]

<h2 id="site-description"><?php bloginfo( 'description' ); ?></h2>
			//Custom code
//End Custom code <?php



Step 3:

Add these lines to your footer.php – all the way to the end before the body end tag. You will have to change the data-app-key to the one provided in the campaign manager for your account.

[codesyntax lang=”php”]


var mIndex = 1;
var mCount = 0;
		function updateUI(){
			jQuery( ".hItem"  ).hide("slow");
			if (mIndex > mCount){
				mIndex = 1;
			jQuery( "#messages" + mIndex  ).show("slow");

			window.setTimeout(function() {
			}, 5000);			

function startReactor(){

		Reactor.onMessage( function (message){
			var b = "
" + message.body + "
"; jQuery("#statusnotification").append(b); }); }); updateUI(); } startReactor();



Step 4:

Add this snippet to your style.css file:

[codesyntax lang=”css”]

#statusnotification {
	width: 100%;
	height: 45px;
	display: block;
	overflow: hidden;
	margin: 0 7.6%;
	margin-top: 10px;
	margin-right: 7.6%;
	margin-bottom: 0;
	margin-left: 7.6%;
	max-height: 45px;


Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.