Facebook Fan Page Computer Tutorials News Blogging Internet Latest Posts

Today is:

How to resize the width of blogger comment box on your blog

How to resize the width of blogger comment box on your blog

You are here: Home / Tutorials / Blogging / How to resize the width of blogger comment box on your blog

The blogger comment box is one among the major components that creates interaction between a blogger and his/her visitors. This box allows users to express their views about the topic they have read on a particular page by typing text that will be viewed by the a blogger as well as other visitor.

Enabling this feature on your blog is very important. But, you have to customize it so that it becomes one of the key things that make your blog's template eye-catching/attracting to your visitors.

Today I have brought you with the valuable tricks for resizing your blog's comment box if it seems to be larger or less than the way you prefer. We are going to speak the HTML Web designing language to fulfill our task.

Below is a screenshot of a comment box of my mjknetten before I resized. As you can see, it was very wider than it is currently.

No matter how shallow you are in HTML, you will be able to perform this operation in your own as I have made it simple. Follow the steps below:

First Step:

Log in your blogger account as normally as you always do.

Second Step:

Select your blog you want to work on by clicking on its title.

Third Step:

Scroll down-wards and within the left navigation bar, select Template. You will be taken to the blogger template designer

Fourth Step:

Under Live on Blog, click on the Edit HTML button.

Fifth Step:

Click Ctrl on your keyboard and while holding the that same key, hit the F key (Ctrl+F). You will see the text box to the right of the html editor that is designed for searching codes that are in your template. Type the following code and hit Enter on your keyboard:

<iframe allowtransparency='true'

You will be able to see the following code:

<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>

Sixth Step:

Change the value of the width attribute. By default, the comment box's width depends of on the width of the column in which the comment box resides. As you can see our code above shows that the width of the comment box is 100% it will be larger or narrower depending on the column.

Change 100% to any number. For example to make your comment box half width to the current, simply replace 100% with 50%. You can also use other units such as px (Pixels) instead of percentage (%) symbol.

Seventh Step:

Save your changes by clicking on the Save template button located to the top-left of the HTML Template Editor. Now you have successfully changed the width of your blog's comment box. To see if it works, launch any of your blog posts/pages and refresh the page by clicking the F5 key on your keyboard.

If the width does not interest you, you can resize it again by following the seven steps as you previously did. If you have anything to speak about this tutorial or anything, feel free to express yourself in our comment box below. And if you have something personal you want to share with the author of this blog, you can contact him by using the contact means located on our contact page.

Related Posts:

Others are reading this:

Advertisement!

1 comment: