How to Hide any HTML Javascript Widget in Blogger / Blogspot

Hiding HTML Javascript Widget in Blogger or Blogspot

Very often we come across a situation in which we want some of  our widgets to be hidden. Removing them from our blog isn't a solution and that's why we need to hide them in such a way that they will be active and working. How exactly you can hide the widget ?

Lot of blogs use feedjit or flagcounters and not everyone wants to share their keywords with competitors. So what will be the best way to hide such javascript widget ? Here's quick trick.

You just need to add line of code around your existing code so nobody will be able to see it.

<div style="height:0;width:0;overflow:hidden;"> Your HTML/javascript script here</div>

Let's understand this code. You are putting your html code in a new div and setting property for it.
height = 0 - sets the height to zero
width = 0 - width the height to zero
and last overflow = hidden hide the if the dive is overlapping over another div.

Pretty simple and useful huh ? 

[Read more]

Blogger - Add hovering effect on images using opacity

Blogger -Add hovering effect on images using opacity

Have you wondered some of your favorite blogs show some hovering effects? One of the great ways to add spice to your blog is adding opacity to post images. In this post we will see how do we add opacity to your blog’s images so that they will change when you hover your mouse over the images.

sample image- Steve jobs

[Read more]

Blogger adds Permalink feature In New interface For Better SEO

Blogger adds Permalink Feature in new blogging interface

Blogger's SEO mission Continues  - Rolls Out Permalink Custom Url feature

Blogger has been consistently adding new features to promote itself as the SEO friendly platform. In past few months, After adding Meta search description tag for each post, now another important feature coming up is Custom Permalink.

For those who don't know permalink, it is short of permanent link. You can see permalink in address bar of your browser. For example.

http://www.blogshippo.com/p/parse-adsense-code.html  is a permalink.

SEO- How Important is permalink

As per the seo experts, Permalink is important for your site in terms of seo. It is advisable to have keywords in your permalink & it helps boosting your ranking in serps. As per Google, your permalinks are an integral part of a search engine user’s decision making process.

Google cares for Users
Google cares about user experience & cares what they see. Permalinks appear as part of your search code on Google’s search results pages along with your page title and a description.

You can understand it better from the snapshot added here about one of my pages. You can see the words searched  in google  (Parse adsense code)  are highlighted & you can see them in peramlink which helps my page to rank better. People are likely to visit sites which have meaningful permalinks & that's why you have to have a meaningful permalink.

Blogger's New Feature- Permalink

From 28th June 2012, we observed new added option called as permalinks in blogger's interface. Before this feature was introduced, blogger used to allow title of just 39 characters. Now it allows bigger text to be added as permalink.

You can find this option on right sidebar blogger's new interface.

Permalink- Better Blogger SEO

There are 2 options, you can either choose default automatic url which creates url for you automatically. But it has limitation & takes only 39 characters including spaces. Now Choose Custom permalink & add bigger title for your post. Do not forget to use hyphens instead of space, else it will not accept your custom permalink.

Please follow these rules for better Blogger Permalink SEO

1. Do not use more than 90 characters. Using more than that might be considered as spamming search engine.
2. Add important keywords about your post
3. Make sure your Meta description does contain same keywords
4. Do not add words like in,to,the in Custom permalink as Google doesn't give importance to such words & omits them.

[Read more]

Change your Blogspot domain to custom domain using bigrock

How can you buy & change the blogspot to .com, .org. in

Change your Blogger / Blogspot to .com using Bigrock.in

I have been blogging using the free blogspot domain from last many years. After getting lot of suggestions, i decided to move to my own custom domain. I finally moved from Blogger/ Blogspot to .com domain in april, 2012.

I bought my domain from bigrock.in which is great place to buy a domain name. It was fast quick & it started redirecting in few minutes. My friends has told me that it might take 6 hours -24 hours to redirect properly but surprisingly it started redirection in just 5 minutes.

Bigrock provides domain name in very cheap rates like
.in domain - $2
.org domain -$ 6
.com domain - $10
.co domain - $20

It comes with free services like

• 2 Email Accounts - you@your-domain-name.com
• Domain Forwarding
• Privacy Protection *
• URL Masking
• DNS Management
• Domain Theft Protection
• Bulk Tools
• Easy-to-use Control Panel
• 24/7 Local Support

Steps to Set up your domain name

1. Buy a domain on Bigrock.in & log in to you control panel.
2. Please use Coupon code justjokes.in to get 10% discount.
3. Please Click on Domains (from navigation menu bar) and then click on List All Orders
4. Select the domain from the List
5. Please Click on the DNS which can be found on the top navigation menu bar and then on Manage DNS.
6. Click on CNAME Records and then on ADD CNAME RECORD
7. We are going to add 2 Cname records, one for "http://blogshippo.com" & another for ""http://www.blogshippo.com. This helps when someone forgets to add 'www' prefix before the name of the website.
8. How to add CNAME Record : for "http://www.blogshippo.com"
   For Host Name type "www"
   For Value type in "ghs.google.com" (within the space provided for typing in a fully qualified domain name) and then click on Add Record and you record would be saved.
9. How to add CNAME Record :for "http://blogshippo.com"
   Please Again click on Add CNAME record.
   For Host Name enter nothing
   For Value type "ghs.google.com" and click on Add Record
10. You are done with cname DNS settings, now go to www.draft.blogger.com
11. Please click on settings and then go to publishing. Next hit the "switch to custom domain" and then on "advanced settings" tab.Here enter your domain with www prefix as http://www.blogshippo.com and hit the save button.
12.  Its done, Just be patient & check when your site redirects properly.

