Adding New Google+ Badges In Blogger

• Go To Google+ Badges

• First select the profile in the "Google+ User" area.
• Choose What you want Icon or Badge in features.
• Here in layout youve two types of layout. Portrait is vertical layout whenever landscape is horizontal. Choose which one you want.
• Choose width of the badge which may set in the area where you want to implement.
• Choose the color theme.
• In the last there some other advanced settings which you can easily set there.
• Finally, after setting the badge, Youll get the code in the right side below live demo 
• Copy the code and save it in notepad.

• Now Go To Blogger >> Layout >> Add a Gadget
• Choose "HTML/JavaScript"
• Paste The Code In Content Area.

• Hit "Save Button" and Thats it.

Add 4 killer effects to blogger posts

Add shadow effect around blogger posts

.post
{
box-shadow:1px 1px 4px #dcdcdc;
-moz-box-shadow:1px 1px 4px #dcdcdc;
-webkit-box-shadow:1px 1px 4px #dcdcdc;
-goog-ms-box-shadow:1px 1px 4px #dcdcdc;
}

Leaf effect for blogger posts

.post
{
border:1px solid #dcdcdc;
border-top-right-radius:50px;
-moz-border-radius-topright:50px;
-webkit-border-top-right-radius:50px;
border-bottom-left-radius:50px;
-moz-border-radius-bottomleft:50px;
-webkit-border-bottom-left-radius:50px;
padding-top:10px;
padding-bottom:10px;
padding-right:10px;
padding-left:15px;
}

Add rounded corner effect to blogger posts

.post
{
border:1px solid #dcdcdc;
border-radius:20px;
-moz-border-radius:20px;
-webkit-border-radius:20px;
}

Add multicolor Neon effect to blogger posts

.post
{
box-shadow:1px 1px 4px #7fbf4d;
-moz-box-shadow:1px 1px 4px #7fbf4d;
-webkit-box-shadow:1px 1px 4px #7fbf4d;
-goog-ms-box-shadow:1px 1px 4px #7fbf4d;
}

How to add these effects to blogger posts ?

Social networking buttons, plugins and widgets are known as one of the most important things for a blog as it helps in various places like gaining more traffic from social sites, allowing readers to share your posts and many more. Previously, we had shared many social and as well as other widgets which are placed in our widget library and today were going to share another beautiful widget which is going to help you and your blog from many sides.

Horizontal Social Buttons Bar

This is the horizontal social sharing button bar which were going to share today. This looks beautiful in the design as the buttons are placed in good manner and each button is separated in squares. This social buttons bar comes with a title which will help to get more shares and four different buttons from different social sites. These four buttons are Twitters tweet button, Facebooks like button, Google Pluss +1 button and Stumble Upons stumble it button. These all buttons are from well reputed social sites which are being used widely in the world and they will definitely help you, me and other or whoever use this, will get good number of traffic towards his blog from these social sites. And there is nothing to do for receiving traffic, you just need to place those buttons on your blog and your readers will automatically do the job if youve some loyal readers. I mean, they will socialize your content which can help you to receive good traffic. Basically, these buttons are built with XML, CSS, HTML and JavaScript which are used by developers of these buttons to prepare them. Weve customized the coding of these buttons in such way that they will only load when theyre needed and it really helps in improving the page load speed of your blog and it is also important to take a note about it while implementing new things in your blog.

Adding Horizontal Social Buttons Below Post Title In Blogger

Implementing this new horizontal social bookmarking button bar below post title in blogger is not a difficult task but you might need a hint or help if youre newbie so below were going to guide you step by step on how can we do this. 

• Go To Blogger >> Template >> Backup Your Template
• Click Edit HTML and Find For </head> 
• Just Above </head> Paste The Following Code.

<b:if cond=data:blog.pageType == "item">

<script type=text/javascript>

// Twitter
(function (a, b, c){var d=a.getElementsByTagName(b)[0];if (!a.getElementById(c)){a=a.createElement(b);a.id=c;a.src="//platform.twitter.com/widgets.js";d.parentNode.insertBefore(a, d)}})(document, "script", "twitter-wjs");
// Stumbleupon
(function (){var a=document.createElement("script");a.type="text/javascript";a.async=true;a.src="https://platform.stumbleupon.com/1/widgets.js";var b=document.getElementsByTagName("script")[0];b.parentNode.insertBefore(a, b)})();

