Sunday, February 28, 2016

How To Add "On-hover" Share Buttons To Blogger Images

image share buttons for blogger

Socializing a blog is the most efficient way to get a reach of people instantly so making a blog social media friendly is very important which lets people engaged with your blog to share your articles with others. Making a site social media friendly needs addition of social media buttons so its really important to install social media buttons in sites especially sites which have content that is readable.
Although social media buttons are installed in every site/blog below articles or above articles but advanced sharing tools aren't common. Advanced sharing tools means sharing buttons in each and every thing such as images.

Images not only put interest in boring articles but also play a major role in bringing traffic from search engines and social networks. So installing social media share buttons in images to make them shareable is very effective to get more traffic from search engines and social networks as most of people follow images to reach its source.

So i brought you "on-hover share buttons" which appear when mouse is hovered on an image. It is very similar to Pinterest on hover "pin it" button. But that is just a single button so i brought you more buttons which show on hovering an image. It will make your images shareable as well as make your blog design impressive and will increase your traffic too as people will reach your articles by following images, these buttons will not share only images but also source link of images so you will get more reach to your articles.

These sharing buttons are powered by addthis. So credits goes to addthis.

How To Add On-Hover Share Buttons To Images In Blogger?

Follow below steps to add share buttons to your blog images:

Step 1: Go to Addthis and login to your account, if you don't have account register an account.

Step 2: Click on Tools and navigate to Share buttons.



Step 3: Activate Image sharing buttons.


Step 4: Make changes according to your needs, you can make following changes(customizations):

  • Position: You can choose position of your share buttons on your images.

how to change position of share buttons in images addthis
  • Shape: You can change shape of your buttons, 3 shapes are available.

how to change shape of share buttons in images addthis
  • Services and number of buttons: You can choose which buttons should appear on hovering an image and also how many buttons should appear. Max allowed buttons are 4.

how to add share buttons in images addthis
Step 5: After customizing your buttons, click on activate button and you are done!

Follow Below Steps Only If You Haven't Inserted Addthis Code In Your Blog !

  For New Addthis Users Only!  

Step 6: Click on  GET THE CODE  in the menu on the top.

how to add image share buttons in blogger

Step 7: Copy the Addthis code as shown in below image.

how to add image share buttons in blogger posts

Step 8: Go to blogger dashboard, navigate to template and click on Edit Html.

Step 9: Search for <head> and just below it paste the copied code.

Step 10: Click on save template.

Wait for 3-5 min and hover an image. You will be able to see share buttons, you can change position of your buttons and their shape by logging in to your Addthis account and by clicking on setup image share buttons as shown in step 4 earlier.

I hope you like this post. Check out more Addthis tools and read tutorials about them by searching 101Helper.

Thanks for reading this post, if you have any difficulty please let me know!

Search Tags: how to add share buttons to images in blogger,wordpress,website,blogs, on-hover share buttons in images in blogger,share buttons on hover in images,social media buttons blogger,how to use addthis in blogger.

Thursday, February 25, 2016

How To Index Blogger Posts Faster

How To Index Blogger Posts Faster

Every new blogger want to increase blog traffic fast, for this you need to index your blog fast.Indexing a new blog can take two weeks or more normally but we can fasten this process by simple tricks.Actually this process include two steps.In first step google bot collect information of your posts and add it in search index box.Once your posts will index google bot start crawling your blog.

Google bot is very busy because billions of people update their blog daily and even hourly and it can not index all of them simultaneously but today i will show you how to speed up this process.

How Google And Other search engines finds your blog?

You have to submit your blog or site's sitemap to webmaster tools to tell search engines that you have a site or blog and you want it to index your blog and its content. So after submitting sitemap to search engines, they crawl your blog or site and index its pages which are allowed to be indexed


Submit sitemap:


Sitemap is very important thing, it provide more information to Google and other search engine site crawlers that are bots to crawl and index your blog. It is a kind of notification to search engines about already publish post on your blog. When a sitemap is submitted to search engine it starts showing only submitted posts.