Note:- For few minutes, it will show redirect notification. Don't worry, it will vanish after some time. Your all links with blogspot domain will be redirected to the .com domain. for ex. http://www.blogshippo.blogspot.com/p/about-me.html  will be redirected to the http://www.blogshippo.com/p/about-me.html

[Read more]

Best Blogger Plugins & Widgets tools for Newbie Bloggers

Searching for Blogger Plugins & widgets, Check out the list of best widgets for blogger

Best Blogger Plugins or Must have Blogger Widgets

Blogger has lot of inbuilt widgets to make blogging experience better but there are some third party Blogger widgets which are really useful & not only they make your blog's visual appearance better they even make it much more reader friendly.

It is the list of must have Blogger Plugins.

1. Blogger Visitors Statistic Tools

Feedjit : real time tracking

it is the easiest tool to keep an eye on your blog's visitor. It tells you about the

• Location of visitor
• Source of the visite (direct/ search engine/ any site)
• Browser of the visitor

Statcounter or Hitstats

If you need in depth log of visitors , you can use free version of statcounter & hitstats. Statcounter tells you about source, popular pages, visit length, bounce rate, exit pages. They maintain logs for 3 days.

2. Social networking Sharing Widgets

There are around 400 sharing sites which allows you to share your site. There are hundread of sites which offer sharing widgets. I prefer using just
Facebook, twitter, Stumble Upon, Digg, Pinterest , Google Plus .
Because they are most used social sites in the world.
Refer: How to add Facebook ,Twitter,Google plus and stumbleupon buttons to your blog

3.Related Post Plugin for blogger

Linkwithin / Outbrain

Related posts are placed at the bottom of the post which allows visitor to have a look at the other useful articles present on your site. It increases you pageviews & decreases bounce rate.

4. Alexa Plug in for Blogger

In simple words, Alexa tells you global ranking of your site. Alexa is important if you want to get some official ranking for your site. Alexa ranking depends on various factors such as back links, traffic.

5. Facebook recommended Posts

If you have added facebook like box then this tools shows popular posts depending on the number of facebook likes. It  can help in helping your bounce rates.

[Read more]

Check your site's Spelling Mistakes Online using RSS Feed

Blogger- Wordpress online tool to check your site's spelling mistakes

Blogger-Check Spelling Mistakes of your Blog

I have a bad habit of making spelling mistakes while writing my blog posts. New advanced blogger interface is not very good in finding those spelling mistakes. I was searching for a online tool which will scan my entire blog to detect spelling mistakes.

There are some paid services too but paying for detecting your spelling mistakes is not worth at all.Opening every post & scanning it manually is  another way of to do it. But, when you have got hundred of posts to scan, you really need some automated process to do it.

Word press has special plug ins to do the spell check so WP users really don't need to worry. But There is no special tool for blogger to scan the posts for spelling mistakes.


Finally my search ended with  Respelt.  It is great tool which can be used to detect spelling mistakes.

Let me tell you how it works.It has 3 options to detect spelling mistakes on your website.

How to check my Blog's spelling Mistakes

1. Submit a  paragraph

2. Submit a post url

3. Submit Rss feed url

The third option is really can save our valuable time. You just need too paste RSS feed url in & hit 'check feed'.

For any blogger, blog Rss feed can be accessed by

http://yourblogsname.blogspot.com/rss.xml.


It will display result showing all the spelling mistakes on any post. Click on 'Go to Page' to visit particular page. Find the spelling errors & correct them using this free online tool.

[Read more]

Blogger adds 'rel=nofollow' Attribute Function in adding Link to Post

Blogger ads 'rel=nofollow' option for Blogspot users

Google blogger team is constantly working on making new updates on blogger interface & the latest functionality they have added is new checkbox to add  'rel=nofollow' option in hyper linking. I noticed this cange today & decided to write about it to explain the use of this 'rel=nofollow' attribute.

Many of us are not aware that importance of link building. If you have good no. of back links you will ranked high in google. Any link with no rel attribute will be considered as 'rel=follow' which tells search engine bots that you are linking to particular site which is great way to give give credits to its author.

But if you don't want to link to particular site & still want uses to know the url then add rel=nofollow' attribute. This will tell search engine bots that they are not suppose to index the link which you have used.

How to use in Blogger

1. Open Blogger interface
2. Click on add link
3. Check the Add 'rel=nofollow'  check box
4. Done.

[Read more]

How to Disable Copy Paste or text selection from your Blog

How to disable Control  C Copy pasting on Blogger - JavaScript code Disable text selection

Recently some of my posts were copied by 2 bloggers & it took me some time to realize that these copies posts were ranked above my posts in Google & it was affecting my traffic. I somehow found that & sent them a warning to delete the copies post. That made me think about adding some barriers to my blogs so that nobody will be able to steal my content easily.

Disabling control c or Copy pasting is good option which makes quite tough to copy any content. Please keep in mind that keeping your content 100% secure is impossible but using these methods will make sure that copying content from your blog will not  be easy for layman.

You need add few lines of code to make it happen.

There are 2 ways to do this
1. Using javascript code
2. Using CSS

How to disable text selection using Css

1. Blogger >> Edit HTML
2. Control + F & search "body {" tag
3. add following code aftre body {

-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;

4. Save the template.

[Read more]

How to Edit Blogger Template Blogger in Draft

Tutorial to edit the blogger html code

How do i Edit Blogger Template code

i. Go to Blogger's New Interface at www.draft.blogger.com
ii. Select the blog and click on the downward arrow shown in the image.

iii. Select Template Refer Image

iv.  You can see Customize and Edit HTML option.
      Choose edit HTML.

  
v.  Check or uncheck the check box  as per your requirements. Checking the check box will start showing code present inside individual widgets too.

[Read more]