Pages

Showing posts with label useful blogger plugins. Show all posts
Showing posts with label useful blogger plugins. Show all posts

Tuesday, October 4, 2011

best SEO optimisation and suggestion

blogger seo now at an click 
know about your loading speed backlinks etc at one stop provided to you by

blogz guru
enjoy______________________________________________________________________________

let's go there +===>>>>

social bookmarking buttons below post tittles or above posts



The area just below your post titles have more impressions i.e. that area is more viewed by your visitors and if you add social share or bookmarking buttons such as the new Google +1 button, Facebook Like + Send button, tweet button and my favorite addthis button, then there are more chances of getting more likes, digs, stumbles and +1'd. So lets add this beautiful widget to your blogger blogs. You can see them live just below the post titles of this blog.


Adding the Social Share Widget To Blogger

  1. Go To Blogger > Design > Edit HTML
  2. Backup your template
  3. Search for <data:post.body/>
  4. and just above it paste the code given below,
   
<b:if cond='data:blog.pageType == "item"'>
<table border='0'>
<tr>
<td><div style='margin-right:5px;'>
<g:plusone expr:href='data:post.url' size='medium'/>
</div>
</td>
<td><div style='padding-top:6px;'>
<script type='text/javascript'>
tweetmeme_style = &quot;compact&quot;;
</script>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/>
</div></td>
<td><div style='margin-right:25px;'>
<script expr:src='&quot;http://www.stumbleupon.com/hostedbadge.php?s=1&amp;r=&quot; + data:post.url'/></div>
</td>
<td><div style='margin-right:25px;'>
<div id='fb-root'/><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like font='' href='' layout='button_count' send='true' show_faces='false' width='40px'/>
</div>
</td>
<td> 
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_counter addthis_pill_style"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
<!-- AddThis Button END -->
</td>
</tr>
</table> </b:if><br/>

    5.   Next search for </head>
    6.  and just above it paste the following code,
    