</script>


<style type=text/css>

/*Social Bar By Blogger Yard ----------------------------------- */
#SocialBar {
    float: left;
    border-top: 1px solid #eaeaea;
    border-bottom: 1px solid #eaeaea;
    width: 610px;
    margin-bottom: 20px;
    margin-left: -10px;
    margin-top: 10px;
}

.headingsharer h5 {
    float: left;
    padding-right: 20px;
    padding-top: 18px;
    text-transform: uppercase;
    font-weight: bold;
    margin: 0px;
    padding-left: 10px;
}

.tweeetero, .fbwolo, .g-plusones, .stumblo {
    float: left;
    border-left: 1px solid #eaeaea;
    padding-left: 18px;
    padding-top: 15px;
    padding-bottom: 10px;
}

.g-plusones {
    margin-left: 20px;
}

</style>

</b:if>

• Click Save Template and Youre Half Done!
• Now Search For <div class=post-body entry-content>
• And Above It Paste The Following Code.

<b:if cond=data:blog.pageType == "item">
<div id=SocialBar>
<div class=headingsharer>
<h5>SOCIALIZE IT ?</h5>
</div>
<div class=tweeetero>
<a class=twitter-share-button expr:data-text=data:post.title expr:data-url=data:post.url href=https://twitter.com/share>Tweet</a>
</div>
<div class=fbwolo>
<iframe allowtransparency=true expr_src="//www.facebook.com/plugins/like.php?href=" + data:post.url + "&send=false&layout=button_count&width=80&show_faces=false&action=like&colorscheme=light&font&height=21" frameborder=0 scrolling=no style=border:none; overflow:hidden; width:80px; height:21px;/>
</div>
<div class=g-plusones>
<div class=g-plusone data-size=medium expr:data-href=data:post.url/>
</div>
<div class=stumblo>
<su:badge expr:location=data:post.url layout=1/>
</div>
</div>
</b:if>

• Click Save Template!
• Youre Done!

Unremovable widgets in blogger - Solution

Often bloggers encounter problems, where they download templates from a third party site and then try and edit it as per their wishes. But many a times they find a problem, that the widgets from the third party templates cannot be removed, using the conventional techniques.

So whats the solution, simple, HTML trumps CSS.

i.e. usually when you want to change a particular widget, you go to

your Dashboard --> Layout
then click on edit button corresponding to the widget to be changed.

 

Youre then redirected to a pop-up which opens up the properties.
Unlike usual widgets, they will not have a remove button.

 

So heres the solution, Go to Dashboard ---> Template ---> Click on Customise and proceed.

 

Find out the piece of code>Ctrl+F>>>>      b:widget id=
Recognize your widget name and change the parameter, locked=true to locked=false
Now try the above process for any other widget.

  

 Then go to Layout and remove the widget, manually. 

Option 2: 

After Step 2, remove all <b:widget... to </b:widget> section then Save template.

More Tricks Keyboard Dancing Led Light Trick Learn To Make Dangerous Virus In A Minute How To Open Number Of Sites With A Single Click ? How to Lock a Folder in Windows 7/8/8.1 Remove b:widget section

With Option 2 you can delete any widget you want, but be careful, any mistake can make your template not work well.

This was an article on

Note:-As always, if you would like to leave a sensible comment, then please do so in the comments section below.

Embed PowerPoint Presentation in Blogger With SlideShare

• Create Your PowerPoint Presentation and Save it.
• Go To SlideShare and Make Your Account There.
• Sign in To Your SlideShare Account.
• Click Upload Button at The Top Bar in Right Side.

• There You Can Easily Upload The PowerPoint Presentation and Setup It Like Adding Title and Description.
• Once It is Uploaded Then You Can Embed it in Blogger.
• Open The SlideShare Which You Want to Embed.
• Click The Embed Button at The Top.

• After Clicking Embed Button, It Will Show a Box With Embed Coding.
• Click The Copy Button to Copy That Code.

• When It Shows "Copied" Then
• Go To Blogger >> Create New Post >> HTML Tab
• Paste The Copied Code in HTML Tab.

• Now You Can Do Further Changes or Prepare The Post.
• At Last, Click "Publish" Button To Complete It.
• Thats It.

Final Words