Tuesday, December 30, 2008

Merging Two Blog Account

Do you have two separate email addresses that are connected two blog? Maybe you aren't sure how to merge them. Well, one way is to make one address the admin of the two blogs. Read more for more details

Number 1 step you should do is to choose which email address you want to make it dominant (that is, the one that controls the two blogs). For example, say that I have two account, both have a blog attached to it. Let's just call it john.s@gmail.com and johnsmith@gmail.com. I want my johnsmith@gmail.com account to be able to control both the blog. After you decide then open up your Dashboard (with the account that you want detach your blog from, NOT the one that you choose just now, so in my case I login using the john.s@gmail.com) and click on the Settings tab, then choose the Permission subtab.

In the Blog Author section, the one with your email address there, click 'Add Authors' then type in your other email address (I should type johnsmith@gmail.com) and hit 'Invite'. Sign out from your Dashboard. Now check your email inbox if there is a mail (from Blogger) that says you are invited to be an author, click the confirmation link and follow the given step. Usually you have to login with your other account, so that's why I told you to sign out first.

Now back to your Dashboard > Settings > Permissions (still with the account you want to detach your blog from). If you do it right, then you would see both of your email addresses, one labeled admin and one author. Beside the label you should see a link called 'make admin' and click that.

Sign out from your current account and sign in (now I sign in with johnsmith@gmail.com) again with your another account. Now you should be able to administer both of your blog with that one account only. You are done for this part but if you want to remove your other account (in my case I want to remove john.s@gmail.com from being an admin), go to your Dashboard > Settings > Permission and hit the Remove link beside your email address.

If you have any technical difficulties, feel free to comment and tell your problem, I'll be very glad to help you out.

Widen your blog width

Are you kinda sick of the width of your blog? It can only hold that wide pics (usually 220px for sidebar). In this tutorial we'll learn how to make more space on your blog so that your pics stays in. NOTE: this tutorial is intended for those who use the default templates, if you use custom template then this tutorial is most likely not applicable.

Ok, so our 1st step is to open the Dashboard > Layout and choose the 'Edit html' tab. In the code, find the line:
#main-wrapper {
width: 474px;
margin: 15px;
This is taken from the Denim template, your's may have a slightly different code, depending on the template.

Now see there the width is (in my case) 474px, and I can't put any pic or videos that are wider than 474px. So how do we change it? Simple just change the width values to whatever size you want it to be. In my example I'll change it to 500 px.
#main-wrapper {
width: 500px;
margin: 15px;
Don't forget there's a semicolon at the end of px. Simple right? The code above changes the width of your blog posts, not the sidebar. If you want to change the sidebar width, then look for the following code:
#sidebar-wrapper {
width: 240px;
word-wrap: break-word;
overflow: hidden;
And change the width value to whatever width you wish. Ok, after you are done, Save the template.

Now after you finished editing your posts and sidebar width then it's time to edit the outer-wrapper. You'll need this to have the same width as the total of your post and sidebar. So go back in the edit html and find either:
#content-wrapper {
width: 985px;
margin: 0 auto;
padding: 0 0 15px;
OR
#outer-wrapper {
width: 985px;
margin: 0 auto;
padding: 0 0 15px;
And change the width by as much you change the sidebar or posts. Here's a practical way to do that. Say I've change the posts width by 35px, and the sidebar width by 20px, that means a total of 55px. My current outer-wrapper (or content-wrapper) width is 985px, so I must change it to 1040px (that is, 985 + 55). Save your template. You are done for this part.

Now if you got your header misaligned, you must change the width as you change the outer-wrapper. Find the code:
#header {
width: 985px;
margin: 0 auto;
And change the width by the same amount you change the outer-wrapper. Hit the Save button for the last time and you are done! Now you have a wider blog to hold all your pics. But if the width still doesn't fit you, go back to editing html until you find the perfect width. Keep experimenting!

Monday, December 29, 2008

Add random text gadget

Do you want to make a random, always-changing, text? Maybe its a quote of the day, or maybe it's a list of random tips. Anyway, let us begin.

First of all prepare your text. It is preferable to use not more than 3 sentences. After you do so open http://www.anniyalogam.com/widgets/random-message-widget in your browser. You should see a plain white site with many blanks to fill in. Now, fill in the 'Widget Title' with the title of your widget (quotes of the day, etc) and the rest 10 blank (that is, message 1, message 2, and so on) with your quotes/tips. Then hit the 'Generate Code' at the bottom of the page. The large box in the bottom should be filled up with Javascript code.

Your next step is to copy the code, go to your dashboard, click layout, and on the Page element tab click 'add a gadget'. Scroll down till you find the 'HTML' gadget. Hit the + button to add it to your blog. Then a window should pop up. Fill in the 'Content' with the code you copy earlier, hit 'Save' and position the gadget wherever it fits you. That's it, now you have a random text gadget!