Posts You Might Need To Read:
  1. How To Submit Blogger Sitemap To Google
  2. How To Submit Blogger Sitemap To Yandex
  3. How To Submit Blogger Sitemap To Bing
Ping your blog:

Actually many newbies do not know about blogger seo and how search engine works and hence fails to get traffic. Pinging your blog tell search engine that your blog is updated and it helps to index your blog fast. You can ping your blog daily there is no limit but it is recommended to ping when you update your blog with fresh content.


You can ping your blog at https://pingomatic.com/

Fetch as google:


Use "Fetch As Google" in Google webmaster tools and Bing webmaster tools
 to submit your new posts and exclude those which you don't want to be indexed. You can find this tool in Google webmasters tools and Bing webmaster tools, I am not sure about Yandex. It will help to index your posts quickly.

Share your content:

Also share your new posts on social media. It also helps you to get targeted traffic, pining posts tp pinterest or making a video related to post and give related link in the description will bring you targeted traffic as well as boost indexing process. A blog which have all posts shared more on social media is considered as an active blog and crawling of new posts is faster than other blogs.


Submit blog to directories:


Submitting your blog to directories is very beneficial in indexing a new blog. There are paid as well as free directories available online. Dmoz is one of the very popular, human edited directory and its free, you can submit your blog to it and find other directories on Google!


Try out these tips, once your blog is indexed you will see the difference in your traffic. Do not rush and keep patience.



Search tags: how to index blog posts fast,how to submit blog to google, bing, yandex, how to boost traffic website,how to submit posts to search engines fast,101 helper blogger tutorials,seo tips 101helper

Monday, February 15, 2016

How To Stop Country-Specific Redircetion In Blogger

stop country specific redirection in blogger - 101helper

Google often updates blogger and always adds something new, which is sometimes good and sometimes bad, for example recently Google added "Featured posts widget" in blogger that many people liked and also added HTTPS feature that lets you enable HTTPS so browsers can consider your custom domain safe and secure. But some updates in blogger aren't good and one of them is country-specific redirection of blogspot e.g if you open 101Helper in India you will be redirected to 101helper.blogspot.in similarly in UK it will be redirected to 101helper.blogspot.co.uk which affects your blog in following ways:

5 Reasons To Stop Country Specific Redirection In Blogger:

1 - Affects On Performance: The first affect of country-specific redirection is on site performance, it slows down your blog because it takes time to redirect to country specific domain e.g in, fr, jp, uk, id etc

2 - Ads And Gadgets: Some ads are also affected by specific country redirection for example Revenuehits ads disappear when blogspot blog is redirect to a country's specific domain it may also happen in case of Adsense and your earnings can decrease. Another problem is some gadgets like web page translator stops working when a blog is redirected, it may happen with other gadgets too.

3 - Seo: Your backlinks gets divided because of different domains so you need to do more efforts to create backlinks for each country e.g blogspot.in backlinks, blogspot.co.uk backlinks etc. So its better to redirect your blog to top level domain that is dot com so you don't need extra work and efforts, you just have to concentrate on dot com.

4 - Socail Media Shares: Just like backlinks are divided because of country-specific redirection, social media shares are also affected because when a post of your blog is shared on......for example 10 times on Facebook from uk domain(yourblog.blogspot.co.uk) now when you visit yourblog.blogspot.com you will see zero Facebook shares so post shares are also divided.

5 - Crawling And Indexing: Some webmaster tools like Yandex show an error while indexing your blog, after submitting sitemap yandex show mirror site detected error it could be blogspot.in or blogspot.co.uk or other so your site isn't indexed.

So these errors emphasize to redirect all domains to the top level domain(.com). It will solve ads and gadgets loading problem, seo problem, crawling and indexing problems and improve your blog performance.

How To Set Auto Redirection From Country-Specific Redircetion To .COM In Blogger?

Follow below steps to set auto redirection from country specific domains to top level(.com) domain.

