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 »