Browsing "Older Posts"

Home » blogger

Top Blogger Alternatives Free Blogging Platform

If you are looking for a free blogging platform, then blogger best of all. It has many incredible features which make it a unique platform from others, like it has many professional templates which you can easily customize and you can use unlimited third-party professional template, you can add custom domain, high security, easy use and many other features. But if you are looking for a blogger alternative platform. In this post we try to tell you some best blogging platforms, these are free for blogging.

Top Blogger Alternatives Free Blogging Platform

Blogger Alternatives Free Blogging Platform

WordPress.com

This also best blogging platform and widely use and already many blogs created on it. Here you create a free blog with free sub-domain wordpress.com. It has also some very simple template, free three 3 GB storage, Community Support, if you want to use it more features then you can upgrade your account.

Weebly.com

Weebly is best free blogging platform and strong blogger substitute. Already 10 million users use this platform from for blogging and every day increase its users. Weebly provides for its users many premium features without any cost, including free hosting, free address, around 100 free professional templates, traffic stats and many other features.

Google site

This another Google product where you can create a free website. It has also many users in worldwide and have some good features like drag & drop option, add your custom domain, many beautiful templates.

Tumblr.com

Tumblr is the most popular platform for blogging. I think it is a good alternative for blogger. Tumblr gave opportunity to its user to share their thought, text, photo and videos with other world. It has many professional templates and blogger, you can use third-party theme. In the last year it bought by Yahoo in 1.1 billion dollars.

Webs.com

Webs is also a best platform to build a free website with free address. It is very easy website site building tool and you don't need to learn web languages, free templates, business application and many other features.

Jimdo.com

Jimdo gave opportunity to create a free website in no time, share your text, videos, and photo or create an online store. It has some incredible features like create an SEO friendly website, drag & drop, premium template, social media support. If you are looking to create an e-commerce website free then it is the best place for you.

Jigsy.com

Jigsy is another wonderful website builder make a professional website easily. Jigsy has hundred professional theme with easy customization, drag and drop website editor, SEO friendly, traffic real-time statistics

Ghost.org

Ghost is another powerful blogger alternative. It is a simple blogging platform to share your expression with the world. Ghost also provide a blogging software which is free to download and use, however, is an optional hosting service whereupon users can pay a price for their Ghost blog to be hosted by the company. You can use many third-party free and paid templates.

среда, 24 июня 2015 г.

how to add Facebook page like and sharing button in blogger blog.

Facebook like button is a good way to increase your fan page likes. It allows to visitors either like your page or share with their friends and family without leaving your blog. You will be noted that many bloggers using this button on their blog, but some new bloggers are confusing to add this important button in blog. In this post I am going to provide step by step guide, how to add Facebook page like and sharing button in blogger blog. Follow the below steps.


  • Login to your blogger account by providing user name and password.
  • Select template, then edit HTML
  • Now find out </body> tag by pressing (Ctrl+F) and paste the below code just above it.
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Past the blow codes where you want to appear like button in your blog. If you want to appear like button below every post title, then follow the steps. Find out <data:post.body/> tags and paste the code just above it.
If you interested to add this button in the post bottom, then paste below code just below<data:post.body/>  tags.
<div class="fb-like" data-href="https://www.facebook.com/thebloggerguide" data-layout="button_count" data-action="like" data-show-faces="true" data-share="true"></div>
Replace https://www.facebook.com/thebloggerguide with your fb page URL.
Note. <data:post.body/> code usually appears two to three times in a blogger template. Try the second code, if it doesn't work, then try in other two.
Now save the template and view your blog's any post to check the result, hopefully it will be working. I hope this tutorial be helped that how to add Facebook like and share button in blogger blog. If you are facing problem about this tutorial then place your comment in below the comment box.

How to Get Live Chat on Your Blog

If you are running an eCommerce blog and selling some products on it, then it is truly important make to quickly communicate with your customers ask about your products. A live chat widget is capable to do this task. There are so many blogs and websites who already used this widget to make a quick communication with customers. Most bloggers specially newbie are wondering that how they can implement a live chatting widget in their blog. To add this widget in a blog is very easy task, we do can in a few steps. In this post I want to tell you how we can easily install this important plugin in a blogger blog.


