How to Customize Blogger Labels & Make Them Attractive

Well you might have figured out that I have entirely customized my blogger template according to my taste and the one thing I love are the labels that simply categorizes your content according to what it comes in. So by default blogger provides a simple option to add labels and than choose from two different schemes the one is straight way of displaying your labels and the one is cloud style.

Well I am using the cloud version and I have just added some CSS styles that I have created by my own to modify the overall look of it. So you can see in the above image what kind of look you will get when you will apply the below CSS.

Well obviously you can edit the styles according to your preference or maybe add some more interactivity to it that depends on your creativity. So now jump in to the below tutorial and lets start the process.

1. Visit Blogger.com > Template > Edit HTML.
2. Now press Ctrl + F and search for ]]></b:skin> and paste below code above it.#Label1 a{background:#f6f6f6;background: -webkit-gradient(linear, 0% 40%, 0% 70%, from(#f9f9f9), to(#f1f1f1));background: -moz-linear-gradient(linear, 0% 40%, 0% 70%, from(#f9f9f9), to(#f1f1f1));border:1px solid #aaa;display:inline-block;font-family:cambria;font-size:10px;letter-spacing:1px;margin:3px 0;padding:6px;text-transform:uppercase;-moz-box-shadow:0 5px 5px -5px #999;-webkit-box-shadow:0 5px 5px -5px #999;box-shadow:0 5px 5px -5px #999;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}#Label1 a:hover{border:1px solid #666;color:#000}
3. Now this is the default code for modifying labels in blogger template, if this code does not work you might have something else constructing your blogger labels.

What if the above code does not work ?

This can be due to code your blogger labels are created with, just follow below steps to see your appropriate code and replace it with above CSS code.

1. So what you can do is just right click on your label in chrome browser and you will see something like in the image on the right, it’s the code constructing your labels.
2. So now just change the above CSS code starting with that code you found and it will work fine.

So that’s it this tutorial will give your labels a new look and will surely attract your readers to click on them and see how they work :) So do comment if you find any problems installing these CSS styles.

Read More

Add Blogger Sitemap to Google Webmaster Tools

I hope you do know about Google Web Master Tools. This tool enables Webmasters to provide a better and detailed information of their site to Google.This will greatly help you in your SEO needs.Webmaster Tools allows you to submit your blog's sitemap so that Google gets a better idea of your blogs structure.

Blogger’s robots.txt file automatically specifies a sitemap URL[The blog feed], but it would be even better if you manually add the sitemap URLs to GWT.

Wordpress and other blogging platforms have some Sitemap generator plugins for the same.If you are using blogger you can use your blog's atom.xml feed as your sitemap.

