April 2013

How to add Facebook login button connect to Blogger

Step 1:

Create an facebook app from developers.facebook.com

Step 2:
Now open template editor and put the below code between <body> tags.

<div id="fb-root"></div> <script>
window.fbAsyncInit = function() {
FB.init({appId: 'your app id', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

Step 3:
Now you need to simply add the html javascript gadget to blog and paste the widget code

Code for facebook button widget is
<div class="fb-login-button" data-show-faces="false" data-width="200" data-max-rows="1"></div>

You can value for "false" to true to show face, width and rows can also be changed according to you.

How to write HTML Java code inside blogger blog post

If you have ever tried writing HTML/Javascript code in your blogger blog post then you might have found that it does not appear as code in the post. Instead the code is interpreted and displayed.
The above problem can be simply fixed by replacing < with < and > by < . Here we are providing a few elegant ways to do this.

Method 1

1) Open notepad and paste your code in it.

2) Hit ctrl+h or choose Edit > Replace

3)In Find what: box type < and in Replace with: box type < and hit Replace all button Similarly for > type > in

4)Find what: box and > in Replace with: box.

5) Your are done, the code is ready to be used in your post.

Method 2

The next method is the official solution from blogger. If you need to write html code in your post just select post options and in compose settings choose Show HTML literally. Any code now written will not be interpreted as HTML.

How To Show Post Title Only on Home Page in Blogger

Note : This tutorial was updated. Now it will work without giving XML error messages.

1.Login to your blogger dashboard--> layout- -> Edit HTML

2.Scroll down to where you see

tag .

3.Copy below code and paste it just before the tag .

<style type='text/css'>

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

.post {
margin:.5em 0 1.5em;
border-bottom:0px dotted $bordercolor;
padding-bottom:1.0em;
height:50px;
}
.post h3 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:20px;
font-family:Tahoma,Georgia,Century gothic,Arial,sans-serif;
font-weight:normal;
line-height:1.4em;
color:#cc6600;
}

.post h3 a, .post h3 a:visited, .post h3 strong {
display:block;
text-decoration:none;
color:#cc6600;
font-weight:normal;
}

.post h3 strong, .post h3 a:hover {color:#333333;}

.post-body {display:none;}
.post-footer {display:none;}
.comment-link {display:none;}
.post img {display:none;}
.post blockquote {display:none;}
.post blockquote p {display:none;}
h2.date-header {display:none;}
.post-labels {display:none;}
.post-rating {display:none;}

</b:if>
</b:if>

</style>

4.Now Save your template.

5.Go to Layout-->Page Elements.Click on "Edit" link of Blog Posts Section.

6.Enter the value for "Number of posts on main page:" as your choice and click on save.

Buzzerrs

How to add Facebook login button connect to Blogger

How to write HTML Java code inside blogger blog post

How To Show Post Title Only on Home Page in Blogger