Recent posts blogger widget

There is a guide to add recent posts on your blogger sidebar. It is very easy. We will describe two ways to implement recent posts.

Recent posts can be added to blogger (blogspot) with help of Feed gadget. This is method I prefer because it less slow down load time of your blog then a method with Recent Posts widget. Drawback is that you a limited to only five recent posts.

Second method with a Recent Posts gadget is more powerful. Recent Posts gadget show the recent posts with thumbnails and summaries. Drawback of this method is longer load time of your blog.

On this blog you can find more blogger tips like this.

Recent posts with a Feed gadget

1. Go to Layout


2. Click on Add Gadget
   
   
   


3. Choose Feed gadget
   
   
   


4. Enter feed url
   
   
   • to find your blog feed url click on "Subscribe to this page" icon and copy & paste feed url
   
   
   • or you can try with url of your blog


5. Enter title, chose how many items will be shown (5 is limit) and chose do you want display Post dates and Post authors
   
   
   


6. After click on Save you have Recent posts list on your blogger blog with five latest posts

Recent posts gadget

1. Go to Layout


2. Click on Add Gadget
   
   
   


3. In search text box type "Recent posts"
   
   
   


4. Choose Recent posts widget with thumbnails


5. Configure Recent posts gadget


• choose title


• determine height


• blog url


• number of posts to display


• summary length...






6. click Save and you have Recent posts list with thumbnails on your blog

Increase blogger traffic - change title

Title is very important for web traffic. Good title attract more visitors and it is significant part of SEO. To gain more traffic your title should have attractive keywords, should not be too long and important words should come first (keyword prominence).

In this article you will find free guide how to increase blog traffic with title change of each page of your blogger explained step by step. With title change explained in this article my blog have visit growth more than 40%. Let's talk about how blogspot post titles are generated. In blogger post blog title come first followed by post title.

Example 1:

[Blog title]: [Post title]

Useful and interesting web sites: Add javascript in blogspot (blogger) post

Blog title - Useful and interesting web sites

Post title - Add javascript in blogspot (blogger) post


In SEO (Search Engine Optimization) world, title like this is not effective.
Why?
Because keyword prominence rule say : the closer a word is to the front of the analyzed text area, the more relevant or important it is.
In our example keywords in blog title (which are not linked with post) decrease relevancy of keywords of post title.

We will have better SEO effect with title in which post title come first.

Example 2:

[Post title]: [Blog title]

Add javascript in blogspot (blogger) post: Useful and interesting web sites



In second case search terms connected to post title like "add", "javascript", "blogspot" will have better chance to be in top google results then in first case.

How to change title for each post in blogger

This guide ensures keywords in your post titles are discovered more easily. To do this you will have to change template. Follow this blogspot tutorial to change your title in [POST TITLE: BLOG TITLE] format and achieve better google search result page ranking for your posts:

• go to Layout --> Edit HTML
  
  



• in Edit Template box find this code:
  

  <title><data:blog.pageTitle/></title>

  
  


• and replace with this code
  

  
      <b:if cond='data:blog.pageType == &quot;item&quot;'>
      <title><data:blog.pageName/> :
      <data:blog.title/></title>
      <b:else/>
      <title><data:blog.pageTitle/></title>
      </b:if>

  
  


• it is good idea to make backup of blogspot template before you click Save Template, new code tell that if visitor load certain post page title should be in [POST TITLE]: [BLOG TITLE] format, else title should be in [BLOG TITLE] format

Change title effect on my blog visits

Visits to my blog after change title is done was increased by more than 40% !!! Here is picture that illustrate increase of my blog traffic.

Green line display visits before change title is done and blue line is after change title is done.

It is important to say that after you make this change you should wait some time (usually few day or in worse scenario few weeks) while google index your blog pages.

To check if google re-index your pages :

• go to Google page


• type site:[BLOG-NAME] (site:interestingwebs.blogspot.com)


• click search


• now you can see if your posts are in Post-title format

On the end, my experience with this method is really good, so if your blog traffic significantly grow after you use tips from this article I would ask you to put a link or two to my blog and follow my blog.

If you are interested in my real blogging experience visit: Increase blog adsense revenue real case scenario.