Note:- If you have disabled Blog Feeds then enable it by going to Settings > Site Feedand change Allow Blog Feeds to Short or Full. (Don't set it to None)

1. Login to Google Web Master Tools with your Blogger account.

2. See if your Blog is already listed there, if it is listed and verified then click on the blog name and proceed to Step 5

3.If its not listed, Click on the Add a site button and provide your blog URL there and hit continue.

 4.It will now ask you to verify your Blog using any of the two methods. You can use any of those. The File upload method would be simpler.

  a. File Upload Method – Change the Verification method to Upload an HTML File. Ignore the file download and upload instructions provided there. Google will automatically download and upload that file for you. So just ignore the instructions and hit the Verify button. Your blog should get verified now. If it doesn’t then opt for the  second method (b)

  b. Meta Tag Verification method. Google will provide you a Meta Tag code which looks like

<meta name="google-site-verification" content="verificationkey" />

Copy this Code,  login to your Blogger Dashboard navigate to Layout >Edit HTML and place this code somewhere above </head> Save the template, come back to GWT and hit the verify button.

5. Once your blog is verified you can  add  sitemaps for your blog[From the Left Pane > Site Configuration > Sitemap].In the sitemap URL give the following URL as shown in this screenshot and click the Submit Sitemap button

atom.xml?redirect=false&max-results=500 

 If you have more than 500 posts on your blog, then add an additional sitemap URL

atom.xml?redirect=false&start-index=501&max-results=500

If your blog has more than 1000 posts, then add one more sitemap URL

atom.xml?redirect=false&start-index=1001&max-results=500

If it has more than 1500 posts, then add one more sitemap

atom.xml?redirect=false&start-index=1501&max-results=500

Continue this process depending upon the number of posts on your blog. So this means that you will be adding additional sitemaps for every 500 posts.

Once you have added the Sitemap, you can play around with the different other tools in GWT. It will provide you with a better analysis your site, show you the sites linking to you, help you in managing your site links and much more.

Read More

Recommended Post Slide out for Blogger

Keep the visitors glued to your site for long” This is what every blogger out there wants to do. The Recommended Post slide Out Widget does just that. It’s kind of  an invitation to the reader to read a new post once he has read one of your blog entries. You might have seen this kind of a widget on many popular websites like New York Times, Mashable, Times of India etc.

Demo of the Slide Out

 

 

Customizing the Recommended Slide out

1. End Of Post marker – The slide comes out when the user scrolls down to a particular point in your Blog.(the bottom of the page by default) To mark this point, you can add an HTML element there. The element should have the id bpslidein_place_holder

e.g.: <div id='bpslidein_place_holder'></div> would do the job. The best place to add this marker would be at the end of the post. If you want to do it easily, you can add this to your Blogger Template.

In your template Find,(You will have to expand the Widget Templates)

<div class='post-footer-line post-footer-line-1'>

or

<p class='post-footer-line post-footer-line-1'>

or

<data:post.body/>

Immediately below any of these, add the following snippet and save our template

<b:if cond='data:blog.pageType == "item"'>
<div style='display:none' id='bpslidein_place_holder'></div>
</b:if>

Now when the reader scrolls down to this div, the slide will open up.

2. Customizing the Look and Feel of the Slide out.

You can obviously style the Recommended Slide out. But before you do that, you have to add this variable definition to your template

<script>var bpslidein_custom_css=true;</script>

This should be added somewhere above the Slide Out Widget. If this variable is not set, a default StyleSheet will be used to spice up the Recommended Slide out.

Once this variable is set to true, you can add your own CSS definitions. You can add your CSS at Template Designer > Advanced > Add CSS

This is the default set of Style definitions applied to the Widget. You can modify them and use it.

#bpslidein{z-index:5;width:400px;height:100px;padding:10px;background-color:#fff;border-top:3px solid #1616F5;position:fixed;right:-430px;bottom:0;-moz-box-shadow:-2px 0 5px #aaa;-webkit-box-shadow:-2px 0 5px #aaa;box-shadow:-2px 0 5px #aaa;font-family:Arial, Helvetica, sans-serif;}
#bpslidein p{font-size:11px;text-transform:uppercase;font-family:Arial,Helvetica,sans-serif;letter-spacing:1px;color:#555;}
#bpslidein_title{color:#555;font-weight:700;font-size:16px;margin:10px 20px 10px 0;}
#bpslidein a,#bpslidein a:hover,#bpslidein_title{text-decoration:none;color:#1616F5;}
#bpslidein .close,#bpslidein .expand,#bpslidein .help{border:2px solid #EEE;cursor:pointer;color:#9A9AA1;width:13px;height:15px;padding:2px 0 0 5px;position:absolute;right:10px;font-size:17px;font-weight:700;font-family:Arial, Helvetica, sans-serif;font-size:12px;}
#bpslidein .help{right:35px;}
#bpslidein_title,#bpslidein_image{float:left;width:80px;}
#bpslidein_title{width:290px;}

3. Other Stuff that you can edit

You can edit the Title of the Widget and the Loading text by editing the Widget Content. 

 

Read More

Facebook Like/Fan Box For Blogger Facebook Like/Fan Box For Blogger

This tutorial is for everyone who has already created a Facebook Fan Page. If have not created one, try making one. A Fan Box or Like Box allows your Blog visitors to like your Facebook fan page, without leaving your blog. It can also display faces of the “likers” on your blog. To add the fan box to blogger, follow these steps:

1. Find out your Facebook Fan Page URL. To do that, just visit your Facebook Fan Page, and copy the url in the address bar.

In my case it is http://www.facebook.com/bloggerplugins (The url which you see in the address bar when you visit your fan page.) .Copy this url from your address bar.

2. Visit This page http://developers.facebook.com/docs/reference/plugins/like-box

You have already copied the Facebook fan page url. Paste this into the Facebook Page URL 

field

Select the choices appropriately and you can see a live preview of the Like/Fan box.

3.Once you are satisfied with the looks of the Like Box, Click on the “Get Code” button

4. Copy the xfbml code which gets generated.

5. Now login to your Blogger account and go to Design > Page Elements

Click Add a Gadget Link and Add an HTML/JavaScript Gadget

6.Paste the generated code as the Gadget’s Content

and Save the Gadget.

7.Next you have to add the fb namespace to your template tag.Your template should have the specification for the fb tag that you have used. The following namespace declaration will take care of that. To declare the namespace, Go to Design/Template > Edit HTMLand find

<html

and change it to

<html xmlns:fb="https://www.facebook.com/2008/fbml"

The following screenshot will help you out.

 This is necessary for all FBML widgets using the fb tag.  So if you have already added the namespace while adding some other FB plugin, then you can skip this.

8.Save the Template and you should see the Fan/Like Box on your blog’s sidebar.

Read More

How to Add Numbered Page Navigation to Blogger

Blogger is a good blogging platform for new people and it is easier and of course Free.

Despite so many cool things, Blogger sucks in most of the areas, I mean it is good if you're beginning but as you progress and for more professionalism you'll find yourself disabled with blogger and a strong urge of switching to Wordpress will rise but if you can't afford Wordpress Hosting, that doesn't mean that you can't make a professional looking blog with Blogger.

 

There are a lot of Widgets and Add ons which can make Blogger Awesome. With Widgets, we can add cool features for better blogging and navigation. Today we'll talk about one such feature and that is 'Numbered Page Navigation'.

How to Add Numbered Page Navigation to Blogger

This is a common feature, I don't know why Blogger lacks this feature but anyways we can add it to our blogs. If you want to add Numbered Page Navigation to your blogs then follow the steps given below.

Step 1: From Blogger Dashboard, Go to Layout

Step 2: Now Click on 'Add a Gadget' and Select 'HTML/Javascript' Widget.

Step 3: Now Paste the following code inside the Widget (HTML/Javascript)

<style type='text/css'>

    .showpageArea a {
    text-decoration:underline;
    }
    .showpageNum a {
    border:1px solid #aeaeae;
    margin:0 3px;
    padding:3px 7px;
    text-decoration:none;
    }
    .showpageNum a:hover {
    background-color:#0a8be5;
    border:1px solid #000000;

    }
    .showpagePoint {
    -moz-background-clip:border;
    -moz-background-inline-policy:continuous;
    -moz-background-origin:padding;
    background:#aeaeae none repeat scroll 0 0;
    border:1px solid #aeaeae;
    color:#333333;
    margin:0 3px;
    padding:3px 7px;
    text-decoration:none;
    }
    .showpageOf {
    margin:0 3px 0 0;
    padding:3px 7px;
    text-decoration:none;
    }
    .showpage a {
    border:1px solid #aeaeae;
    padding:3px 7px;
    text-decoration:none;
    }
    .showpage a:hover {
    text-decoration:none;
    }
    .showpageNum a:link, .showpage a:link {
    color:#333333;
    text-decoration:none;
    }

    </style>


    <script type='text/javascript'>

    var home_page_url = location.href;

    var pageCount=1;
    var displayPageNum=3;
    var upPageWord ='Previous';
    var downPageWord ='Next';

    function showpageCount(json) {
    var thisUrl = home_page_url;
    var htmlMap = new Array();
    var thisNum = 1;
    var postNum=1;
    var itemCount = 0;
    var fFlag = 0;
    var eFlag = 0;
    var html= '';
    var upPageHtml ='';
    var downPageHtml ='';

    for(var i=0, post; post = json.feed.entry[i]; i++) {

    var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
    timestamp = encodeURIComponent(timestamp1);

    var title = post.title.$t;

    if(title!=''){
    if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
    if(thisUrl.indexOf(timestamp)!=-1 ){
      thisNum = postNum;
    }

    if(title!='') postNum++;
    htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'&max-results='+pageCount;
    }
    }
    itemCount++;

    }

    for(var p =0;p< htmlMap.length;p++){
    if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
    if(fFlag ==0 && p == thisNum-2){
    if(thisNum==2){
     upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
    }else{
     upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
    }

    fFlag++;
    }

    if(p==(thisNum-1)){
    html += '<span class="showpagePoint">'+thisNum+'</span>';
    }else{
    if(p==0){
      html += '<span class="showpageNum"><a href="/">1</a></span>';

    }else{
     html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
    }
    }

    if(eFlag ==0 && p == thisNum){
    downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
    eFlag++;
    }
    }
    }

    if(thisNum>1){
    html = ''+upPageHtml+' '+html +' ';
    }

    html = '<div class="showpageArea"><span  class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;

    if(thisNum<(postNum-1)){
    html += downPageHtml;
    }

    if(postNum==1) postNum++;
    html += '</div>';

    var pageArea = document.getElementsByName("pageArea");
    var blogPager = document.getElementById("blog-pager");

    if(postNum <= 2){
    html ='';
    }

    for(var p =0;p< pageArea.length;p++){
    pageArea[p].innerHTML = html;
    }

    if(pageArea&&pageArea.length>0){
    html ='';
    }

    if(blogPager){
    blogPager.innerHTML = html;
    }

    }

    function showpageCount2(json) {

    var thisUrl = home_page_url;
    var htmlMap = new Array();
    var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
    var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
    thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
    var thisNum = 1;
    var postNum=1;
    var itemCount = 0;
    var fFlag = 0;
    var eFlag = 0;
    var html= '';
    var upPageHtml ='';
    var downPageHtml ='';

    var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';
    var thisUrl = home_page_url;

    for(var i=0, post; post = json.feed.entry[i]; i++) {

    var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
    timestamp = encodeURIComponent(timestamp1);

    var title = post.title.$t;

    if(title!=''){
    if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
    if(thisUrl.indexOf(timestamp)!=-1 ){
     thisNum = postNum;
    }

    if(title!='') postNum++;
    htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'&max-results='+pageCount;

    }
    }
    itemCount++;
    }

    for(var p =0;p< htmlMap.length;p++){
    if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
    if(fFlag ==0 && p == thisNum-2){
    if(thisNum==2){
     upPageHtml = labelHtml + upPageWord +'</a></span>';
    }else{
     upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
    }

    fFlag++;
    }

    if(p==(thisNum-1)){
    html += '<span class="showpagePoint">'+thisNum+'</span>';
    }else{
    if(p==0){
     html = labelHtml+'1</a></span>';
    }else{
     html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
    }
    }

    if(eFlag ==0 && p == thisNum){
    downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
    eFlag++;
    }
    }
    }

    if(thisNum>1){
    if(!isLablePage){
    html = ''+upPageHtml+' '+html +' ';
    }else{
    html = ''+upPageHtml+' '+html +' ';
    }
    }

    html = '<div class="showpageArea"><span  class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;

    if(thisNum<(postNum-1)){
    html += downPageHtml;
    }

    if(postNum==1) postNum++;
    html += '</div>';

    var pageArea = document.getElementsByName("pageArea");
    var blogPager = document.getElementById("blog-pager");

    if(postNum <= 2){
    html ='';
    }

    for(var p =0;p< pageArea.length;p++){
    pageArea[p].innerHTML = html;
    }

    if(pageArea&&pageArea.length>0){
    html ='';
    }

    if(blogPager){
    blogPager.innerHTML = html;
    }

    }

    </script>
    <script type='text/javascript'>

    var thisUrl = home_page_url;
    if (thisUrl.indexOf("/search/label/")!=-1){
    if (thisUrl.indexOf("?updated-max")!=-1){
    var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"));
    }else{
    var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"));
    }
    }

    var home_page = "/";
    if (thisUrl.indexOf("?q=")==-1){
    if (thisUrl.indexOf("/search/label/")==-1){
    document.write('<script src="'+home_page+'feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" ></script>')
    }else{document.write('<script src="'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&callback=showpageCount2&max-results=99999" ></script>')
    }
    }
    </script>

Step 4: Now Click on Save button.

Congratulations! Now you've successfully added Numbered Page Navigation to yourBlogger blog. This is How it'll Look,

Read More

Blogger Tag Cloud Widget by Categories / Labels

This widget is perfect for blogspot users who desire a simple tag cloud for their Categories. The Labels Cloud can easily be implemented within the sidebar of your blog and will match your template wonderfully.

 

Steps for Implementation

Step 1: Back it Up
Always make sure to back up your Blogger Template before doing anything else!

Step 2: The Labels Gadget

Make sure that you have the Labels Page Element installed. If you haven't already...

1. Go to Layout >Page Elements .
2. Click "Add a Gadget" and then add the "Labels" gadget.

Step 3: Locating the "Old Code"

1. Now go to Layout >Edit HTML
2. Make sure that the "Expand Widgets Template" box is unchecked.
3. Now we need to search for the code that looks like this.

   <b:widget id='Label1' locked='false' title='Tags' type='Label'/>

   Your code may look a little different. So try using your browser's search tool to find type='Label'.

Step 4: Replacing the "Old Code" with the "New Code"

1. Once you've located type='Label', remove the whole line of code that looks just like the code mentioned in part 3 of step 3.
2. Replace this code that you've just deleted with the code below:

   /*
   Distributed by John Smith at WidgetsForFree.blogspot.com
   */ <b:widget id='Label1' locked='false' title='Tags' type='Label'>
   <b:includable id='main'>
   <b:if cond='data:title'>
   <h2><data:title/></h2>
   </b:if>
   <div class='widget-content' style='text-align: justify;'>
   <script type='text/javascript'>
   /*
   Simple Blogger Tag Cloud Widget
   by Raymond May Jr.
   http://www.compender.com
   Released to the Public Domain
   */
   
   //Settings / Variables
   var max = 150; //max css size (in percent)
   var min = 70; //min css size (in percent)
   var showCount = false;  // show counts? true for yes, false for no
   var minCount = 1;  // what is the minimum count for a tag to be shown? 1 for all
   
   
   //Begin code:
   var range = max - min;
   
   //Build label Array
   var labels = new Array();
   <b:loop values='data:labels' var='label'>
   labels.push(&quot;<data:label.name/>&quot;);
   </b:loop>
   
   //URLs
   var urls = new Array();
   <b:loop values='data:labels' var='label'>
   urls.push(&quot;<data:label.url/>&quot;);
   </b:loop>
   
   //Counts
   var counts = new Array();
   <b:loop values='data:labels' var='label'>
   counts.push(&quot;<data:label.count/>&quot;);
   </b:loop>
   
   //Number sort funtion (high to low)
   function sortNumber(a, b)
   {
   return b - a;
   }
   
   //Make an independant copy of counts for sorting
   var sorted = counts.slice();
   
   //Find the largest tag count
   var most = sorted.sort(sortNumber)[0];
   
   //Begin HTML output
   for (x in labels)
   {
   if(x != &quot;peek&quot; &amp;&amp; x != &quot;forEach&quot; &amp;&amp; counts[x] >= minCount)
   {
   //Calculate textSize
   var textSize = min + Math.floor((counts[x]/most) * range);
   //Show counts?
   if(showCount)
   {
   var count = &quot;(&quot; + counts[x] + &quot;)&quot;;
   }else{
   var count = &quot;&quot;;
   }
   //Output
   document.write(&quot;<span style='font-size:&quot; + textSize + &quot;%'><a href='&quot; + urls[x] + &quot;' style='text-decoration:none;'>&quot; + labels[x] + count + &quot;</a></span> &quot; );
   }
   }
   </script>
   <br/>
   <span style="font-size:80%;float:right;">Powered by <a href="http://www.widgetsforfree.blogspot.com">Blogger Widgets</a></span>
   </div>
   </b:includable>
   </b:widget>

Step 5: Previewing the New Tag Cloud

Before saving the template make sure to click preview. The new tag cloud should now be visible. If not, make sure that you've completed all the steps correctly.

Read More

Recent Posts Widget for Blogger with Thumbnails, Summaries, Comments, etc

Display beautifully crafted links to Recent Posts on your blog with this widget. You can easily customize whether or not you would like to display thumbnails, post summaries, and the number of comments for each post along side the titles.

 

 

 

Features and Customization:

1. The Recent Post Titles
2. Display Post Thumbnails
3. Choose which blog posts to display (choose URL).
4. Display Post Summaries
5. Length of Summaries
6. Display Post Date
7. Display Number of Comments on each post
8. Display Read More Link
9. Display separator between posts
10. Number of Posts do Display
11. Determine height

Install the Recent Post Widget on Your Blog:

This widget is very simple to install. Just simply click the button below to choose which blog you would like to implement it on.
 

Read More

10 Facebook Widgets and Tools for Your Website and Blog

Facebook is the largest social networking site with more than 400 million active users and is growing larger every day! Make sure to use these Facebook widgets for your website or blog to connect with your large Facebook audience. You can use these tools to easily share certain profile information, websites, blogs, and businesses with the Facebook community.

Personal Profile Widgets

Like BadgeDisplay your Facebook pages for all to see.

Paras Singh likes

Zuketech Blog

Profile Badge
Create a Facebook profile badge to share selected profile information on your website. A profile badge will allow your users to easily connect with you and add you as a friend.

Photo BadgeThis photo badge allows you to share your Facebook photos on websites and blogs. Choose from a vertical, horizontal, or two-column layout and also choose the number of photos to be displayed.

Basic Widgets for Website or Blog

 Like Box

 This allows your users to publish their content and activity to Facebook. 

 

 Share Button

A powerful facebook widget which allows your visitors to share your content on Facebook! An excellent Facebook widget for blogger.

Page Badge
Lets you share your Facebook page (one that you have created) information on your website.

Twitter Link

Connect your Facebook page with Twitter. Whenever you update your Facebook page, your twitter followers will be updated as well with a tweet. A great Facebook widget for your website!

Developers Widgets for Website or Blog

Like Button

Allows facebook users to share web pages from your website on their profile. 

 

Comments Box
Lets your users comment on your website content with their Facebook account.

Recommendations
Provides your website users with personalized suggestions for pages to visit.

Live Stream
Lets Facebook users to post and share content in real-time.

Activity Feed
Lets users know what their facebook friends are doing on your website through comments and likes.

Login Button
Displays a login button along with profile pictures of facebook friends who have already signed up.

Facepile
Shows profile pictures of people who have liked your facebook page or have signed up for your webpage.

Registration

Another way for users to sign up for your site.   

Read More