How to Restore the Blog Template

I share "How to backup Blogger template" with two Methods. Now you have a backup of your Blogger template. Now you can make changes to your template and if anything goes wrong you can simply restore the template.

How to Restore the Blog Template

In this time, I also share with two methods for restoring the blog template.

Method (1)

I think you have any problem. So, you try to restore your template. Now, you are still in Blogger and logging in. No problem!
(1) If you are log out, log in again to www.blogger.com .
(2) Go to your blog Dashboard by clicking your blog name.

(3) In your blogs dashboard's left side menu, select Template.

(4) Now in the top right corner you can see Backup/Restore button, Click it.

(5) Open the new box and select Browse button.

(6) When File Upload dialog box is open, search and choose your backup template file and hit the Open button.

(7) Wait a little time for Uploading. When the upload is complete, the Backup / Restore box is automatically closed.

(8) Check and View your Template Change.

Method (2)

This method is use when you backup with my backup method (2).
(1) I believe you, to start the first three step. If you not sure, see in method (1) section.
(2) When you reached the Template section, hit the Edit HTML button.

(3) Don't afraid, select all of your code and Delete (click anywhere of code section and press Ctrl+A and press Delete key.)

(4) Now, minimize your browser windows and open your save backup template code file (which is you get in Backup method (2)) and select all codes and then copy this.

(5)Go to your browser windows and paste the code in the Code area (which area is you deleting the codes)
(6) And then Save your Template.
Checking and View your Blog.
That is all of my sharing.
Thank!

Read More »

How to backup Blogger template

This is very useful and important for all Blogger. All blogger will change their blog Template for many reason, which they change style, color, size, communication, plug in, and other. The blog Template is very sensitive. We must carefully change any Code from this.

Are you planning to make changes to your Blogger template?
But before making changes to your Blogger template you must first backup your Blogger templates. Backup is really essential for Bloggers. When editing there are chances for your template to crash and it will affect the complete site layout. At that instance you can revert it to your previous template by restoring it from backup. Backing up Blogger template is really simple as you can see below.

How to backup Blogger template

Method (1)

(1) Log in your Blog at www.blogger.com
(2) In your Blogger Home, Click on your Blog Name (This is you want to Backing up)

(3) In your blogs dashboard's left side menu, select Template.

(4) Now in the top right corner you can see Backup/Restore button, Click it.

(5) Open the new box and select Download full template.

(6) New dialog box open, choose the Save File and hit the OK .

(7) When download complete, you open the download file location on your Computer. You can see the backup template file as "template-xxxxxxxxxxxxxxxxxxx.xml" (Where, 'x' is represent the number). This file name is very difficult to recode for you. So, I advice to rename this file as you like simply. (I recode my backup Template file as Day/Time.)

Method (2)

This is simple method to backup your blog template. I like this method and use.
(1) Also in this method, you will act the step (1) to (3) are the same as Method (1). But you start the method (2) in this step (3) by Clicking the Edit HTML. See this scream shoot.

(2) When the HTML Editor is open, Click the " ◄ " for Expand your Code.

(3) Select all your Code (Click any where in the code area and press Ctrl+A , this easy)
and Copy your Code ( Mouse Right Click in selecting code area and select Copy menu (or) easily press Ctrl+C )

(4) Open your any text editor; such as Note Pad and Paste your copy codes. (this easy by press Ctrl+V )

(5) Save your text editor in your Computer. This Code file is YOUR BACK UP TEMPLATE file.

That for all of my post. Next post , I will share about "How to Restore the Blog Template".
Thank!

Read More »

To Enable Third Party Cookies for Browsers

What are cookies? 

Here are a few over-lapping definitions;

• A small data file placed on your computer by a website that you visit.
• A piece of code placed in your browser by a website server.
• A text file placed on a hard drive to store and transmit information to the server of websites (re)visited from that browser / computer.

What is a (third-party) cookie?

• A cookie is a small script placed on the hard drive of  your computer by the server of a website that you visit. The cookie is placed there for the purpose of recognising your specific browser / computer combination, were you to return to the same site.

All cookies have an owner which tells you who the cookie belongs to. The owner is the domain specified in the cookie.
The word "party" refers to the domain as specified in cookie; the website that is placing the cookie. So, for example, if you visit widgets.com and the domain of the cookie placed on your computer is widgets.com, then this is a first-party cookie. If, however, you visit widgets.com and the cookie placed on your computer says stats-for-free.com, then this is a third-party cookie.