Javascript in external file

Javascript can placed in external files. Of course JavaScript can be added to HTML files too, but in some situations it is better to include Javascript in external files. In this article you will find why to include Javascript in external files, how to put JavaScript in external file, one simple example and instructions for blogger users to use external Javascript.

Why people place Javascript in external files

• to use the same Javascript on many pages and don't want to rewrite Javascript code on every page, it is simpler to have one Javascript function code in one place (one .js file) then in many HTML files


• to get more organized and easiest to maintain code


• HTML page is smaller in size, making it load faster


• separates the JavaScript from the HTML to get better Search Engine Optimization (SEO), Javascript will not get higher PageRank


• they are forced to move js off the page (for example blogger users have problem to use javascript in blogger editor, or some similar restrictions)

How to add Javascript in external file

• First, you must make .js file. File must have extension .js


• write Javascript function (or functions) in file and save file
  
  Sample TestJs.js
  
  

  function Hello()
  {
      alert("Hello");
  }



• now we can make a call to javascript function from HTML file, let's assume that the .js file is in the same directory as the HTML file in which we are going to call javascript function
  
  Sample HTML file : TestCall.html
  
  

  <html>
  <head>
  <script src="TestJs.js" type="text/javascript">
  </script>
  </head>
  <body>
  <input type="button" onclick="Hello()" value="Hello!">
  </body>
  </html>



• that is it, if those two file are in same directory when user click on Hello button javascript Hello function (which is in js file) will be called from HTML file and will be executed

External Javascript in blogger post

Demonstration:



To use javascript inside blogger post you have follow next steps:

• save javascript function in js file (like described in previous chapter)
  
  Sample TestJs.js
  
  

  function Hello()
  {
      alert("Hello");
  }



• on blogspot (blogger) there is no option to upload js file (or file of any other type) so you need to find where to upload javascript file


• you can find instructions how to upload javascript file by following this link, take a look at Google Groups chapter


• in blogger post add code to use remote javascript
  
  Use this:
  

  <script src="[URL OF AN EXTERNAL SCRIPT]" type="text/javascript"></script>

  
  Example for uploaded javascript file on Google Groups:
  

  <script src="http://everything-about-blogging.googlegroups.com/web/TestJs.js?hl=en&gda=bUe-djsAAAATLYFRxG7MFqGWBWh2VvtrqIEbF7jzfKsOTBbDD3S6g8oRXZrtFiBTuJ69H91AzQAGRdr3QrylPkw2aRbXD_gF&gsc=CJY8-AsAAABni9lzDVHuoDw_bqXODZJz" type="text/javascript"></script>

  
  


• add code in blogger post that call JavaScript function
  

  <input type="button" onclick="Hello()" value="Hello!">

  
  


• now you have blogger post which call javascript function from external file

How to create online survey

Believe or not, making survey on internet is very easy. Here you will find brief step by step tutorial how to create your own web survey (poll) with help of Google docs forms. After online survey is make and published visitors can fill poll and their responses are automatically added to your online spreadsheet. Google docs are really useful and easy to use tool. Here you can see example of online survey.

Sample Google Docs online survey:



Creating online survey

• First go to Google docs and log in


• to successfully log in you must have Google Account


• in case you do not have Google Account go to Google Accounts


• Go to menu "New" and click on "Form"
  
  
  


• In the form template that opens, you can add any questions and options you'd like


• Enter title and description


• Enter Question title


• Choose question type

Question type can be:


• Text


• Paragraph text


• Multiple Choice
  
  
  
  


• Checkboxes


• Choose from a list


• Scale




• Choose whether or not to make it a required question


• Now you can add new question, (to get a new question, click the “Add Question” button at the top left of the page) or save and publish your survey


• You can change Theme if you like


