Tuesday, 22 October 2013

How to do natural SEO on Blogger

Although many insist that blogs hosted on free servers, such as Blogger, are not ideal for getting your blog well-ranked, the truth is that a blog hosted by Blogger can be really fast and well positioned on the Internet if you are using the right SEO tools.

Now, given the latest updates from Google, the best would be hiring a specialized person. However, if you don't have the resources or you want to learn doing this job alone, you can choose to begin with the natural SEO.

Here are some tips to do natural SEO (Search Engine Optimization).

blogger seo

Natural SEO Techniques for Blogger

Pick a Good Domain

We must try having our keyword included in the domain name, and even if this may sacrifice our branding, we can use the redirection.

Create Value Added Content

Not only rewrite articles, or write like they would be intended for us. When writing our posts, we should consider our target audience, i.e., giving advices, tips, suggestions or guidance on specific topics and aside, use links, anchor text and key phrases.

The topic of the links is important

They should be of quality and while, it's no longer required to place five or ten links within the text of your website, now what truly matters, is to make the link relevant to the context.

Finally, the domain, in value-added content and a right use of the internal and external links, will prove to be useless if we don't try to update our blog constantly.

How often should you update your blog?

You don't have to do this on daily basis, even if this may be ideal as, this way, we could achieve a greater relevance in search engines. But don't forget about your blog either. Let's say, two or three times a week would be enough. What should not happen is updating only three times a week and doing nothing next week.

Keep in mind that search engines happen to pass daily on our blog in order to index our content.

I hope that you find these SEO tips useful and if you would like to receive more tutorials by email, subscribe for free to this blog, check out the facebook page or add the RSS feed.

Monday, 21 October 2013

How to Add a Recent Forum Topics Widget to Blogger

If you are using the Nabble forum in your blog is very likely that this gadget will interest you because, as the title suggests, it will display the lastest topics that have been published in your forum in a very similar manner to the recent comments gadget that works with the blog's feed.

nabble forum
If you want to add a list with the Recent Forum Topics then follow the steps below:

Go to your forum and look at the bottom where it says Feeds, click on that link and then two links of the Feed will appear (the first being the Topics only Feed and the other one is Topics and replies) - choose the one you want.
using nabble feeds to see latest forum topics

After this, log in to your Blogger Dashboard, go to Layout, click on Add a Gadget link, choose Feed from the gadgets list and paste the Feed URL you have selected inside the text box.

configure gadget feed in blogger

Click on Continue, and you only have to configure the parameters, then Save changes to see the results.

That's it! Enjoy :)

Add a forum on your Blogger blog with Nabble

Forum is a platform where visitors can interact with each other and discuss different hot topics. There you can add desired topics for getting comments and diverse suggestions on them. If you have a good traffic, then you can place questions on daily basis for the potential visitors to answer, thus your forum simultaneously converts itself into a huge frequently asked quesions section "FAQ". Forums will provide your visitors an open social atmosphere to express their useful ideas and share other's ideas.

In this brief tutorial, I have explained simple steps to add a forum to your Blogger or blogspot blog. So let's get started!

blogger forum, blogspot nabble forum

How to Create a Forum With Nabble


To implement a forum we will use Nabble, in my opinion, one of the best free options. We go to Nabble page and there, we will create an account (keep in mind that this account will be the moderator of the forum).
And once we have everything set (it also has a wide variety of customizing options), go to Options -> Application -> Change appearance:

nabble change appearance

There, we can also edit the CSS of the forum and other things...

Now we have to give the structure of a real forum, i.e. organizing it by categories. To do this click on the Options menu, select Application, then click Change application type:

nabble option change application type

Then choose the Forum category and save your changes.

To finish, we only have to create categories and for this go back to Options, this time select Structure and then choose Create a new sub-forum:
nabble create new sub-forum

Fill in the details of the category and that's it, you will have your forum running.

The rest are small details, like sort categories (Options > Structure > Manage sub-forums), customize your avatar and your signature (YourNickname > Account Settings), change permissions (Options > Users > Permissions), etc.

Now for integrating the newly created forum to your blog, you must go to Options - Embedding options and copy the javascript code.
nabble forum embedding options

Embed the forum in a Blogger page


Login to your Blogger Dashboard, select your blog, click the Pages link on the left sidebar and create a new Blank Page


Once there, get in the HTML mode.


Paste inside the empty box the code that we copied earlier, and if everything went well, we should see our brand new forum for our blog!

create a forum for blogger with nabble

