1,135

How To Easily Hide Client-side Content from Google Web/Mobile Preview Bot

Share on TwitterShare on TumblrSubmit to StumbleUponSave on DeliciousDigg This

I’m really liking the new Preview option on Google Mobile Search, and I reckon it will be used far more than preview in regular web search. But there’s a small problem. Well actually a couple of problems, but here’s the solution to one:


var ua = navigator.userAgent.toLowerCase();
if(ua.indexOf('google web preview') == -1){
showContent();// whatever content you want to hide from Preview Bot
}

The above wont run showCntent() to Google’s PreviewBot. Why might you want to do this? Well I like to run surveys on some sites to gather qualitative feedback. I tend to use 4QSurvey.com for this (free, easy to set up, and gives great insight). The last thing you want is PreviewBot showing your website with the lightbox questionnaire, so it’s easy to block out. This is the code I use to load 4QSurvey asynchornously:


<script type="text/javascript">
(function(){
var UA = navigator.userAgent.toLowerCase();
if(UA.indexOf('google web preview') == -1){
var survey=document.createElement('script');
survey.src = "http://4qinvite.4q.iperceptions.com/1.aspx?sdfc=[your code]&lID=1&loc=4Q-WEB2";
survey.type = 'text/javascript';
survey.async = true;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(survey, s);
}
})();
</script>

The above will not block loading, and ensure PreviewBot doesn’t show a site preview with pop-up. To learn more about PreviewBot see Google’s Web Preview docs. The UA used for PreviewBot is “Google Web Preview (Mozilla/5.0 (en-us) AppleWebKit/525.13 (KHTML, like Gecko; Google Web Preview) Version/3.1 Safari/525.13)”.

prajapat