There are so many websites who are providing this service free and some take some charges for it. Among this all I select Mylivechat.com because it has many incredible features. You can easily create a free of cost account for personal, if want use for business then you can upgrade. Fast & reliable dedicated server, unlimited bandwidth. You can customize your guestbook to the look of your website. With the help of this, you can answer your visitors’ queries instantly. There are many themes , where you can easily select colors, table size, alignment etc. You do not need any programming language knowledge.

How to Get Live Chat on Your Blog

First of all simply go to https://mylivechat.com/, create an account by providing username, email address and the get the embed HTML code.
Login to your blogger account. Select template and edit html after proceeding, find </body> (by using Ctrl+F), paste the embed code and save template. Live chat will be start working instantly.
I hope you will be successfully installed live chat widget in your blog. If you are facing any problem about this widget then ask in the below comment box.

How to Disable Post Selection in Blogger Blog

Copy and paste trend increasing day by day, there many newbies who create a blog and start copying contents from other blogs and paste on their blog. Google already started to penalize these kind sites and include it spam category. Google usually ignores these kind sites, but some time creates problems for your blog too. So, this always important to petrol your blog from spammers. You can get rid your blog from these kind people, if you disable the mouse selection function on your blog posts. I already included this hack in my blog and I want to share with you how to disable mouse selection on blogger blog with help of CSS.

Disable Text Selection in Blogge

How to Disable Post Selection in Blogger Blog

We do this job by using CSS or JavaScript, but JavaScript makes a blog very heavy and take more time in loading and CSS is more compatible for it. So, we only use CSS coding to prevent blog posts from the selection. Follow the below steps.
1. Login your blogger account.
2. Now click on Edit HTML>> Unfold code ><b:skin>--</b:skin>
3. Now find for the ]]></b:skin> code using CTRL+F then paste below code just above it.
body {
  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */
  -o-user-select: none;
  user-select: none;  
}
4. Now save template and check the result. Hopefully it will be worked.

How re-enable blockquote and tables

The above code disable all the elements include images, tables and blockquote. If you're sharing some coding in your blog, then this code can also create problem for viewers, but no worry, you can leave blockquote and tables for selection. You just need to add below CSS code too.
.post blockquote,table{-webkit-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
user-select: text;
}
The above CSS code allow to your visitors to copy the table and blockquote content.

Remember

The above code may not be working for every blog. If a blog template has different a class of CSS e.g. in some template used blockquote instead of .post blockquote. So, you needed to find out it and replace .post blockquote with it.
I hope you will be learned how disable the mouse selection in blogger blog. If you are facing any problem with this track, then share with us in the comment. Thank you, have a nice day.

How to Add Widgets Sitemap in Blogger

A few days ago I published two posts about submitting a blog sitemap to Google and Bing webmaster tools, but this sitemap only for search engines, and this also good idea if you make a sitemap page for visitors too. You will be noticed that many bloggers created a sitemap page in their blog. This page helpful for visitors to easily reach a blog all articles as well as for search engine crawling-bots to quickly index your blog posts. In this post I will try to create an awesome CSS sitemap page in a blogger.
How to Add Widgets Sitemap Blog

How to Add Widgets Sitemap in Blogger

1. Login to your blogger account
2. Go to create new page >> blank page. Write sitemap in the title 
3. Paste the below code in HTML tab and publish the page.
So friends you learned how to create a beautiful sitemap page with help CSS in blogger blog. Well, I am waiting your feedback in the comment section below.

Default Set Up Robots.txt File for Blogger

A few post back I have shared a post about how to set the search preferences in blogger and in the last of this post I had promised with you that in the upcoming posts I will share about blogger robots.txt. So today I bring a complete tutorial about the custom robots.txt file. Actually, this a simple text file (not html) which is giving instruction to search engine bots that which pages either index or not. The search engine bots and other crawling bots usually obey this text.
This very important factor in SEO, with the help this text file, you can block your blog's any irrelevant URL such as label, demo pages any other page which is not important to index in search engines.kbcfss bjkl

Set Robots.txt File in Blogger