<script src='http://apis.google.com/js/plusone.js' type='text/javascript'> {lang: &#39;en-US&#39;} </script>

    7.  Save your template and you are done!


Monday, October 3, 2011

blogger dynamic views looks great



.blogspot.com

Dynamic Views: seven new ways to share your blog with the world

 when we launched a completely rebuilt, streamlined authoring and editing experience, we’re in the process of bringing you a much improved and modernized Blogger. The next phase of these updates starts today with seven new ways to display your blog, called Dynamic Views.

Built with the latest in web technology (AJAX, HTML5 and CSS3), Dynamic Views is a unique browsing experience that will inspire your readers to explore your blog in new ways. The interactive layouts make it easier for readers to enjoy and discover your posts, loading 40 percent faster than traditional templates and bringing older entries to the surface so they seem fresh again.


Dynamic Views is much more than just new templates. With just a couple clicks, you’ll get infinite scrolling (say goodbye to the “Older posts” link), images that load as you browse, integrated search, sorting by date, label and author, lightbox-style posts for easy viewing, keyboard shortcuts for quickly flipping through posts, and one-click sharing to Google+ and other social sites on every post.


No two blogs are the same, so you can choose from seven different views that display text and photos differently. For example, if you have lots of photos on your blog, you may prefer Flipcard or Snapshot. If your blog is more text-heavy, then Classic, Sidebar (what you’re seeing now on Blogger Buzz) or Timeslide may be preferable. Here’s a quick description of each of the new views, along with links to some of our favorite blogs where you can check each of them out in action.
  • Classic (Gmail): A modern twist on a traditional template, with infinite scrolling and images that load as you go
  • Flipcard (M loves M) - Your photos are tiled across the page and flip to reveal the post title
  • Magazine (Advanced Style) - A clean, elegant editorial style layout 
  • Mosaic (Crosby’s Kitchen) - A mosaic mix of different sized images and text
  • Sidebar (Blogger Buzz Blog) - An email inbox-like view with a reading page for quick scrolling and browsing
  • Snapshot (Canelle et Vanille) - An interactive pinboard of your posts 
  • Timeslide (The Bleary-Eyed Father) - A horizontal view of your posts by time period
Enter the name of your favorite Blogger blog below and click Preview to check it out with Dynamic Views.
.blogspot.com




Adding a Dynamic View to your blog is as easy as changing your template. Log in to Blogger, click on the Template tab on your dashboard, and select whichever view you want to set as your default. Note that readers can still choose to navigate your blog in a different view by selecting from the pulldown in the upper left of the screen.

If you want to add your own touch to any of these new views, you can upload a header image and customize the background colors. We’ll be adding more ways to customize Dynamic Views in the coming weeks.

We hope you enjoy the latest update to Blogger, and that, as always, you tell us what you think by completing

Saturday, October 1, 2011

floating social media share buttons with counters



I have included Facebook Share, Retweet, Stumble, Google Buzz, Digg This andGoogle +1 (plus one) buttons in the bar. Each of them comes with a live counter. The corners of Facebook Share button and counter are rounded to blend with the rest of the buttons (doesn’t work in Internet Explorer, of course). You can add more social bookmarking or sharing buttons later if you wish.
floating social bookmarking buttons

I. Adding the buttons

  1. Login to your Blogger account.
  2. Go to Design > Page Elements.
  3. Click Add A Gadget.
  4. In Add A Gadget window, select HTML/Javascript .
  5. Copy the code below and paste it inside the content box.
    view sourceprint?

    <!-- floating page sharers Start bloggersentral.com-->

    <style type="text/css">

    #pageshare {position:fixed; bottom:15%; margin-left:-71px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;}

    #pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}

    .fb_share_count_top {width:48px !important;}

    .fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}

    .FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;}

    .FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}

    </style>

    <div id='pageshare' title="please share us ">

    <div class='sbutton' id='fb'>

    <a name="fb_share" type="box_count"href="http://www.facebook.com/sharer.php">Share</a><scriptsrc="http://static.ak.fbcdn.net/connect.php/js/FB.Share"type="text/javascript"></script>

    </div>

    <div class='sbutton' id='rt'>

    <script src="http://tweetmeme.com/i/scripts/button.js"type='text/javascript'></script>

    </div>

    <div class='sbutton' id='su'>

    <script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script>

    </div>

    <div class='sbutton' id='digg' style='margin-left:3px;width:48px'>

    <script src='http://widgets.digg.com/buttons.js'type='text/javascript'></script>

    <a class="DiggThisButton DiggMedium"></a>

    </div>

    <div class='sbutton' id='gplusone'>

    <script type="text/javascript"src="https://apis.google.com/js/plusone.js"></script>

    <g:plusone size="tall"></g:plusone>

    </div>

    <div style="clear: both;font-size: 9px;text-align:center;">Get <ahref="http://www.greatwebtips.co.cc/">widget</a></div><!-- Do not remove this link -->

    </div>

    <!-- floating page sharers End -->
    Update
    July 2011: Remove Google Buzz button. Who needs Buzz when you have +1?
    June 2011: Add Google Plus One button.
    July 2010: Add Digg This button. 
  6. Save the gadget.
  7. Drag the gadget and reposition it under Blog Posts gadget.
  8. Click Save button on upper right corner.

II. Customizing

  1. Vertical alignment 
    Change the value of bottom in code line 3. The code positions the button relative to the bottom of your browser window. To fix the distance even when window is resized, specify the value in px (pixels) instead of %.
  2. Horizontal alignment 
    Change the value of margin-left in code line 3. Negative value pushes the button to the left of the main blog column, positive value pushes it to the right. 
    To position the button relative to the left or right edge of browser window, replace the margin-left with left (as in left:10px;) orright (as in right:10px;) respectively.
  3. Replacing and removing buttons 
    You can replace existing buttons with your own. Each button is represented by this code: ?

    <div class='sbutton'>

    BUTTON CODE

    </div>
    To replace the button, simply replace the button code with the new code. 
    To remove the button, delete the whole div.
Update: If somehow your Google +1 button doesn’t appear despite other buttons appear successfully, try this workaround:
  1. Go to Design > Edit HTML and find this line:
    <body expr:class='&quot;loading&quot; + data:blog.mobileClass'>
    or 
    <body>
  2. Copy the code in step I.5 and paste it right below the line.
  3. Replace the margin-left:-71px; in code line 3 with left:10px;.
  4. Preview before saving.
Enjoy!