Add a Twitter Counter to Your Blog

If you are a Twitter Member add you would like a neat little widget just copy this code and add your Twitter name to it and paste it in add a gadget Html/Javascript.

<script type="text/javascript" language="JavaScript" src="http://twittercounter.com/embed/?username=YOUR TWITTER NAME HERE&style=bird"></script>

For more cool Twitter goodies visit Here

Change the Padding

Padding is the space between your words or images and their margins or borders if you will. To add space, you will need to go in and edit your html. Search for the word padding and you will find it several times. There will be padding for the header, padding for the posts, padding for your images, padding for the footer and padding for the sideposts. Depending on where you want to change the padding you will need to find it in the html and change the number before the px. Your header by default will look some thing like this.





So for example: If you want to change the padding in your header search for this code in your html.(Minema template)

#header h1 {

margin:5px 5px 0;

padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em; font: $pagetitlefont;}



To change the padding, change the number before the px. The first px is the spaces on the top and the second px is the space from right to left.



In this example I changed the padding to 0 and now it looks more like this:


Change the Margins of Your Post

You may find that you want to change the margins of your blog. This will be especially true if you created a 3 column template. Go back into the Layout and Edit HTML tabs. Scroll down until you see this code.

#main-wrapper {
width: 500px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float
*/
}

Add this code between the { and the width:

margin-left: 20px;

If you want more of a margin change the 20px to 25 px.If you want more of a margin on the right add the same code except change the word left to right.

Keep in mind that the more you increase your margins the more you will need to change your widths of your main and side bar. If you are not getting the right spacing you desire, try increasing or decreasing your widths to get it right. As an example in the code below, the code in red would be what you would change. Hit preview before saving any changes.

#right-sidebar-wrapper {
width: 180px;
float: $endSide;
-wrap: break-word; /* fix for long text breaking right-sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float
*/
}

Add a Third Column to Your Blog

One of the most common questions are how to create a 3 column blog. You can do this by adding an additional sidebar. If you are unable to download a 3 column template you may just want to manually change the html code to create one. Note that templates html codes will vary. I am using the Minima template. To get to you html code, click on the Layout tab then Edit HTML. Scroll down the box containing the code until you see this code.

#header-wrapper {
width:660px;
margin:0 auto 10px; border:1px solid $bordercolor;
}

Make the changes you see in red.

#header-wrapper {
width:860px;
margin:0 auto 10px; border:1px solid $bordercolor;
}

Click the Preview button at the bottom of the html code box. You should notice the title box has gotten wider. Next scroll down the box till you see this code.

#outer-wrapper {
width: 660px; margin:0 auto; padding:10px; text-align:$startSide; font: $bodyfont;
}

Make the changes you see in red.

#outer-wrapper {
width: 860px; margin:0 auto; padding:10px; text-align:$startSide; font: $bodyfont;
}

Click your preview button and you should see space open up between the post column and your side bar.

Now scroll down a little further till you see this

#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float
*/
}

This is your side bar. To create another side bar copy and paste this entire code and past it below the code that is already there. So now it will look like this.

#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float
*/
}

#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float
*/
}

If you hit preview you will not see any new changes. You will need to name your side bars. Make the changes you see in red.

#right-sidebar-wrapper {
width: 170px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float
*/
}

#left-sidebar-wrapper {
width: 170px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float
*/
}

Now if your were to preview your blog you will see the side bar down under your posts. Well we will need to change that. Scroll down till you find this html code. (Note there may be other things between the <b:section> if you have gadgets set up in your side bar. This is all you need to copy and paste.)

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
</b:section>
</div>

When you find this copy and past another one underneath the </div>. Make the changes you see in red.

<div id='right-sidebar-wrapper'>
<b:section class='sidebar' id='right-sidebar' preferred='yes'>
</b:section>
</div>

<div id='left-sidebar-wrapper'>
<b:section class='sidebar' id=left-sidebar' preferred='yes'>
</b:section>
</div>

Now if you were to preview you will see your blog back to space between your posts and sidebar.If you want your sidebar on the left move just the left-sidebar section of code you just made....(leave the right where it is)

<div id='left-sidebar-wrapper'>
<b:section class='sidebar' id='left-sidebar' preferred='yes'>
</b:section>
</div>

Above this code...

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>

Now if you save your template and go to Layout you will see you have a left sidebar and you can add gadgets.

Increase Traffic and Promote Blog

Now that you have your blog ready to go, you will want to attract viewers. It isn't enough to create your blog but now you will have to promote it. With a little time and effort it can be easy to get traffic to your blog. Read this article for great ideas and tips to promoting and increaseing traffic to your blog.
Read More

Sign Up for Affliates