• You can email the form (survey) to people, which allows them to fill it out and submit it right from their email, embed survey into your site or blog (it didn't work on my blog) or place a link to survey on your site


• You can review responses as:


• summary
  
  
  


• spreadsheet
  
  
  

You can use summary to display results or process data in spreadsheet. It is your choice. I find this Google tool very impressive and user friendly. My recommendation to everyone is to take a look at Google Docs and explore their functionality.

Step by step guide to create sample online survey:

• In Google Docs go to menu "New" and click on "Form"


• Enter title "Test survey"


• Enter description "This survey is for testing and demonstrating purpose"


• Enter Question title "1. Enter your name?"


• Click on Add question button and choose "Paragraph text"


• Enter Question title "2. Please tell us your opinion about this tutorial"


• Click on Add question button and choose "Multiple choice"


• Enter Question title "3. Do you find this tutorial useful?"


• In Option 1 enter "Yes"


• In Option 2 enter "No"


• Click on Done


• Click Save

HTML link code tips

In this article you will learn secrets of linking and few HTML link code tips. Also you can find ways (with HTML code samples) to link more efficiently from your site.

Here are questions on which this post will try to answer :

• How to improve PageRank of pages on your site with proper linking?


• How to make links on other web sites and not lose visitors?


• How to stay on same page and navigate (scroll up and down) on-page links?


• How to make email hyperlink?

Simple HTML link code with tag <a>

To create simple HTML link use this code:

<a href="http://interestingwebs.blogspot.com">Link to my blog</a>

href attribute - specifies the destination of a link

Text between <a> and </a> tag - is a text that visitor see on page


Improve your PageRank with nofollow attribute

Sample of HTML link code to implement NoFollow attribute :

<a rel="nofollow" href="http://interestingwebs.blogspot.com">Link to my blog</a>

The PageRank of a particular page is roughly based upon the quantity of incoming links as well as the PageRank of the pages providing the incoming links. To learn more about PageRank visit PageRank explained.

PageRank contribution - Pagerank of page on which is incoming link (backlink) is divided by the number of outbound links (links to other pages) on that page, more outbound links on page means lower PageRank contribution to linked page.
We can tell that every page have 100% of vote's right. If incoming link page have one link then linked page get 100% vote's right of that page.
But if incoming link page links to two different pages then every of two linked page will get 50% vote's right (Pagerank contribution) of incoming link page.

NoFollow attribute means that a hyperlink should not influence the link target's Page Ranking.

Example: for page A is better to have incoming link from page B which links only on page A (scenario 1) and get 100% of page B vote's right then from same page B which links on multiple pages and have only 33% of page B vote's right (scenario 2).
If page B have one link to page A and two NoFollow links then page A will get 100% of page's B vote's right (scenario 3).



You can get better PageRank if you link with NoFollow attribute on other sites, and save your PageRank contribution for pages of your sites and for partner sites.

Like in real life balance is important, if you are to skimpy people will not like you.

My advices is to use NoFollow attribute for:

• popular sites (like Google, they already have high PR and your link will not make difference )


• business sites


• old blogs that have not been updated more than a year

Do not use NoFollow attribute for:

• your own pages


• friend and partner pages


• cool pages


• blog pages - they need you PR contribution

Using target attribute to keep page open after clicking on link

To open link in a new window you can use attribute :

target="blank"

Sample:

<a target="_blank" href="http://interestingwebs.blogspot.com">Link to my blog</a>

This code open link in a new window, first window remains open.

Why to use target _blank :

• when visitor click on link to other site, page remain opened so visitor does not leave page


• so we can tell it keeps users on starting site


• some sources claim that it decreases bounce rate (visitors stays on site because page remain open and click on other pages of same site)

Why to not use target _blank:

• it is user-hostile - it should be up to the user to decide where the link should open up: in the same window, in a new window, or in a new tab (see The Top Ten Web Design Mistakes)


• when new window is opened visitor can't use Back button and they cannot return


• non experienced user can be confused with new opened windows


• I was take a quick look on top blogs (tehnorati) and find that in top 10 blogs only 2 blogs using new window (target="_blank")

Link to a location on same page

Demonstration:
Go to beginning of post

Sample code to navigate on same page:

<a name="GoToBegin">Beginning of post</a>


<a  href="#GoToBegin">Go to beginning of post</a>

When link "Go to beginning of post" is clicked "Beginning of post" is positioned.

How to make email hyperlink

Sample :

<a href="mailto:blogsrec@gmail.com?Subject=Test">
Send Mail</a>