1- How to add a search engine to a Blogger blog?
A simple search engine is very helpful for blog visitors to find content on your blog.
1- Log in to Blogger | Dashboard | Layout | Page Elements and on your sidebar click Add a Gadget link.
2- A new window will pop-up, scroll down and select HTML/JavaScript as your new widget.
3- In the Title field type any title and in the Content field paste the following code:
4- Save your widget and check your search engine.
1- Log in to Blogger | Dashboard | Layout | Page Elements and on your sidebar click Add a Gadget link.
2- A new window will pop-up, scroll down and select HTML/JavaScript as your new widget.
3- In the Title field type any title and in the Content field paste the following code:
<form id="searchthis" action="/search" style="display:inline;"
method="get">
<input id="search-box" name="q" size="25" type="text"/>
<input id="search-btn" value="Search" type="submit"/></form>
method="get">
<input id="search-box" name="q" size="25" type="text"/>
<input id="search-btn" value="Search" type="submit"/></form>
4- Save your widget and check your search engine.
2- Random posts widget to display a random post in sidebar.
This cool widget automatically displays a random post from your blog and displays it in your sidebar.
1- Log in to Blogger | Dashboard | Layout | Page Elements and on your sidebar click Add a Gadget link.
2- A new window will pop-up, scroll down and select HTML/JavaScript as your new widget.
3- In the Title field type any title and in the Content field paste the following code:
4- Save your widget and done.
1- Log in to Blogger | Dashboard | Layout | Page Elements and on your sidebar click Add a Gadget link.
2- A new window will pop-up, scroll down and select HTML/JavaScript as your new widget.
3- In the Title field type any title and in the Content field paste the following code:
<div id="myLuckyPost"></div> <script type="text/javascript"> function showLucky(root){ var feed = root.feed; var entries = feed.entry || []; var entry = feed.entry[0]; for (var j = 0; j < entry.link.length; ++j){if (entry.link[j].rel == 'alternate'){window.location = entry.link[j].href;}}} function fetchLuck(luck){ script = document.createElement('script'); script.src = '/feeds/posts/summary?start-index='+luck+'&max-results=1&alt=json-in-script&callback=showLucky'; script.type = 'text/javascript'; document.getElementsByTagName('head')[0].appendChild(script); } function feelingLucky(root){ var feed = root.feed; var total = parseInt(feed.openSearch$totalResults.$t,10); var luckyNumber = Math.floor(Math.random()*total);luckyNumber++; a = document.createElement('a'); a.href = '#random'; a.rel = luckyNumber; a.onclick = function(){fetchLuck(this.rel);}; a.innerHTML = 'View Random Post'; document.getElementById('myLuckyPost').appendChild(a); } </script> <script src="/feeds/posts/summary?max-results=0&alt=json-in-script&callback=feelingLucky"></script>
4- Save your widget and done.
3- Show total posts and comments widget.
You can show total number of posts and comments on your blog by simply adding this small piece of code in your sidebar.
1- Log in to Blogger | Dashboard | Layout | Page Elements and on your sidebar click Add a Gadget link.
2- A new window will pop-up, scroll down and select HTML/JavaScript as your new widget.
3- In the Title field type any title and in the Content field paste the following code:
Note: Replace YOUR BLOG URL with full URL of your blog like http://yourname.blogspot.com/.
4- Save and see the result.
1- Log in to Blogger | Dashboard | Layout | Page Elements and on your sidebar click Add a Gadget link.
2- A new window will pop-up, scroll down and select HTML/JavaScript as your new widget.
3- In the Title field type any title and in the Content field paste the following code:
<script style="text/javascript">
function numberOfPosts(json) {
document.write('Posts: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
function numberOfComments(json) {
document.write('Comments: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
</script>
<font color="blue"><script src="YOUR BLOG URLfeeds/posts/default?alt=json-in-script&callback=numberOfPosts"></script>
<script src="YOUR BLOG URLfeeds/comments/default?alt=json-in-script&callback=numberOfComments"></script></font>
function numberOfPosts(json) {
document.write('Posts: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
function numberOfComments(json) {
document.write('Comments: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
</script>
<font color="blue"><script src="YOUR BLOG URLfeeds/posts/default?alt=json-in-script&callback=numberOfPosts"></script>
<script src="YOUR BLOG URLfeeds/comments/default?alt=json-in-script&callback=numberOfComments"></script></font>
Note: Replace YOUR BLOG URL with full URL of your blog like http://yourname.blogspot.com/.
4- Save and see the result.
4- A recent comments widget to display 25 comments with summaries.
Normally, a recent comments widget can display only 5 recent comments but this new widget can display up to 25 comments with their summaries in your sidebar.
1- Log in to Blogger | Dashboard | Layout | Page Elements and on your sidebar click Add a Gadget link.
2- A new window will pop-up, scroll down and select HTML/JavaScript as your new widget.
3- In the Title field type any title and in the Content field paste the following code:
Note: Make sure you replace YOUR BLOG URL with the URL of your blog like http://yourname.blogspot.com/ and you can also change the no. of comments to display, currently it will display 20 comments but you can change it by changing 20 from the 3rd line of this code.
4- Save and done.
1- Log in to Blogger | Dashboard | Layout | Page Elements and on your sidebar click Add a Gadget link.
2- A new window will pop-up, scroll down and select HTML/JavaScript as your new widget.
3- In the Title field type any title and in the Content field paste the following code:
<ul style="font-style: italic;"><script style="text/javascript">
function showrecentcomments(json) {
for (var i = 0; i < 20; i++) {
var entry = json.feed.entry[i];
var ctlink;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
ctlink = entry.link[k].href;
break;
}
}
ctlink = ctlink.replace("#", "#comment-");
var ptlink = ctlink.split("#");
ptlink = ptlink[0];
var txtlink = ptlink.split("/");
txtlink = txtlink[5];
txtlink = txtlink.split(".html");
txtlink = txtlink[0];
var pttitle = txtlink.replace(/-/g," ");
pttitle = pttitle.link(ptlink);
if ("content" in entry) {
var comment = entry.content.$t;}
else
if ("summary" in entry) {
var comment = entry.summary.$t;}
else var comment = "";
var re = /<\S[^>]*>/g;
comment = comment.replace(re, "");
document.write('<li style="text-align:left">');
document.write('<a href="' + ctlink + '">' + entry.author[0].name.$t + '</a>');
document.write(' on ' + pttitle);
document.write('<br>');
if (comment.length < 150) {
document.write(comment + '...<a href="' + ctlink + '"> (more)</a><br><br>');
}
else
{
comment = comment.substring(0, 150);
var quoteEnd = comment.lastIndexOf(" ");
comment = comment.substring(0, quoteEnd);
document.write(comment + '...<a href="' + ctlink + '"> (more)</a><br><br>');
}
}
document.write('</li>');
}
</script>
<script src="YOUR BLOG URLfeeds/comments/default?alt=json-in-script&callback=showrecentcomments">
</script></ul>
function showrecentcomments(json) {
for (var i = 0; i < 20; i++) {
var entry = json.feed.entry[i];
var ctlink;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
ctlink = entry.link[k].href;
break;
}
}
ctlink = ctlink.replace("#", "#comment-");
var ptlink = ctlink.split("#");
ptlink = ptlink[0];
var txtlink = ptlink.split("/");
txtlink = txtlink[5];
txtlink = txtlink.split(".html");
txtlink = txtlink[0];
var pttitle = txtlink.replace(/-/g," ");
pttitle = pttitle.link(ptlink);
if ("content" in entry) {
var comment = entry.content.$t;}
else
if ("summary" in entry) {
var comment = entry.summary.$t;}
else var comment = "";
var re = /<\S[^>]*>/g;
comment = comment.replace(re, "");
document.write('<li style="text-align:left">');
document.write('<a href="' + ctlink + '">' + entry.author[0].name.$t + '</a>');
document.write(' on ' + pttitle);
document.write('<br>');
if (comment.length < 150) {
document.write(comment + '...<a href="' + ctlink + '"> (more)</a><br><br>');
}
else
{
comment = comment.substring(0, 150);
var quoteEnd = comment.lastIndexOf(" ");
comment = comment.substring(0, quoteEnd);
document.write(comment + '...<a href="' + ctlink + '"> (more)</a><br><br>');
}
}
document.write('</li>');
}
</script>
<script src="YOUR BLOG URLfeeds/comments/default?alt=json-in-script&callback=showrecentcomments">
</script></ul>
Note: Make sure you replace YOUR BLOG URL with the URL of your blog like http://yourname.blogspot.com/ and you can also change the no. of comments to display, currently it will display 20 comments but you can change it by changing 20 from the 3rd line of this code.
4- Save and done.
5- How to add a simple translation widget in your sidebar?
We can add a Google Translation Widget in our blog to help visitors easily translate content in their language.
1- Log in to Blogger | Dashboard | Layout | Page Elements and on your sidebar click Add a Gadget link.
2- A new window will pop-up, scroll down and select HTML/JavaScript as your new widget.
3- In the Title field type any title and in the Content field paste the following code:
4- Save and see the translation widget in your sidebar.
1- Log in to Blogger | Dashboard | Layout | Page Elements and on your sidebar click Add a Gadget link.
2- A new window will pop-up, scroll down and select HTML/JavaScript as your new widget.
3- In the Title field type any title and in the Content field paste the following code:
<script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/translatemypage.xml&up_source_language=en&w=160&h=60&title=&border=&output=js"></script>
4- Save and see the translation widget in your sidebar.
No comments:
Post a Comment