As Blogger becomes both easier to use, and more full of features, it becomes an application with more code that runs on our computers.
The code on our computers requires both cookies and scripts, installed on our computers as we use the various Blogger utilities. The cookies and scripts are increasingly susceptible to damage, from improperly implemented layered security.
Cookies and scripts are considered separately, and differently, for each different browser.

How to Enable 

Internet Explorer
To Enable Third Party Cookies in Internet Explorer 7
1. Click on "Tools" on the menu bar and then click on "Internet Options".
2. Click on the "Privacy" tab. Select the "Advanced" button under "Settings". The "Advanced Privacy Settings" window should now open.

3. Check the "Override automatic cookie handling" box so that you now have access to the "First-party Cookies" and "Third-party Cookies" options.
4. Select "Accept" for "Third-party Cookies".

Mozilla FireFox
To Enable Third Party Cookies in FireFox 3
1. Click the "Tools" menu
2. Click "Options..."
3. Select the "Privacy" menu
4. Check the "Accept third-party cookies"
5. Make sure "Keep until" is set to "they expire"

Chrome
To Enable Third Party Cookies in Google Chrome 12
1. Select the Wrench (spanner) icon at the top right
2. Select "Options"
3. Select the "Under the Hood" tab
4. Select "Content settings" in the "Privacy" section

5. Uncheck "Block sites from setting any data".

Safari
To Enable Third Party Cookies in Safari 4
1. Click the "Safari" menu
2. Click "Preferences..."
3. Click the "Security" menu
4. For "Accept cookies" select "Always"

That all.
The browsers programs are update anytime. So, some setting are change. If you have any problem for this, connect to me.

Read More »

Comment Box for Blogger

Today, I am very afraid because my blog have no comment box. I can't find the comment box under my blog post. I do not change any code from blog's HTML.
I search about this and troubleshooting this. I share about how to check and reset the blog to show the comment box.
There are many reason for this problem, but I make two step easily.

First Check;

I check Comment Location Setting as follow;
Go to Blogger and Log in my blog.
Click my Blog name and proceed to Settings >> Posts and comments (which is left side of the window)
In the right side of the windows Comments section will show.
You must check the Comment Location. There are four type of location.
(1) Embedded : This loads the comments under the post article.
(2) Full page : This loads a whole new Full Page which shows the comments.
(3) Popup window : This loads the comments in a Popup Window.
(4) Hide : This hide the comment box from blog.
You can choose upper three types but don't choose the last type. If you choose the Hide setting, there are no comment box in your blog post.

Second Check;

I check my posts for comment box well show. At some post, the comment box still hide. I checking the post with hide comment.
Go to Posts from left side and click Edit switch under the required post title.
Left side of the post editor window, you will see Options and click on this.
You must choose Allow from Reader comments section. If you choose "Don't allow, show existing" or "Don't allow, hide existing" , the comment will not show or block in your post.

Click under Done button and Update your post.
That all of my checking and I can see all comment in my blog.
Thank!

Read More »

Removing Showing post with label..

In Blogger, we set the posts with suitable label. The label is helpful for visitors when they search the post as require. When I click in a label, the blogger filters the posts tagged with that particular label. This is very good feature for blog. Unnecessarily, I don't need a big box saying the "Showing posts with label ......... Show all posts". I hate this feature.

So, I remove this feature from my Blog. If you also unlike this feature, you can also remove this as follow;

Steps

1. Log in to your blogger account
2. Go to Template >> Click Edit HTML
3. Using Ctrl+F  search the following part of code : (Click anywhere inside the editor and press CTRL + F )

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

4. When you find above code lines, you recode the code line number in your mind. Copy the below codes and replace in above code. (If you have more confidence over Edit HTML, you can Delete the above codes and Add the below code same place.)

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

5. Save your Template and View your Blog. You must checking this feature by clicking your any Label.
Thank!

Read More »

Add Custom Post Footer

Yesterday, I share many post about "How to Remove ....?".
Today, I share "How to Add ...? . :)
For customize the Blog, there are many way To Change, To Remove, To Add, To Edit and To Hide. Many Bloggers are share in there blog about that. I also sharing the Testing Code for Customizing the blog by test my Blog "www.mmblogchitthu.blogspot.com" .

Now, I'm going to share you how to add a custom post footer in your blog. It looks beautiful, attractive and very cool. I'm sure you guys will like it! This new footer has a really beautiful design. It specifies Post Author name, Publication date or time and number of comments. And here lies the good thing. It also has beautiful icons.

