How to Fix "Google Friend Connect is not displayed" Problem

If you use MooTools(http://mootools.net/) script inside your blogger template, mostly your Google Friend Connect widget will disappear from your blogger blog and only shows a white space.This is a serious problem to more bloggers.I also have faced to this problem and finally find the solution for this problem.I thinks this little trick will also helpful to others and decide to explain how to solve this problem.

MooTools is a compact, modular, Object-Oriented JavaScript framework designed for the intermediate to advanced JavaScript developer. It allows you to write powerful, flexible, and cross-browser code with its elegant, well documented, and coherent API.

MooTools can be included in your template in 2 ways.

First way:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/mootools/1.2.4/mootools-yui-compressed.js"></script>

Second way:

<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("mootools", "1.2.4");
</script>

You can do this with in few seconds.Now follow the steps given below.



Login to your Blogger dashboard --> Design --> Edit HTML.

You don't need to click on "Expand Widget Templates".

Scroll down to where you see the </head> tag of your template.

Now copy below code and paste it just before the </head> tag.

<script type='text/javascript'>
//<![CDATA[

JSON.extend({
parse: function(string) {
return JSON.decode(string);
},
stringify: function(obj) {
return JSON.encode(obj);
}
});

//]]>
</script>

Save your template and you are done.

When your problem is fixed, please don't forget to leave a comment.