Shareholic Clone Social Sharing Widget For Blogger - Hami Zone

Hello people, today I'm sharing the clone widget of Shareholic Social Sharing Widget, since the original Shareholic has some issues like it requires the user to allow Shareholic App to share the link on Facebook or Twitter, which is very annoying and can prevent your readers from sharing your post to the most popular Social Networks.......

So here is a custom widget made by me that looks exactly like the original one, it doesn't requires any app permission to share your page or post.

Even though there are hundreds of social sharing widgets out there, none of them look as neat and simple as this widget, the icons are medium size and sleek that gives a bit of Windows Metro look.

Here is the preview:

The only difference between this clone and original is the tooltip effect on mouse-over. The tooltip effect can be added using a small jQuery plugin called tiptip.

To add this widget follow these steps:

1. Go to Blogger Dashboard > Template > Edit HTML

and press CTRL+F to find this code:

]]></b:skin>

2. Now add the following code just before the code that you searched:


     /* share buttons */
.share_wrapper .delicious {
 background: url(http://4.bp.blogspot.com/-3ELy-V1dg1k/UdHmLinboHI/AAAAAAAAAyw/xNxxV_00C3Q/s70/dscuss2.png); 
}
.share_wrapper .gplus {
 background: url(http://2.bp.blogspot.com/-UgyJvNw1qJA/UdHNtMmjIII/AAAAAAAAAxw/XJ_wYlMGEvY/s70/gplus.png); 
}
.share_wrapper .twitter {
 background: url(http://3.bp.blogspot.com/-nkAt4by0s7M/UdHNuU5DpAI/AAAAAAAAAyg/jJ7x-yUxpnY/s70/twitter.png); 
}
.share_wrapper .pinterest {
 background: url(http://2.bp.blogspot.com/-K41o1fRpXZY/UdHNuWmGXTI/AAAAAAAAAyQ/e6UiUfIJl_A/s70/pinterest.png); 
}
.share_wrapper .linkedin {
 background: url(http://4.bp.blogspot.com/-WX4dOdfuqg4/UdHNtk765gI/AAAAAAAAAyE/516T8UuBhR4/s70/linkedin.png); 
}
.share_wrapper .myspace {
 background: url(http://1.bp.blogspot.com/-bK7g0To5RQk/UdHNt0fP4-I/AAAAAAAAAyI/mAmPrhTmp_Y/s70/myspace.png); 
}
.share_wrapper .facebook {
 background: url(http://1.bp.blogspot.com/-ZqlYOlViiWg/UdHNtKEg8sI/AAAAAAAAAx0/o-J_PaQ9RDo/s70/facebook.png);
}
.share_wrapper .delicious, .facebook, .gplus, .twitter, .pinterest, .linkedin, .myspace 
{
  display: inline-block;
 width: 70px;
height: 20px;
-webkit-background-size: cover; 
margin: 3px;
}
.share_wrapper .delicious:hover, .facebook:hover, .gplus:hover, .twitter:hover, .pinterest:hover, .linkedin:hover, .myspace:hover {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=8)";
filter: alpha(opacity=8);
-moz-opacity: 0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
 
}
 .sharingheader {
    background: url(http://4.bp.blogspot.com/-CFvaTalCoZw/UfIqUq1p0nI/AAAAAAAABCc/YXgzSHkTL4M/s1600/share-post.jpg) no-repeat;
display: inline-block;
width: 244px;
height: 44px;
margin: 3px;
  }
.share_wrapper {
  
 padding: 10px;
 margin: 5px;
}

3. Find this code now:

<span class='reaction-buttons'>


4. Paste the following code just before the above code:

<!-- share buttons by Hami Zone-->
<div style='text-align: center; padding-top: 5px;'>
  <span class='sharingheader'/>
<div class='share_wrapper'>
<a class='facebook sharingtt' data-location='bottom' data-title='bottom' href='#' onclick='     window.open(       &apos;http://www.facebook.com/sharer/sharer.php?u=&apos;+encodeURIComponent(location.href),        &apos;facebook-share-dialog&apos;,        &apos;width=626,height=436&apos;);      return false;' title='Facebook'>
  
</a>
<a class='twitter sharingtt' href='#' onclick='     window.open(       &apos;http://twitter.com/intent/tweet?text=&apos;+encodeURIComponent(location.href + &apos; &apos; + document.title),        &apos;twitter-share-dialog&apos;,        &apos;width=626,height=436&apos;);      return false;' title='Twitter'>
  
</a>
<a class='gplus sharingtt' href='#' onclick='     window.open(       &apos;http://plus.google.com/share?url=&apos;+encodeURIComponent(location.href),        &apos;gplus-share-dialog&apos;,        &apos;width=626,height=436&apos;);      return false;' title='Google+'>
  
</a>

<a class='pinterest sharingtt' href='#' onclick='     window.open(       &apos;http://pinterest.com/pin/create/button/?url=&apos;+encodeURIComponent(location.href)+&apos;title=&apos;+document.title+&apos;&amp;media=&apos;+document.getElementsByTagName(&quot;img&quot;)[6].src,        &apos;pinterest-share-dialog&apos;,        &apos;width=626,height=436&apos;);      return false;' title='Pinterest'>
  
</a>

<a class='linkedin sharingtt' href='#' onclick='     window.open(       &apos;http://www.linkedin.com/shareArticle?mini=true&amp;url=&apos;+encodeURIComponent(location.href)+&apos;&amp;title=&apos;+document.title,        &apos;linkedin-share-dialog&apos;,        &apos;width=626,height=436&apos;);      return false;' title='LinkedIn'>
  
</a>
<a class='delicious sharingtt' href='#' onclick='     window.open(       &apos;http://del.icio.us/post?url=&apos;+encodeURIComponent(location.href)+&apos;&amp;title=&apos;+document.title,        &apos;delicious-share-dialog&apos;,        &apos;width=626,height=436&apos;);      return false;' title='Delicious'>
  
</a>
<a class='myspace sharingtt' href='#' onclick='     window.open(       &apos;http://www.myspace.com/Modules/PostTo/Pages/?u=&apos;+encodeURIComponent(location.href)+&apos;&amp;t=&apos;+document.title,        &apos;myspace-share-dialog&apos;,        &apos;width=626,height=436&apos;);      return false;' title='My Space'>
  
</a>
</div>
      </div>
Gr8 :) you have successfully added the best sharing widget of all time :) cheers! 

Read More

SEO Keyword Research Tools -20 Free Keyword Research Tools

Hello
Before you write any good article or optimize website, you have to know how and why you have to select right keywords. SEO is very easy to overuse and do even worse, if you for example start to do keyword stuffing or repeating the same words over and over again without good thought. For regular content like blogs, people always like to argue about what you need to put in the first place – SEO or your readers. I am thinking you must do both – using simple but consistent and smart SEO and try to write as compelling article as possible to your readers.

1.Google search based keyword tool

The Search-based Keyword Tool provides keyword ideas:

• Based on actual Google search queries;
• Matched to specific pages of your website with your ad and search share;
• New to your Adwords account (typically excluding keywords matching those already in your account).

I thought it will be better to add official product introduction, than explaining what this tool does with my words to give you good overview.

2.Google AdWords: Keyword Tool

Use the Keyword Tool to get new keyword ideas. Select an option below to enter a few descriptive words or phrases, or type in your website’s URL. This tool gives you approximate keyword search volume statistics for Google search network and because of Google growing and dominating search network, you really can get pretty precise results.

3.Google Insights for Search

Google Insights is a powerful tool that offers features not available on most other free tools. For seasonal or fluctuating niches, you can view stats by year or a specific time period. For regional niches, you can view stats by country, state or even city. The graphical reports are great for seeing trends. One of the only downsides is that they don’t show absolute search volume but instead normalized data that is shown on a scale up to 100. Also since the data is normalized the detailed stats are limited.

4. Google Trends

Use commas to compare multiple search terms – one more great product from Google allowing you to research and compare trends.

5.Free Keyword Suggestion Tool from Wordtracker

Wordtracker helps website owners and search engine marketers identify keywords and phrases that are relevant to their or their client’s business and most likely to be used as queries by search engine visitors.
Use the free keyword suggestion tool from Wordtracker to help your website rank higher in the search engines. This tool can generate up to 100 related keyword phrases and show daily searches.
If you use Internet Explorer 7, or Firefox 2 or 3, you can add the Wordtracker Keywords search to your browser.

6.SEO Book Keyword suggestion tool

This tool is powered by Wordtracker, get comprehensive overview about different search volume statistics for Google, Yahoo!, MSN daily estimonials – export whole list to Excel *.csv file for later research!
Top Paying AdSense Keyword Lists
Also good introduction to this tool – definitely suggest you to watch this video.

7.Good Keywords v3

Free and downloadable Windows software helping you to get out more of Google keyword research, worth checking out!

8.SEMRush

What you may do there:

• Discover competitors’ sites with common Google keywords;
• Get list of Google keywords for any site;
• Get list of AdWords keywords for any site;
• Check your competitors landing-pages for SE and AdWords traffic;
• Investigate long-tail keywords for any domain;
• Get estimated SE and AdWords traffic for any domain;
• See sites’ spending for AdWords;
• Get hidden related (and low-cost) keywords to optimize your AdWords campaign;
• Find potential advertisers for any site;
• Find potential traffic sellers for your site.

9. Free Search Term Suggestion Tool

Trellian KeywordDiscovery keyword data is compiled and collected from a number of search engines to provide a far more accurate cross section of searches performed world wide. This tool can generate maximum 100 keywords and collect search term data from over 200 search engines world wide.

10.KGen

KGen (Keyword Generator) is Firefox extension that allows you to see what keywords are strong on visited web pages. This plugin retrieves every words of a page and lets you know how many time they appears on her and their weight in the page (a word in the title of a page has a stronger weight than a word in a paragraph).

11.Wordpot Free Keyword Tool

Try this free keyword research tool,which is quite usable, but creators limit your access trying to sell you paid version, generally you still can get pretty good overview.

12.NicheBot Classic

Type a keyword or keyword phrase and get the top 50 most popular keyword listings.

Non-SEO tools, but still extremely useful:

13.Synonyms Thesaurus with Antonyms & Definitions

Synonym.com is good web resource for English synonyms, antonyms, and definitions. Type in a word and the synonym finder will come up with a list of synonyms. Check out the most popular online synonym searches to find the right word for any occasion. Use the antonym tool to find find antonyms and check out the definitions feature to read the definition.

14.Thesaurus

Thesaurus.com is produced by Dictionary.com, LLC, a leading provider of language reference products and services on the Internet.
To use the thesaurus, simply type a word in the gold search box and click the ‘Search’ button. A list of synonyms and antonyms will be returned.

15.Delicious

Bookmarking service, but still very useful for searching keywords. I usually find similar popular articles or websites and check which tags are used to bookmark that page. Extremely useful!

16.Dictionary

Dictionary.com is a multi-source dictionary search service produced by Dictionary.com, LLC, a leading provider of language reference products and services on the Internet. Dictionary.com is hiring, please find information about career opportunities.
To use the dictionary, simply type a word in the blue search box that appears at the top of every page and then click the ‘Search’ button.

17.Wikipedia

Everybody knows wikipedia, but did you ever think about using it to research your niche – related categories, language people in your niche are using? Useful to visit from time to time in research purpose!

18.Keyword questions

People often type questions into search engines. Now you can find these questions, answer them and get some great search traffic. You’ll be targeting long tail keywords and providing content that readers want to read and link to. Also try the keyword tool the professional SEO uses. Enter a single or a short keyword to find the questions people are asking in your market.

19.Twitter Search

Keeping up with interesting news and people you care about is one dimension of Twitter, but what if you need to find out what’s happening in the world beyond your personal timeline?
There is an undeniable need to search, filter, and otherwise interact with the volumes of news and information being transmitted to Twitter every second. Twitter Search helps you filter all the real-time information coursing through our service.

20.MetaGlossary

MetaGlossary is able to precisely extract the meanings of terms and phrases from the often frustratingly unmanageable mass of information on the web. It provides you with concise, direct explanations for terms and phrases, not just endless links to sift through in search of a comprehensive definition.

Read More

How To Restore Blogger From Backup - Hami Zone

Why to Restore Blogger From Backup?

Before we work on our tutorial, it is essential for everyone to learn why he should be restoring his blog through Backup. Following are the few meaningful reasons we collected while experiencing blogger for more than 5 years.

• Blog Deleted by Blogger: Your blog is owned by Google which means you are not the lone administrator of you site, so Blogger can delete your blog if you violated the content policy. In this situation, you may not get your .blogspot.com site back, but if it is hosted on .com domain, then you might have chances of recovering it. If not on Blogger, then with the help of the backup you can restore it on WordPress.

• Hacked or Malware: Sometime websites catch malware attack. Most people are not code-friendly, so they cannot remove the malware or the hacking script injected into their site. In this situation, they can use the backup to restore their site to the normal conditions.  

Still these reasons are limited to some extent because it could be anything that we may have not experienced it yet. If anyone has something to share, then feel free to share it by commenting below.

How to Restore Blogger From Backup?

The first thing you need to do is to login into your Google account. Now from the Blogger dashboard go to Your Blog >>Settings >> Other >> Import. For your help, we have attached a screenshot below:

Now you need to upload the backup of your site so that system can restore your site. Just Choose the backup from your computer hard drive, enter the captcha for security reasons and press the “Upload” button as it can be seen on the screenshot below.

Congratulations: once the backup is finished, you have successfully backup’d your blogger site. The old articles and comments can be accessed either your blogger dashboard or your site.
Related Links (Recommended

How To Make Your Blogger Template SEO Friendly

Read More

How To Make Your Blogger Template SEO Friendly- Hami Zone

Do you want to make your Blogger template SEO friendly but don’t know how the whole thing works? Optimize a blogger template with proper SEO is extremely crucial because it indicates how well your site is being  crawled. On the other hand, Search Engine Optimization doesn’t possess the same significance that it uses to have in the past because now Google’s main priority is quality content. Still, optimizing templates with correct technique will not harm you instead your visitors will enjoy the fruitful changes that you have done in your template. Most of the blogspot users think’s that SEO stands for the number of backlinks but deeply it means how well a certain page is organized with proper attributions i.e. H2 Tags, Permalinks, and etc. If you are trying to make your existing Blogger Template Search engine Friendly, then you have arrived to the correct destination. Today we will discuss how we can optimize our Blogspot Template for Search engines.

1. Adding Proper Meta Description and Keywords Tags in Blogger Template:

Most of the Blogger Templates are designed by unknown designers so it is quite clear that it lacked a lot in SEO. If you have ever edited a Template, then you might have noticed that most of the templates don’t have Meta tags. Though, Meta tags and keywords can be changed with New Search Preference tool but doing things manually has greater significance so, first we have to optimize our Blogger Template with Meta tags.

• Just Go To Your Site >> Template >> Edit HTML >> Proceed
• Search For <head> and just bellow it paste the following Code

<meta content='text/html; charset=utf-8' http-equiv='Content-Type'/>
<meta content='Your_Site_Description_Here' name='description'/>
<meta content='Your_Site_Keywords_Here' name='keywords'/>

• Replace Your_Site_Description_Here with your site description but make sure it shouldn't exceed 60 characters. Also replace Your_Site_Keywords_Here with 10 to 15 keywords that relates your site niche. 

After adding the above Chunk of codes, you have successfully enhanced your SEO. Now when crawlers will crawl your home page they will be able to learn much more about your site because through Meta descriptions and keywords tags, you are giving them brief introduction of your site.

2. Using H2 Tags in Your Blogger Post Title:

H2 tags are of greater significance because these little tags allows search crawler to identify which keyword to rank higher in the Search results. If you have ever noticed that the Tags which are associated with Blogger post titles are mostly H3 tags which certainly drop the worth of a certain keyword so, it is extremely crucial that we utilize H2 Tags in our Blogger Post Titles. To change your existing post title H3 Tags To H2 do as follows.

• Just Go To Blogger.com >> Template >> Edit HTML >> Proceed
• Don't forgot to Check/Tick Expand The Widget Box.
• Now search for the following or similar codes in your template.

<h3 class='post-title'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link'><data:post.title/></a>
     <b:else/>
        <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
        <b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
      </h3>

• When you find the above code or a similar one replace it with the following code.

<h2 class='post-title'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link'><data:post.title/></a>
     <b:else/>
        <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
        <b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
      </h2>

Now your H3 Post titles are changes to H2 tags. You have wait around a week till the crawlers update their history, and soon after it you will notice a breeze of traffic flowing all round your site. Remember: Only update your H3 tags if you are not getting sufficient traffic from search engines.

3. Optimizing Blogger Post Titles:

If you Blogger template is not optimized for Proper Post Titles then you might have noticed most of your Posts first shows (YOUR_BLOG_NAME), then it shows (YOUR_POST_NAME) which indicates that your targeted keywords is showing at the end, instead of appearing up front. 

• Go To Blogger.com >> Template >> EDIT HTML >> Proceed
• Search For  <title><data:blog.pageTitle/></title> (usually at the top of your template). 
• When you find it just replace it with the following coding.

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

That't it save your template and now your Post titles will show your SITE_NAME at the end of each and every post.

From the Editor's Desk:

By apply these three techniques you will surly notice a significant increase in your website Traffic, but if you are already getting heaps of traffic then you don’t need to do anything just work on building quality Content. If you need any help feel free to ask till then, peace, blessing and happy SEO optimizing.

Read More