Start my sharing with step by step;

Steps

1. Log in to your blogger account
2. Go to Template >> Click Edit HTML
3. Using Ctrl+F  search for this tag:(Click anywhere inside the editor and press CTRL + F.)

]]></b:skin>

4. Just paste the following code above ]]></b:skin>.

.post-footer {
display: none !important;
}

Note : This code is to Hide/Disable your default Post footer. I share about "Post Footer Section Fully Remove from Blog" . If your do it and your blog have no post footer, you do not create this step(4).
5. Again make by pressing CTRL + F and search this code in your template;

<div class='post-footer'>

Note : Upon your Template style, you can see two or three time this code. Any, move towards the second one.
6. Paste the following code above that match (the second <div class='post-footer'> match in the search).

<style>
@import url(//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css);
@import url(http://fonts.googleapis.com/css?family=Lato);
.postmeta-primary {float: left;text-transform: capitalize;font-family: &#39;Lato&#39;, Arial, sans-serif;margin-top: 20px;width: 100%;border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;padding-top: 10px;padding-bottom: 10px;}
.postmeta-primary .fa {margin-right: 10px;}
.postmeta-primary a{text-decoration: none;}
.author2, .meta_date, .meta_comments {margin-right: 10px;padding-right: 10px;border-right: 1px solid #ddd;}
.author {text-transform: uppercase;}
.icon-user:before {content: &quot;\f007&quot;;}
.icon-calendar:before {content: &quot;\f073&quot;;}
.icon-comments:before {content: &quot;\f086&quot;;}
[class^=&quot;icon-&quot;], [class*=&quot; icon-&quot;] {font-family: FontAwesome;font-weight: normal;font-style: normal;text-decoration: inherit;-webkit-font-smoothing: antialiased;position: relative;}
</style>
<div class='postmeta-primary'>
<span class='author'><i class='fa icon-user'/><a expr:href='data:post.authorUrl' rel='author' target='_blank'>
<data:post.author/></a>
</span>
<span class='meta_date'><i class='fa icon-calendar'/><a><data:post.timestamp/></a></span>
<span class='meta_comments'><i class='fa icon-comments'/>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 0'>No Comments<b:else/> <b:if cond='data:post.numComments == 1'><data:post.numComments/> Comments<b:else/><data:post.numComments/> Comments</b:if> </b:if></a>
</b:if>
<div style='clear: both;'/>

7. Now , Save your Template and View your change.

Read More »

Remove White Space Above Blog Header

Today, I hide(remove) the default blogger's Navigation bar. The white space area that above the blog header is huge. I don't want this area. This space often interferes with the blog's design by pushing down the header.
It can be utilized to display - ads, navigation menu, social networking buttons and much more. So why waste it?
Here's
how you get rid of the empty space left after removing the Navigation bar:

Steps

1. Log in to your blogger account
2. Go to Template -> Click Edit HTML
3. Using Ctrl+F  search for this tag:

</head>

4. Now add the following code just above the </head> tag:

<style type='text/css'>
.content-inner
{
margin-top: -40px !important;
}
</style>

5. Preview the template before saving.
End of my Sharing .

Read More »

Remove and Customize Blogger Attribution

Many Bloggers are using the Template by Blogger Template Designer. All of them have an attribution at the bottom of the blog. by default, Blogger templates include attribution gadget at the bottom of each template. The Attribution gadget is the gadget in the footer that says "Powered By Blogger".
Most of  the blogger dislike this and try to edit normally. But, the Blogger is don't allowed to fully edit or remove this widget. If you have tried to remove this then you may noticed that gadget is locked and you are able to modify only the "Copyright" statement from the widget. Fortunately, I read about "How to Remove or Customize Powered by Blogger Attribution widget" at ThingsGuide blog. So I am sharing this today. Follow me and we will make Ste-by-Step;

Steps :

Important Notice : Always Back Up Your Templates before Making Any Changes On it.
1. Go to Design > Edit HTML
2. Click Ctrl+F  and Search for the code below in your template.

<b:widget id='Attribution1' locked='true' title='' type='Attribution'>

3. Now change the locked value 'true' to 'false' in the line of code.

<b:widget id='Attribution1' locked='false' title='' type='Attribution'>

5. Now find the code similar below,

<b:section class='foot' id='footer-3' showaddelement='no'>

6. Now change attribute value showaddelement no to yes as below,

<b:section class='foot' id='footer-3' showaddelement='yes'>

7. Save your template.
8. Go back and navigate to Layout tab.
9. Find Attribution element bottom of your page.

10. Click on Edit

11. Now click on Remove button.

Now Attribution element has been removed. You can add another element using bottom Add a Gadget link to add custom attribution.That All; Thank!

Read More »

Remove or Hide Post Footer from Desire Pages

I am learning more about of remove or hide the footer section of blog. Mostly, we customize our blog template to get more attention from visitors, like trying out stylish widgets, using different font styles etc. But sometimes we think, how to change the way some components appear on homepage, such as default Post Footer. Actually, its better to show it only at post pages.
Jump breaks (Read more) are great because they allow you to display snippets of blog posts on your home page. But if you are a blogspot user then Unfortunately, by default it displays the footer for each post, which really clutters up your home page.
Don't worry, I have the good news as follow;

1. Remove or Hide Post Footer from Homepage/Index Page
2. Remove or Hide Post Footer from Post and Static Pages

Now, I sharing about this step-by-step;

(1) Remove or Hide Post Footer from Homepage/Index Page

Sometime you may feel, its better to show it only at post pages but not on homepage. Did you land here with that thought in your mind? Then you can learn it from here. There is no option provided by Blogger to remove you Post Footer but customize. So to remove or hide Post Footer from you blog Homepage, you have to dig into your template.
Note: Before editing your template, you may want to backup or copy of it.

Steps

1.Go to Blogger Dashboard >> Template >> Edit HTML.
2.Now press Ctrl+F and find this

]]></b:skin>

3.Now paste the below given code after ]]></b:skin>