You can search online for affliates to place ads on your blog as well. You will want to choose to advertise products or services similiar to the theme of your blog. Once you have an account wuth an affliate, they will provide you with a link, a html code or javascript that you can add to your blog. You can do this by adding a gadget and inserting the code in the HTML/JavaScript or by simply adding a link. Keep in mind that if you add a link. The a href tags and ending tags, are automatically added to your link and will not work if you manually add them as well in the Add a Link Gadget.

I have created a list of a few Affliate Companies that you can check out. Some of these affliate companies will approve you right away, while others may take some time. You will need to do some investigating on each companies terms and policies before you sign up to advertise for them.
Amazon Associates Program
Bidvertisers
Affliate Future
Commission Junction
Click here to become a LinkShare Affiliate!

Monetize Your Blog

Blogger has it all set up for you to start advertising with Google Ads. Select the the Monetize tab. You will need to apply for an AdSense account. This is actually quite easy.
You can select where you would like ads to appear on your blog.



The AdSense will appear as a gadget in your layout.
From there if you want to add more AdSense return to layout and Add A Gadget and select AdSense. You will be given some options of ad types, sizes and color schemes.

Remove the Navbar from Your Blog

Removing the Navbar all together from your blog will require some html. Go into the Layout tab and select Edit HTML. Scroll down until you see this in your html.

/* Variable definitions

Copy and paste the code below and insert it just above it.

.navbar {display:none;}

Be sure to preview your blog. If the Navbar is gone then select Save Template.

You will now need to access your blog through your dashboard.

Change the Color of Your Navbar

Go into your layout and click on the Edit in the lower right corner of your Navbar. A new screen will appear that will allow you to select one of the four colors available for your Navbar. Select the color you want and save.

Move Gadgets Around

When you go into your blogger layout you will notice that you have a post section, a sidebar and a footer. From first glance you will see that you can add gadgets to your sidebar and to your footer. You can hover over the gadgets that you have added and move the gadgets around.


You also can move the gadgets from section to section. So for example if you have added a text gadget to the footer and you now want it up under the post section, just hover over it till you see the cross icon, and drop it below the post section. A white area will appear when the section is ready to take the gadget.



You can move gadgets above the post section, below the post section, anywhere along your sidebar and anywhere in the footer.

Adding Gadgets

Beyond posts you can add gadgets. Go to the Layout Tab and click on Add a Gadget. A new screen will appear. Here you pick what gadget you would like to add to your blog by clicking on the plus sign. After you select your gadget press save. If later you want to remove your gadget go back to the Layout Tab and find the gadget you want to remove and click on the Edit in the lower right corner of the layout box. When the new window pops up select remove. You can change or add more to your gadgets by following the Edit.



Now most gadgets you can use for several different things. Like adding a list. You can create as many lists on your blog. The same with HTML/Javascript, you can add as many of those as you need.

Highlight a Line In Your Post

If you want a section highlighted in your post, select EDIT HTML in the post box. Before the text you want to highlight put <div style="background-color: whatever color you want the back ground. ex yellow; color: whatever you want the text color to be in the highlighted area. ex black"> After the text you want highlighted </div> so it will look like this.

<div style="background-color: yellow; color: black"> This area is now highlighted in yellow with black text.</div>
This area is now highlighted in yellow with black text.

All about comments

Comments is an option on your blog that you may not want to leave at default. You can get into your comment preferences under Settings then Comments. The first preference is whether or not you want the comment option for your posts. If you select show, others can click on Comment and therefore say whatever they want. If you select Hide the comment link will disappear by your post. Now if you choose to allow comments to your posts, you will have a few other options on how to regulate them. You can choose who may leave comments, where the comments will appear by your post, and how the time stamp will appear for the comments. Another important feature is whether you want to review the comments before they appear on your posts for others to see. These comments will go to the Posting Tab then Comment Moderation. There you can decide to publish or not to publish the comments made by other viewers.


You can also leave an optional e-mail address and have your comments e-mailed to you. A comment announcement will be left on your dashboard as well to make you aware that comments have been made.
One very good reason for reviewing your comments prior to publishing them are a couple of factors. Viewers can say what ever they want and you want to know what your blog is saying. Secondly comments can be spammed or inserted with backlinks to a site you are not aware of. Be sure to review your comment options carefully and select the Save Settings icon at the bottom of the page.

Delete Blog

Under Settings then Basics there will be an option to Delete Blog under Blog Tools. You will need to confirm. If you change your mind you can see the next post.

Help I Accidently Deleted My Blog

Log into your account by going to blogger.com. You will go to Dashboard, at the bottom of there will be hidden blogs, under Show All. You will see the blog that you deleted with an option to Undelete This Blog. Select this option and you are back in business.