Default Set Up Robots.txt File for Blogger

In blogger we are using default robots.text like below.
User-agent: Mediapartners-Google
Disallow:
User-agent: *
Disallow: /search
Allow: /
Sitemap: http://example.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=500
First, I want to explain the terms of this file because this very important to know what are you doing in your blog. If you do any mistake in adding of this file. In the result search engines can ignore your blog or reduce blog's ranking. In below I explained all terms of the robots.txt file.
User-agent: Mediapartners-Google
Mediapartners- is the name of Google AdSense crawling bots name and this is only beneficial for those blogs who are using Google AdSense on their blogs. It helps to display your niche ads on your blog. If you are not using Google AdSense in the blog, then you don't need to keep this line.
User-agent*
When you mark User-agent with asterisk (*) sign, this means you allow all crawling bots such as Google-bots, bing and other search engines and directories bots.
Disallow: /search
This code will block all URLs which having keyword search after the domain name. In blogger all labels and search pages urls having this kind structure. So, that means you block all labels and search pages from crawling.
Allow: / 
This code specially used for homepage and it invites the search engine spider to crawl and index your blog home page.
Sitemap:
Sitemap is helpful to show your content to search engines and it is inviting the search bots to crawl your blog posts quickly and it also notifies the search engines when you do any changing in blog.

How To Disallow post Or Page Using Robots.txt File?

If you want to prevent any page or post from search engines crawling. You can do by using custom robots.txt file, simply write after User-agent* disallow: then "/" and place your post or page's except the main domain name like below.
For post
Disallow : /2015/04/your-post-url.html
For page
Disallow : /p/your-page-url.html.

How to generate robots.txt file?

After reading, this this tutorial I hope you will be able to create robots.txt file. This very easy and you don't require to learn any special language or techniques. So you can create manually or use the below online tools the file.

Adding Custom Robots.txt File In Blogger

Once you create robots.txt file, then you easily add in blogger.
Go to your blogger dashboard
  • Select Settings, then Search preferences Crawlers and indexing > Custom robots.txt > Edit > Yes.
  • Paste your robots.txt code in it.
  • Click Save Changes button.
I hope after reading this article you will be able to set custom robots.txt in blogger and also understand its terms. This great way to index your blog in search engines and get traffic, but in the end suggest again use this option with caution because adding anything wrong search engines could ignore your blog. If you need more help place your question in the comments box below.

Why should you need to install Disqus comment system in your blog?

Commenting is a great way to engage with your blog audiences and provide them a quick help. To communicate with your audiences you need to add comment box in your blog. Blogger already provides a featured comment system for their users which means you don't need to add third party comment system, but if you are searching to add more advanced comment system in your blog then Disqus is a best choice for you. It is a platform, which provides free comment hosting service for blogs and websites along with more advanced features such as social integration, social networking, user profiles, spam and moderation tools etc.

Install Disqus Comment System

Why should you need to install Disqus comment system in your blog?

This a free third party comment system and already used on so many blogs and websites. It has plenty of features which make it a unique comments system. Its some features are below
SEO friendly
This comment system is considered more SEO friendly, you can get rid from spam comments and links.
Reduce the bounce rate
It adds real time threaded comments and display a related discussion below comments which help to reduce your bounce rate.
Set a custom avatar
This allows to commenter to set an avatar along with their comments.
Make money
If your blog approved in its affiliate program, then you can make money by showing related ads in the comments

How add disqus comment system in blogger blog

This is not difficult to add in your blogger blog, you can easily integrate in just a few clicks
1. Go disqus site and create a new account by providing user name, email, password and click on next.

2. In the second step, pick your site name and admin url and click on Finish Registration

3. Now it asks you to select your blog platform, in this time we are adding in a blogger blog, so click on blogger.

4. After the selecting blogger, now you can see two options 1. Add Blogger Site 2. Import your existing blogger comments into Disqus. Select the first option. A new pop up window will open which allow you install the widget in your blog.

5. Select a blog which you wanted to integrate disqus comments and click on add widget.

 Now you have successfully done.

Import the Blogger comments into Disqus