<style type='text/css'>
<b:if cond='data:blog.pageType == "index"'>
.post-footer {display:none !important;}
</b:if>
</style>

4. Preview your blog to confirm changes and Save template.

(2) Remove or Hide Post Footer from Post and Static Pages

If you are like to disable your post footer from other pages while keeping it on homepage, you can try below method.

Steps

1.Go to Blogger Dashboard >> Template >> Edit HTML.
2.Now press Ctrl+F and find this

]]></b:skin>

3.Now paste the below given code after ]]></b:skin>

<style type='text/css'>
<b:if cond='data:blog.pageType != "index"'>
 .post-footer {display:none !important;}
 </b:if>
 </style>

4. Preview your blog to confirm changes and Save Template.
 This is my ending of sharing. If you get any helpful, please re-share this post.
Thank!

Read More »

Post Footer Section Fully Remove from Blog

The Post Footer that is set by default in Blogger looks very ugly! Even if the whole blog is beautifully designed but the post footer isn't good then it would make a very bad impression.
Post Footer are useful in blogs, but when you get more professional in blogging you will find that it's not important. Visitors get the information of Author from this. Most of the professional blogger has removed it and in place of it they put their own sharing buttons.
I am not a professional blogger but I sharing the codes which is Remove the post footer section.
I have no idea about CSS and HTML, but I test all about of this post in my blog. When you are new to blogger you want to customize your blog according to your choice such as add a stylish menu bar for your blog, Customize your post footer options and much more.
(I sharing about How to Remove Post Footer from Homepage/Index Page at next post.)
OK! Start my work :)

Remove Post footer from Blog

This can be easily done by CSS, a small code of CSS can hide anything on your page.

1. First go to Blogger Dashboard >> Template >> Customize >> Advanced >> Add CSS
2. To remove the post footer we will add this small line of CSS code in the  custom CSS text area.

.post-footer
{
display: none;
}

Now, click Apply to Blog (at right corner) and View Blog.
Your Blog will look more neat and clean :) .

I test the other way for Remove Post footer from Blog as follow;
Step 1 : Go to Blogger Dashboard
Step 2 : Click on Template
Step 3 : Click on Edit HTML
Step 4 : Search this code

.post-footer {

add below code after above code

display: none;

Step 5 : Click on Save Template.
Now go to your blogger blog and check post footer in your blogger.
This is all my sharing. If you get any helpful , re-share my post :)
Thank!

Read More »

Automatic Read More feature for Blog Posts

This feature is useful for blogging. The blog loading time is reduce and the visitor is reading the some text from the post.
In the Blogger, default feature of Read More... was added. It's called Jump break. But, the blogger (or) Author is adding that by manual. So, this is a knotty problem for Author.
In this post, I share :) How to make posts in the blog homepage to be displayed with an automatic "read more" button and a thumbnail.
My network connection is very slow. So I directly share the screen shoot and code from Helplogger. (Helplogger is very useful blog for my learning.)
OK, start the work!