Sunday, December 28, 2008

Increase traffic by submitting blog to directories

Here's another great tip to increase your blog traffic: submit it to directories. By submitting your site to directories, people will be able to 'see' you, thus increasing your traffic. Still confused? Here's how it work:

First you submit your blog to sites like dmoz.org or blogcatalog.com. Then your blog will be listed in a directory of your choice. Say you have a blog about blogging tips (yep, it's this blog), you can choose to appear in (for example) Internet > Blogging. Then when people want to look for blogging tips, they go to the Blogging category, and there's your site, ready to attract more traffic. If visitors are interested in your blog description, they might visit it. It's that simple.

Ok, I understand, so where should I be submitting my blog to? Well for a start you might try www.dmoz.org, or www.blogcatalog.com. Note that some sites require you to register first. You can google other directories sites as well, but remember to check their details first (is it a banned site? does it require me to pay?). Just keep in mind that submitting your blog to directories doesn't guarantee 100% traffic, you must work hard for it!

Allow everyone to post in your blog

Is it hard work to maintain all your blog? Or it's just that you want everyone to post their article in your blog, maybe to create a community, etc. Whatever the reason is, this tutorial will show you how to allow ALL (yes, you heard me right, ALL) people, not just predefined folks, to post in your blog, while retaining your authority to moderate them.

Ok, so our no. 1 step is to go to Dashboard > Setting, and choose the 'Email' tab. There you can see the 'Mail-to-Blogger feature. It's usually yourusername.(blank)@blogger.com. Now, fill in the blank with whatever word that suits you; that email address will be used by everyone to mail their post to. So if your username is Jack and you fill the blank with 'posting', any email sent to jack.posting@blogger.com will be automatically posted in your blog. After you fill the blank, hit Save.

The next step you should do is to tell everyone you email address (the one with @blogger.com) so that they can mail their post. You can do this via the Text gadget (read this for more detail http://blogger-newbies.blogspot.com/2008/12/adding-text-to-sidebar.html) or a welcome note, whatever you see fit.

If you want to see the official Blogger tutorial, see this http://help.blogger.com/bin/answer.py?hl=en&answer=41452

Adding text to Sidebar

Do you have some post that you would like to display in your sidebar? Maybe its a welcome note, or something that explains your site. Anyway let's get started.

First thing you should do is to go to your Dashboard > Layout. You should now see the outline of your blog. Click 'Add a Gadget' in the sidebar. Scroll down 'till you find the 'Text' gadget. Well, add it, just hit the + button beside it.

Now you should see an editor similar to those used to write posts. Type in your text there (whatever it is), format it if you like, and hit on the 'Save' button, and position the text where it fits you the most (just click and drag). Now you have a text or two that could not be overwritten by your ordinary post, because it's in your sidebar. If you want to write more just repeat the steps given.

Saturday, December 27, 2008

Adding Digg button to your posts

Digg it! Ok, but how? There isn't any button anywhere in the post. So the question is "HOW DO I ADD A DIGG BUTTON TO MY POSTS?"

First I'm going to tell you that we are dealing with html again. Follow this tutorial carefully, or you will risk ruining your blog! All right, lets get started.

As you might have expected, our number 1 step is to go to Dashboard > Layout and click on the Edit html tab. Then check the box that says 'Expand Widget Templates'. Note that this step is very important, if you don't tick the box you would not be able to see the html code properly. Now look for the tag:
<p><data:post.body></p>
At this point you have several option, either to put the button on the right, left, or after a post. Decide first, then continue reading.

If you want to put it on the right side of each post, add the following code before <p><data:post.body></p>,so it will look like this:
<div style='float:right; margin-left:10px;'>
<script type='text/javascript'>
digg_url="<data:post.url/>";
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/></div><p><data:post.body></p>
If you want to show the button at the end of each posts, add the code after <p><data:post.body></p>, so it will look like this:
<p><data:post.body></p>
<div style='float:right; margin-left:10px;'>
<script type='text/javascript'>
digg_url="<data:post.url/>";
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/></div>
Or if you want the button to appear on the left side of each post, add this line instead:
<div style='float:left; margin-right:10px;'>
<script type='text/javascript'>
digg_url="<data:post.url/>";
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/></div><p><data:post.body></p>
Note that the code is similar to all the above, but with a slight modification, that is, you reverse the float parameter from right to left and the margin from left to right.

Wait, this ain't over yet, Digg still have one more button in its sleeves: a small, compact button. This is button is handy if you want to save some space (like I do, check out the Digg button in this blog), as the regular button could easily be larger than the post itself. To add a compact button to each post, paste this code instead:
<div style='float:right; margin-left:10px;'>
<script type='text/javascript'>
digg_url="<data:post.url/>";
digg_skin="compact";
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/></div><p><data:post.body></p>
You may have notice that we have just added a single line to the code, and that's what makes the difference. That's all I've got to tell, and if you got any technical problem, just comment to this post. Happy Digg-ing!

Deleting your blog

There will be times when you want to delete your blog. To do so is simple; you don't need to delete your entire Google account. Just go to Dashboard > Settings. Make sure you are in the Basic tab. Now for newer Blogger there is a link which say 'Delete blog'. Well, if you think that this is what you want, click that. Now two options pops out, choose Delete Blog. NOTE: This will wipe out your entire posts and comments related to that blog. Use if carefully!

Submitting sites to Google

Wanna be famous? Of course, everyone would love to. But remember it's not a one day process, and you gotta work VERY hard. But as a start, you could add your sites to Google, let them index you, and in return, let visitors find you. Ok, first go to http://www.google.com/addurl and simply fill in the URL box with your blog url and fill the Comments box with general idea of what your site is. NOTE: comments will not affect how Google index you, it's only used an information. Next, enter the verification box; type in the squiggly letters and hit the 'Add Url button'. Done! But you still must wait a few hours (sometimes a day) before your blog is indexed.

Not satisfied? If you prefer some details, you can register for a Google Webmaster account. Here you can view the index stats, your submitted sitemaps, view search statistic, and many more. To register, go to https://www.google.com/webmasters/tools and sign in with your google account (if you don't have any just register first, click 'Sign up'). Now, you are viewing the Webmaster Dashboard. The first thing you should do is to add a site. Type your url in the 'Click here to add a site'.

The next step is to verify that the site belongs to you. Hit the Verify link and follow the given steps. After you finished verifying it, you have a fully functional Webmaster account (that is, you can't access certain feature if you don't verify your blog).

The Webmaster Tools have more features than I could write. So, here's where I left you but go ahead explore some of its features. I can't guarantee you the fame, but you got now a good start :)

Friday, December 26, 2008

Using your own header

You wish to get rid of those boring default header? Easy, just upload your own pics. But needless to say, there are still some who doesn't do it very well, and they end up with a misaligned blog. Here's to do it step by step:

First of all, you must know the dimension of your pic (is it, 1200x550, 445x755, etc). Usually you can use Microsoft Paint find out.

Next, upload your pic. Go to Dashboard > Layout and click edit on the header, browse and locate the pic and upload it. Choose whether it will be placed 'Behind the Title and Description' or 'Instead of the Title and Description'. Choose 'behind' if you want to keep the blog title visible, or 'instead' to get it overlapped.

Now the real problem began. You get a misaligned look of the blog. Some have their pic surrounded by white box, others get it covering their post, the question is 'How to fix this catastrophe?"

The dimension of the image is very important (that is, the info you must have before uploading the pic). To align the pic correctly, go to Dashboard > Layout > Edit html. Find the tag:
#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
This is taken from the Minima Template (the first one on the list), your template values may be different. To align the header image correctly, change the width value, in this case its 660. If say I have an image that have the width of 735 pixels, I will change the values like this:
#header-wrapper {
width:735px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
Save the template. Check your blog if the width already matches. If not, try changing the values again to suit the layout of your blog.

Ordering Posts

Ok, this blogging techniques isn't really smart. You know that Blogger.com automatically sorts out our posts, newest at the top. So if you want to order your post (older to newest or whatever), you must change the date it was published. How? Ok follow this:
  1. Go to your Dashboard
  2. Click on Edit Posts
  3. Choose the posts you would like to edit
  4. Ok, now I assume you have the post editor window open. Click the 'Post Options' link on the bottom of the editor. Look at screenshot below if you can't find it.
  5. Fill in the Post date and time as you want them to be. Remember, newest post are on the top.

Check for plagiarism

Are you ever worried that other people may take your blog content and plagiarize it. Or, how do I check for plagiarism on my blog? Well, the answer is http://www.copyscape.com/. This site's frontpage is somewhat similar to Google's. You can put URL (not keywords) on the search box and it will return a number of sites who have the same content as yours (that is, sites who copied your work without permission). Read the revised article here.

Track your visitor

If you ever wonder how to track your visitors, try to put a counter on your blog. A well known site that offers counters for your blog is http://www.free-counters.co.uk. To add a counter to your site, simply go to their site, then hit 'Create a Counter' on the navigation bar. Choose the design you like. Then, you must configure the counter; just follow what it tells you.

The counter from free-counters.co.uk do have some limitations though, for example, we are not allowed to put the counter for over 9 month. But I suppose this is more practical than to use Google Analytics or AWStats.

Create 'Read More' link

Did you ever wonder how to cut down lengthy article? See, you got here a 300 word essay, which you publish in your frontpage; but readers get bored easily reading that post. Does this problem got any solution? Luckily, the answer is no other than a 'yes'. You could cut down your essay into a short 2 to 3 paragraph by utilizing the 'Read more...' link. Here's how you do it.

First, you need to know that you are facing the dreaded html editing, but I will make this as simple as I can. Ok, let's get started.

Open your Dashboard and go to 'Layout'. Choose the 'Edit HTML' tab. Find </head> in the html code. Once you find it, paste the following code right before the </head> tag:
<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>
So it will look like this:
]]></b:skin>
<style>