Step 1: Go to blogger dashboard.

Step 2: Navigate to template and click on Edit Html.

Step 3: Search for </head>.
<script type='text/javascript'>
var blog = document.location.href.toLowerCase();
if (!blog.match(/\.blogspot\.com/)) {
blog = blog.replace(/\.blogspot\..*?\//, &quot;.blogspot.com/ncr/&quot;);
window.location.replace(blog);
}
</script>

how to stop country specific redirection in blogger

Step 4: Just above it paste the below code.

Step 5: Click on save and you are done successfully.

I hope this post was helpful to you, if not please let us know by leaving a comment below. Follow ans subscribe for more blogging tutorials. Don't forget to share this post with others. Keep visiting 101Helper :)

Search Tags: How To Stop Country-Specific Redircetion In Blogger,5 reasons to stop country specific redirection in blogger,how to boost traffic,increase backlinks,get social media shares,improve site ranking.

Thursday, February 4, 2016

How To Use Google Fonts In Blogger Blogs

how to use custom google web fonts in blogger

Font is one of the things that makes a site look great. A font gives your writing skills a style which impress your readers therefore choosing best fonts for site is really important. Especially in-case of fashion blogs font style is very important. Blogger has many built-in fonts but these are too common because everyone is using one or more of them, for example for titles they use a different font and for post body they use a different font so to a unique font for your blog you have to call it from some external source and then apply it in your blog. So this post is to teach you how to use custom fonts in blogger blogs. I will use Google fonts but you can use fonts from other websites also by following steps below. I am using Google fonts below they don't have any negative impact on page loading speed.


Follow below mentioned steps to use Google fonts in your blog.

Step 1: Go to Google Fonts

Step 2: Search for a font in Google fonts and click on the quick use icon as shown in below image(I am choosing Kimberly Geswein).

how to use google fonts in blogger blogs

Step 3: Scroll down to step 3 where you will see a code as shown in below image.

google styish fonts for blogger

Step 4: Copy the code given in the box.

Step 5: Go to blogger dashboard > template and click on Edit Html.

how to edit html in blogger

Step 6: Below <head> paste the code you just copied.

how to use google fonts in blogger blogs 101helper

Note: Make sure to close the tag of code you just pasted like this(highlighted with yellow color!):

<link href='https://fonts.googleapis.com/css?family=Shadows+Into+Light' rel='stylesheet' type='text/css'  / >

Step 7: Search for below piece of code in your template by using Ctrl+F.

<Group description="Page Text" selector="body">

You will find some codes similar to this below the above piece of code:

<Variable name="body.font" description="Font" type="font"
         default="normal normal 12px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 12px Yanone Kaffeesatz"/>
     <Variable name="body.text.color" description="Text Color" type="color" default="#222222" value="#666666"/>

Now all you have to do is to find value="........" in the codes you found and replace the font name with the name of the font which you want to apply to your page text. Make sure to use accurate name otherwise it will not work. You can find the accurate name of your font on the Google font page from where you copied the font code as shown in below image:

use google fonts in blogger

Step 8: Click on save template and you are done.

CSS Code For Different Titles:

After following above part of this post you might have default font for your blog title, post titles and gadgets which could only be modified with Css so following are the css codes for different titles(blog title,post titles,gadgets) which are to be included above ]]></b:skin> in your template.

For Post Titles:

.post-title.entry-title {font-family:Your font name;}

For Blog Title:

.Header h1 {font-family:Your font name;}

For Gadgets Title:

div.widget > h2, div.widget h2.title {font-family:Your font name;}

Replace Your font name with your font name which you have imported from Google

I hope you found this post helpful, if not ask me in comments. Follow and subscribe for latest post news. Thanks for visiting 101Helper. Keep visiting us.

Search Tags: Google fonts in blogger,stylish fonts blogger, how to add web fonts to blogger, use custom fonts blogspot, upload stylish fonts to blogger blogs,how to change font in blogger,101 helper blogging tutorials,101helper