This system also allows you to import your blog exist comments to disqus, to do this job, go back to the setup page and select Tools >> import. At the next step click on import comments from Blogger. Now google ask for permission, click on grant access. In the next step, select your blog. Disqus takes some time (up to 24 hours) to import your blog all comments.
Hopefully this post will be helped you to add Disqus comment system in blogger blog. Let me tell if facing problem about that in the comments section. Thank you and have a nice day.

How to add multi-level responsive navigation menu bar in blogger

In a previous tutorial I have shared a collection of beautiful vertical navigation menu bar with you, after that our some followers request me that how to add a responsive menu in in blogger. After the request of these friends, today I bring a multi-level responsive menu and we are going to add in a blogger blog. Actually a responsive menu is a bar which adjusting with screen width, if a visitor visit your blog through desktop, then it looks like a traditional menu bar, but when someone access to your blog through a smart phone or tablet then it looks as a mobile application. In these the using of smart phones and tablets increasing day by day. You would be noticed that many visitors are accessing to your blog through mobile phones. So this utmost necessary to make your blog mobile friendly.
Responsive Dropdown Menu bar in Blogger

How to add multi-level responsive navigation menu bar in blogger 

This is not an uphill task to add this menu in your blog, follow the instructions.
1. Login your blogger account and select a blog which you want to add this menu.
2. Select template >> edit HTML.
3. After opening your template all coding, search <head> and paste the below links.
<link href='http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css' rel='stylesheet'/>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src='https://googledrive.com/host/BzPgmXeCwsMRc0o1NnM4QU1OSVE' type='text/javascript'></script>

Adding CSS codes 

First of all, click on below 'view code' and copy all css code from appearing pop up window then search ]]></b:skin> in your blog template and paste just above it.

Adding HTML codes

This depends on you, where you want to appear menu in your blog. If you want to appear after header, then find </header> tag and paste the below codes just after it.
<nav>
<a id="resp-menu" class="responsive-menu" href="#"><i class="fa fa-reorder"></i> Menu</a>  
   <ul class="menu">
   <li><a class="homer" href="#"><i class="fa fa-home"></i> HOME</a>
   </li><li><a  href="#"><i class="fa fa-user"></i> ABOUT</a></li>
  <li><a  href="#"><i class="fa fa-camera"></i> PORTFOLIO</a>
  <ul class="sub-menu">
   <li><a href="#">Sub-Menu 1</a></li>
   <li><a href="#">Sub-Menu 2</a>
    <ul><li><a href="#">Sub Sub-Menu 1</a></li>
   <li><a href="#">Sub Sub-Menu 2</a></li></ul> </li>
    <li><a href="#">Sub-Menu 3</a><ul>
   <li><a href="#">Sub Sub-Menu 1</a></li>
   <li><a href="#">Sub Sub-Menu 2</a></li>
   </ul></li></ul></li><li><a  href="#"><i class="fa fa-bullhorn"></i> BLOG</a></li>
   <li><a  href="#"><i class="fa fa-tags"></i> CATEGORIES</a>
  <ul class="sub-menu">
  <li><a href="#">Sub-Menu 1</a></li>
  <li><a href="#">Sub-Menu 2</a><ul>
  <li><a href="#">Sub Sub-Menu 1</a></li>
  <li><a href="#">Sub Sub-Menu 2</a></li>
 </ul></li><li><a href="#">Sub-Menu 3</a><ul> <li><a href="#">Sub Sub-Menu 1</a></li><li><a href="#">Sub Sub-Menu 2</a></li>  <ul> </li></ul></li><li><a  href="#"><i class="fa fa-envelope"></i> CONTACT</a></li><li><a  href="#"><i class="fa fa-sitemap"></i> SITEMAP</a></li><li><a  href="#"><i class="fa fa-exclamation-triangle"></i> DISCLAIMER</a></li></ul></nav>
Replace the # with your blog links and anchor text with your own. Done
Remember 
If you are using the blogger mobile version template in your blog, first disable it by going.

  • Select template >> click the gear icon
  • Select No. Show desktop template on mobile devices.
Now check your blog with different devices. Hopefully it will be working properly, if you are facing any problem about adding this multi-level responsive menu bar then leave your comment below.