I hope this tutorial was helpful to you and you will begin using this great service.

Top Commentators Widget with Avatars for Blogger

The commentators are a fundamental part of any blog, since they are the ones that give life to the blog, opening and replying to discussions which leads to more activity in the posts.
how to add top commenters widget to blogger

It is therefore very important to know which are the most active users of your blog, the users who leave more comments, and for this reason, today I present a great method to display a list with the top commentators.

The gadget will look something like this:

add top commentators widget to blogger

This Top Commentators gadget comes with user's avatar and is done with JavaScript.

How to Add the Top Commenters Gadget to Blogger


1. To add this gadget, you have to go to Layout, click on Add a Gadget link.

2. Select the HTML/JavaScript gadget and copy/paste within the empty box the following code:
<style type="text/css">
.top-commentators {
margin: 3px 0;
border-bottom: 1px dotted #ccc;
}
.avatar-top-commentators {
vertical-align:middle;
border-radius: 30px;
}
.top-commentators .commenter-link-name {
padding-left:0;
}
</style>
<script type="text/javascript">
var maxTopCommenters = 8; 
var minComments = 1;     
var numDays = 0;         
var excludeMe = true;    
var excludeUsers = ["Anonymous", "someotherusertoexclude"]; 
var maxUserNameLength = 42;
//
var txtTopLine = '<b>[#].</b> [image] [user] ([count])';
var txtNoTopCommenters = 'No top commentators at this time.';
var txtAnonymous = '';
//
var sizeAvatar = 33;
var cropAvatar = true;
//
var urlNoAvatar = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVI9JQU6Ama3nhEdTXk-iSXVCSPo-yQ_dzZqFW1v-4GB1E-Y64CVh1WgHma_kc1OiQWmlcEVx8-dQhTtuqTEZO88fYwej9iZki3wvDRaE-o18b6Tul3-HBTYk3QtbhLvr2Ps_NcUraSorz/s1600/avatar_blue_m_96.png" + sizeAvatar;
var urlAnoAvatar = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjar9048tK1IV3rA59vjdVrv6WOTUt3LE7el9y0B-ucM9XCjU3Ekv6H0QyRZlUEvp3F3KlBLxeuzGEUMQKIhePTiZpZej20S0PGVdEw-CG_VWBMfXO7srwAP2u9aJ6oar5F8sTlrzU8uxTJ/s1600/avatar1.png' + sizeAvatar;
var urlMyProfile = '';
var urlMyAvatar = '';
if(!Array.indexOf) {
 Array.prototype.indexOf=function(obj) {
  for(var i=0;i<this.length;i++) if(this[i]==obj) return i;
  return -1;
}}
function replaceTopCmtVars(text, item, position)
{
  if(!item || !item.author) return text;
  var author = item.author;
  var authorUri = "";
  if(author.uri && author.uri.$t != "")
    authorUri = author.uri.$t;
  var avaimg = urlAnoAvatar;
  var bloggerprofile = "http://www.blogger.com/profile/";
  if(author.gd$image && author.gd$image.src && authorUri.substr(0,bloggerprofile.length) == bloggerprofile)
    avaimg = author.gd$image.src;
  else {
    var parseurl = document.createElement('a');
    if(authorUri != "") {
      parseurl.href = authorUri;
      avaimg = 'http://www.google.com/s2/favicons?domain=' + parseurl.hostname;
    }
  }
  if(urlMyProfile != "" && authorUri == urlMyProfile && urlMyAvatar != "")
    avaimg = urlMyAvatar;
  if(avaimg == "http://img2.blogblog.com/img/b16-rounded.gif" && urlNoAvatar != "")
    avaimg = urlNoAvatar;
  var newsize="s"+sizeAvatar;
  avaimg = avaimg.replace(/\/s\d\d+-c\//, "/"+newsize+"-c/");
  if(cropAvatar) newsize+="-c";
  avaimg = avaimg.replace(/\/s\d\d+(-c){0,1}\//, "/"+newsize+"/");
  var authorName = author.name.$t;
  if(authorName == 'Anonymous' && txtAnonymous != '' && avaimg == urlAnoAvatar)
    authorName = txtAnonymous;
  var imgcode = '<img class="avatar-top-commentators" height="'+sizeAvatar+'" width="'+sizeAvatar+'" title="'+authorName+'" src="'+avaimg+'" />';
  if(authorUri!="") imgcode = '<a href="'+authorUri+'">'+imgcode+'</a>';
  if(maxUserNameLength > 3 && authorName.length > maxUserNameLength)
    authorName = authorName.substr(0, maxUserNameLength-3) + "...";
  var authorcode = authorName;
  if(authorUri!="") authorcode = '<a class="commenter-link-name" href="'+authorUri+'">'+authorcode+'</a>';
  text = text.replace('[user]', authorcode);
  text = text.replace('[image]', imgcode);
  text = text.replace('[#]', position);
  text = text.replace('[count]', item.count);
  return text;
}
var topcommenters = {};
var ndxbase = 1;
function showTopCommenters(json) {
  var one_day=1000*60*60*24;
  var today = new Date();
  if(urlMyProfile == "") {
    var elements = document.getElementsByTagName("*");
    var expr = /(^| )profile-link( |$)/;
    for(var i=0 ; i<elements.length ; i++)
      if(expr.test(elements[i].className)) {
        urlMyProfile = elements[i].href;
        break;
      }
  }
  if(json && json.feed && json.feed.entry && json.feed.entry.length) for(var i = 0 ; i < json.feed.entry.length ; i++ ) {
    var entry = json.feed.entry[i];
    if(numDays > 0) {
      var datePart = entry.published.$t.match(/\d+/g);
      var cmtDate = new Date(datePart[0],datePart[1]-1,datePart[2],datePart[3],datePart[4],datePart[5]);
   
      var days = Math.ceil((today.getTime()-cmtDate.getTime())/(one_day));
      if(days > numDays) break;
    }
    var authorUri = "";
    if(entry.author[0].uri && entry.author[0].uri.$t != "")
      authorUri = entry.author[0].uri.$t;
    if(excludeMe && authorUri != "" && authorUri == urlMyProfile)
      continue;
    var authorName = entry.author[0].name.$t;
    if(excludeUsers.indexOf(authorName) != -1)
      continue;
    var hash=entry.author[0].name.$t + "-" + authorUri;
    if(topcommenters[hash])
      topcommenters[hash].count++;
    else {
      var commenter = new Object();
      commenter.author = entry.author[0];
      commenter.count = 1;
      topcommenters[hash] = commenter;
    }
  }
  if(json && json.feed && json.feed.entry && json.feed.entry.length && json.feed.entry.length == 200) {
    ndxbase += 200;
    document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&start-index='+ndxbase+'&alt=json-in-script&callback=showTopCommenters"></'+'script>');
    return;
  }
  // convert object to array of tuples
  var tuplear = [];
  for(var key in topcommenters) tuplear.push([key, topcommenters[key]]);
  tuplear.sort(function(a, b) {
    if(b[1].count-a[1].count)
        return b[1].count-a[1].count;
    return (a[1].author.name.$t.toLowerCase() < b[1].author.name.$t.toLowerCase()) ? -1 : 1;
  });
  var realcount = 0;
  for(var i = 0; i < maxTopCommenters && i < tuplear.length ; i++) {
    var item = tuplear[i][1];
    if(item.count < minComments)
        break;
    document.write('<di'+'v class="top-commentators">');
    document.write(replaceTopCmtVars(txtTopLine, item, realcount+1));
    document.write('</d'+'iv>');
    realcount++;
  }
  if(!realcount)
    document.write(txtNoTopCommenters);
}
document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&alt=json-in-script&callback=showTopCommenters"></'+'script>');
</script>
3. Now you just have to save changes and you're done!

Configuration

- To modify the number of users displayed in the gadget, look for var maxTopCommenters = 8; and change 8 with any number you want.
- To change the avatar size of the commenters, look for var sizeAvatar = 33; and change number 33 with the number of pixels you want. - To hide your name or some other username, replace the someotherusertoexclude text between the quotes (to add more, add another comma after the text in red, then type the username you want to exclude between the quotes)

Sunday, 20 October 2013

Redirect Blogger 404 Error (Page Not Found) To Homepage

A 404 error page tells you and search engines that a page is not found by displaying a text similar to it "Sorry, the page you were looking for in this blog does not exist.". This may happen because you have changed your URLs over time, either removed a few pages when you overhauled your design or a visitor may have accidentally misspelled an URL inexistent in your blog, so it automatically redirects to the 404 error page (page not found).
how to redirect blogger 404 error to homepage
And probably this will not make a good impression on the greatest potential users of our blog. Before the user clicks the back button or close the window/browser's tab, thus leaving our site forever, we may want to redirect 404 error in Blogger to a page, where are chances that the visitor will continue reading our blog.
One of the most used methods is the "meta refresh" but the problem with this method is that it breaks navigation (doesn't allow to return back). In this case, the best method is by using Javascript about which I will go in detail below.

Redirect Blogger 404 Error with Javascript


Go to your Blogger dashboard, select your blog and then to Settings > Search preferences > Custom Page Not Found.

redirect 404 error page in blogger to homepage

Copy and paste the following code inside the empty box:
Sorry, the page you're looking for in this blog does not exist.
You will be redirected to homepage shortly.
<script type = "text/javascript">
BSPNF_redirect = setTimeout(function() {
location.pathname= "/"
}, 5000);
</script>
The message which is going to be displayed can be modified as you want. If you are willing to redirect your blog 404 error page to another page other than your home page, just replace pathname to href and / with the url of your page. And finally, the number 5000 which is the delay expressed in milliseconds, can be changed to other value if this is more convenient.

Next thing to do is to Save all changes made in this section and do a little test to check if the code works well. You can verify the 404 error page functionality by adding a custom text at the end of your blog address and after hitting Enter, you should see the error page followed by a redirection after 5 seconds. That's it!

4 Alternatives to Google AdWords

Many think that Google AdWords is the only tool dedicated and available to perform a study such as a keyword search, but it isn't so, today I refute this idea by collecting some alternatives that, although are not equal to Google AdWords, at least encourage us to make good keyword analysis for the SEO of our website.

alternatives to google adwords

Going back a bit, for those unfamiliar with the main features and tools of Google AdWords, we can find a very simple interface yet complete in every sense.

- AdWords appearance has changed, however there is a chance of returning to the old design;
- allows you to place a phrase or keyword, a web site and use the categories;
- for a better keywords search, you can apply filters such as location, language and add custom fields (competition, local or global monthly searches, CPC, Ad share, etc.);
- displays keyword ideas in columns with the amount of local and global monthly searches and approximate CPC;
- you can download keyword ideas, search results in a format to open with Excel.

Having recalled and refreshed the memory a little with the characteristics of AdWords, now it is time to learn about other options both free and paid.

Google AdWords Alternatives


Bing Webmaster Tools: Bing may not be the tool that we had first thought of, however it wants to provide the best conditions for studying keywords.


After we register, to access the tool, go to Diagnostics & Tools and click on the second option on the list: Keyword Research.

SEMRush: Other freemium alternative that displays a very complete report of a particular keyword or website. However, it has limitations and if you opt for a PRO recurring plan you need to pay a monthly membership from $69.95 per month.

Ubersuggest: This nice and simple online tool searches keywords suggestion as well as potential titles for an article. Personally, I recommend it 100%.

Keyword Eye: If you are looking to perform a keyword research on a particular region, Keyword Eye will be your help. It also has the option of requesting the display of search volume or AdWords competition and a full report of anchor text, keywords and domain.

At first it offers a free plan with limitations and to enjoy all other benefits, we have to pay $9.99 per month.

How to Add Google Analytics to Blogger

Google Analytics is a platform created with the purpose of helping us to track the number of visits and page views on our blog, which also uses several filters to check exactly from where the visitors are coming via standard or custom reports.

Google Analytics is the leading free tool that has a good relationship with the internet marketing and offers suggestions and improvements or benefits for our website.

As Analytics is part of the variety of Google tools like Blogger, many bloggers still don't know if it is possible to add the tracking code in Blogger. Implementing analytics in Blogger is very quick and easy, so you don't need to be experts or web developers. Here's a small guide for placing the Google Analytics tracking ID on our blog.

google analytics

Implementing Google Analytics on Blogger


1. Do you have a Google Analytics account? Then it's perfect. If you don't have one, please Register.
2. Within the account, we'll go to Admin and in the Property column, click the menu, then click Create new property, where we enter the information from the website.

create new property in google analytics

3. Click on "Get Tracking ID" and it will provide a box with a code, select and copy the code (CTRL + C).

get google analytics tracking id

4. Now let's go to our Blogger account.
5. Look for your blog and click on it, then go to Template > click the Edit HTML button and paste the code previously generated in Analytics before the </head> tag (CTRL + F in order to find it).

And this would be the entire procedure. Within about 24 hours, we shall see the first statistics of our blog in Google Analytics, otherwise check the following:

- Double check that the code has no spaces or characters.
- Doesn't have errors in the configuration
- There are no poor implementation of the filters.
- The Flash plugin is working or javascript is enabled.
- You will have minor issues if you are receiving visits from China (this conflict is not yet solved, according to Google).