<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>
</head>

Save the template. Next you need to check the 'Expand widgets' checkbox. Then look for the tag <data:post.body/>. Once you found it, you need to add the following code right after it:
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url' >Read more...</a>
</b:if>

If you do it correctly, your code should look like the this:
<data:post.body><b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url' >Read more...</a>
</b:if>
Ok you are done for the html part. Now moving on to your posts. To cut off lengthy article, type your post like this:
A catchy summary of the article
<span class="fullpost">The lengthy description</span>
The words inside the <span class="fullpost"></span> be replaced by a 'Read more...' link.

Reference: http://help.blogger.com/bin/answer.py?hl=en&answer=42215

Improve traffic using feeds

RSS or Atom feeds are useful to keep your readers informed about the latest news. And it could also be used to keep visitors coming again and again to your blog. A simple way optimize feeds is to let the visitor read only the first or two paragraph of the post. That way people will have to visit your blog to read the full article, and thus your traffic will be improved.

To enable short blog feeds, open Dashboard > Settings and choose 'Site Feed' tab. Choose 'Short' in 'Allow Blog Feeds'. Scroll down and Save your setting.

Show Adsense per post

You got yourself an Adsense account? Of course you want to make the most out of it. But how?

One of the most earning position in a blog is right below a post. See this 'heat map' from Google (taken from https://www.google.com/adsense/support/bin/answer.py?answer=43869):
See, Google also acknowledge that ads below a post is a good earning position. But the problem is, how to I position my ads like that? Simple, go to Dashboard > Layout and hit 'edit' on the 'Blog Posts' elements. Give a tick besides 'Show ads between posts'. Next, configure your ads layout, and after you are satisfied, hit 'Save'. OK, done and hope your income would double ^_^

Recent Posts gadget

'I can't find the Recent Posts gadget, where is it?' That happens to me once, but instead of googling for hours looking for it, I decided to use the Feed gadget to do the job.

Originally the feed gadget is used to show headlines or newest article from other sites. And the feed gadget can also be used to show the newest article from your blog (that is, recent posts). So, to add the seemingly unavailable gadget to your blog, go to Dashboard > Layout > Add a Gadget, and choose Feeds. In the feed url, enter http://yourblogname.blogspot.com/feeds/posts/default. So in my case its:
http://blogger-newbies.blogspot.com/feeds/posts/default
Hit Save and position the gadget where you want it to show. Done!

Customize colors and fonts

Your blog looks boring? Does it look exactly the same as your friend's blog? Well, you better customize it quick.

Customizing your blog's basic setting (eg. fonts and colors) does not require you typing any html tags. All you need to do is to go to your Dashboard, hit 'Layout' and pick the 'Fonts and Colors' tab. Here you can customize almost every elements in you blog; you can change the overal font, header's background, sidebar color, borders, page background, and many more.

In just a few minute you'll get a new, fresher look of your blog.

Open your blog to comments

The default setting for a new blog is that only registered users may comment your posts. This is to help you (yeah you, the admin) identify who is who. While this setting could be proved useful in some situation, but in most cases you would want everyone to be able to post their comment. Here's how you do it (if you haven't already done so):
  1. Go to your Dashboard
  2. Next click on Settings
  3. Choose the 'Comments' tab
  4. And on the 'Who can Comment' question, answer it with 'Anyone - includes Anonymous users'
  5. Scroll down to the bottom of the page and hit 'Save'
Simple huh?

Inserting Gadget in Sidebar

Sidebar is one of the most important thing in your blog, and you don't want it to look so empty. Try adding some gadget to your sidebar. Easier done than said, you just need to go to your Dashboard > Layout. Now you should see a box or two containing the words 'Add a Gadget'. Well, click that. Another browser window should pop out. Choose your desired gadget from the list and hit the '+' (that is, a plus sign) button. The next thing you should do is to configure how the gadget will work, or leave the default values intact. Hit 'Save'. That's it you are done!