Step 1. 

From your Blogger dashboard, go to Template and click on the Edit HTML button:
(Oh! ... I advise to Back Up your Template before hit the Edit HTML button.)

Step 2. 

Click anywhere inside the code area, then press the CTRL + F keys and search for this code:

<data:post.body/>

Note: after hitting Enter, you'll find this code more than once but you need to stop at the second one. (When I change my template, I find three times and recode code line number, example: I find first at line no. 1381 , second is find at line no. 1509 and third is find at line no. 1514. So, I decide the line no. 1509.)

Step 3. 

Replace the code above with this one:

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
  <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span class='readmore' style='float:right'><a expr:href='data:post.url'>Read More &#187;</a></span></b:if></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>

Step 4. 

Now search for the following tag:

</head>

Step 5. 

Just above the </head> tag, add the following code:

<script type='text/javascript'>
posts_no_thumb_sum = 490;
posts_thumb_sum = 400;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = posts_no_thumb_sum;
if(img.length>=1) {
imgtag = '<span class="posts-thumb" style="float:left; margin-right: 5px;"><img

src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height

+'px"/></span>';
summ = posts_thumb_sum;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

Note:

• To change the number of characters shown when there is no thumbnail, modify the 490 value in blue. For the number of characters shown when a post has a thumbnail, modify the 400 value.
• If you want larger thumbnails, modify the values (120) in red.

Step 6. 

Click on the Save template button to save the changes.
This is the finished of my sharing.
If you want to view the orginal post and reading the knowledge of Blogger, Go to Helplogger.
Thank !

Read More »

Blog , Blogger , Blogging

 

What is a “blog”?

You can find about 4,040,000,000 results answers (and counting) to that specific question via Google but I wanted to present the answer in a few different ways so that you, as the new guy or gal, can get it, or if you know someone who wants to know then you can pass them this post.

Let’s start simply, shall we?

Simple Definitions:

Here are a few very simple definitions that can get you started. If you find these to be good enough for you then you’re done reading this post!

• A blog originally came from the word “weblog” or a “web log”.
• You can think of it as an online journal or diary, although blogs are used for much more now, like online journalism.
• A blogger is someone who blogs, or writes content for a blog.
• Blogging is the act of writing a post for a blog.

Got it? That was easy, and that’s all you might need to know to get started.

ntermediate Definitions:

Want a little more “meat” on your blogging-knowledge bones? Try these definitions on for size:

• A blog is a type of website which has posts (or entries) appearing in reverse chronological order.
• Blog posts typically appear with the most recent blog post (or entry, post) first, just like a diary or journal.
• A blog is typically updated frequently and regularly, although there are some who are considered “slow bloggers”.
• Blogs typically have an area for people to comment or respond to the blog post.
• Blogs may also have other areas of content and links to other websites.
• Blogs can have individual authors or be a collection of authors.
• Blogs have a history or an archive of previous blog posts.

Not too bad, right? We’re beginning to describe some of the features of a typically blog.

Advanced Definitions:

If you’d like to complete your education of what a blog is then you can read some of the following “advanced” definitions:

• A blog is a collection of content that is organized repetitively. This content can take the form of basic words (copy) as well as rich media (audio, video, and embeddable objects).
• A blog typically focuses on a particular subject matter for clarity, focus, and
• A blog can be built by hand, manually through writing the post, uploading to a website via FTP, and then publishing.
• A blog can also be managed by software, sometimes called a CMS (Content Management System), where a lot of the features are automatically created and populated.
• A blog typically can be read in a number of different formats including the homepage, single post page, categories, tags, and also via RSS and other such syndication technologies.
• Readers and visitors can subscribe to the blog so that they can consume the content in a variety of different means, tools, devices, and applications.
• A blog today could take the form of microblogging (like Twitter, Posterous, Tumblr), vblogging (video blogging), and more which can focus on a particular type of content or technology.

Whew. Done yet?

Super Geek Definitions:

Finally, if you’re just bored, have too much time, or are exceptionally curious, here are a few super geeky definitions that I came up with:

• A blog can be whatever you want it to be; it’s not about the what but the why.
• A blog is a collection of strategically-placed 1′s and 0′s typically called software.
• Everything is a blog and nothing is a blog, at the same time.
• Blogging is what you do, what you do not do, and what you wish you had done when you did it.

OK, That is my collecting post for Blog , Blogger , Blogging . The original poster is John Saddington .

Read More »