Find your mboxes quickly and easily with bookmarks

If you ever wanted a quick way to see where your mboxes are, I offer two bookmarks below. You can, of course, always use the onsite editor within the T&T platform as well.

This first bookmark simply highlights the mboxes in red as seen here on the homepage of JJEsquire:

These mboxes are displaying content from both Test&Target as well as Recommendations.  Since both of these products use the same mbox implementation, the bookmarks work great.  Here is the code to add to your bookmark manager within your browser:

javascript:function%20highlightV25Mboxes()%20{%20%20mboxFactoryDefault.getMboxes().each(%20function(mbox)%20{%20%20%20%20mbox.getDiv().setAttribute('style','border:%202px%20solid%20rgb(255,%200,%200);%20visibility:%20visible;%20display:%20block;');%20%20});}highlightV25Mboxes();

The second bookmark is one that I find myself using much more often.  This bookmark highlights the mboxes differently then the first bookmark.  It presents green overlays over the area that is mboxed, similar to how the Onsite Editor within T&T does.  This bookmark also tells you how many mboxes you have on the page.  You can also click the bookmark a second time and it will remove all mbox highlights.

This bookmark will not work on every website.  It requires that the website uses jQuery which is very common.  The image below shows what it looks like when used on the Test&Target product overview page:

Test&Target Omniture

Yes, we eat our own dog food.  ;)

Here is the code that leverages jQuery that you would save to your bookmark manager in your browser:

 

javascript:%20var%20$alert=jQuery(“<div%20/>”).css({position:”fixed”,top:0,left:0,width:”100%”,fontSize:”30px”,background:”#060″,opacity:.8,color:”#fff”,textAlign:”center”,padding:”10px”,display:”none”,zIndex:999}).addClass(“wolfalert”).appendTo(jQuery(“body”));function%20howlMboxesv1(){if(typeof(mboxFactoryDefault)!=’object’){wolffAlert(“Woof!!!%20There%20are%20no%20mBoxes%20on%20this%20page.”);return;}%20var%20$on=jQuery(“.wolferlay”);if($on.length){jQuery(“.wolferlay”).remove();wolffAlert(“mBoxes%20Removed.”);return;}%20var%20mb_i=0;mboxFactoryDefault.getMboxes().each(function(mbox){mb_i++;var%20$base=jQuery(mbox.getDiv());var%20id_base=$base.attr(“id”);var%20_id=($base.attr(“id”))?$base.attr(“id”)+’-wolferlay’:'wolferlay-’+mb_i;jQuery(“<div%20/>”).attr({id:_id}).addClass(‘wolferlay’).css({position:”absolute”,border:’1px%20solid%20#090′,background:”rgba(0,255,0,.3)”,width:parseInt($base.width()-2),height:parseInt($base.height()-2),top:$base.offset().top,left:$base.offset().left,zIndex:998}).appendTo(jQuery(“body”));if(id_base!=undefined){jQuery(“<div%20/>”).css({background:”rgba(0,0,0,.5)”,color:”#fff”,padding:”2px%205px”,fontFamily:”Calibri,%20Tahoma,%20Arial,%20sans-serif”,fontSize:”12px”,fontWeight:’bold’,zIndex:999}).text(id_base).appendTo(jQuery(“#”+_id))}});if(mb_i>0){if(mb_i==1){wolffAlert(“There%20is%20%201%20mBox%20on%20this%20page.”);}else{wolffAlert(“There%20are%20″+mb_i+”%20mBoxes%20on%20this%20page.”);}}}%20function%20wolffAlert(msg){$alert.text(msg);$alert.fadeIn(250);setTimeout(“fading()”,2000);}%20function%20fading(){jQuery(“.wolfalert”).fadeOut(250);}%20howlMboxesv1();


After you save these bookmarks to your browser you can simply click on them while on any page you suspect of having an mbox on it.

Leave a Comment