Posts

Showing posts from April, 2011

Create a Separate Label or Archive Page in Blogger

Image
I got many emails asking me how did I make a separate page for the labels and archive for my Blogger blog. Well, first get a live example of my explore tutorials page and then see the tutorial for it. The whole process is a complicated one as this includes the proper use of conditional tags to hide a gadget from appearing in other blog pages rather than a particular page. So here we have to create a page and hide the label or archive widget from appearing it in every other pages rather than the separate page that is specially created to show these widgets. At first you have to publish a page. You can just publish a simple post and hide the post or can create a static page . Now add the label widget or the archive widget or both the gadgets from Blogger’s Layout tab and drag them just below the “Blog Posts” gadget (as shown in the picture below) and Save ” it

Show Blogger Gadgets/Widgets in Specific Posts or Pages

Today I will tell you how to show different Blogger gadgets or widgets on different or specific posts or pages. Previously we learned about conditional tags and how to use it. In this tutorial we need these tags to hide the gadgets. So first go to Blogger’s Layout tab and add a “HTML/JavaScript” gadget. I prefer it because it will be easy for everyone to understand. Give it a unique tile so that it does not match with any of the titles of other widgets added (if any).

How to Add Facebook Like Button to Blogger

Image
After Facebook deprecated the share button, the Like button became one of the famous and widely used social sharing button as it let your blog readers to share your posts and articles with their Facebook friends with just one click. When you will visit the official page you will find that there are two different versions of Like button for which the implementation processes are also different. The most flexible one is XFBML but it requires a series of steps before it can be added to any webpage while Iframe version of the Like button is more easy to add. So here we will find out how it can be added to Blogger blogs.

Using Conditional Tags in Blogger

Conditional tags in Blogger are used to tell browsers what to do in certain conditions . It is a great way to do certain things like hiding widgets or gadgets or your share buttons in Blogger. For example, when we want to show “Hello world” on post pages and “Goodbye Cruel World” on every other page then we can use it as: <b:if cond='data:blog.pageType == &quot;item&quot;'> Hello world <b:else/> Goodbye Cruel World </b:if> A conditional tag comes handy when you are designing your Blogger blogs and customizing and editing it from the scratch. But first you need to know how many type of pages are there in Blogger and then how to use these conditional tags respective to that type of page. In this tutorial I will try to cover most of it, so let’s start.

How to Increase the Width of Comment Form in Blogger

Image
In many Blogger blogs you may have found that the default comment form’s width is much smaller than the post body width. When you are customizing the design of your blog then you must be also thinking to increase the width of the Blogger’s comment form. In this simple tutorial I will tell how to expand it. Normally, the default width for the comment form of Blogger is fixed at 425 pixels . So we just need to override this with a CSS definition.

How to Highlight Author Comments in Blogger

Image
Today we will learn to highlight author or admin comments in Blogger so that your comment as administrator stands out from comments posted by others. Blogger has advanced and many new codes are added. So to highlight the author or the admin comment in Blogger you have to just apply some simple trick to activate it. But however, this tutorial is not meant for those who have enabled threaded comments . Here’s an advance method to do it. You will find that not the comment body but the whole section of your comment as admin or other comments as author will change. So first just follow the steps: