_____________________________________________________________________
Showing posts with label how to. Show all posts
Showing posts with label how to. Show all posts

How To Add Emoticons To Your Blogspot Post

Posted by sksee82 | 11:05 PM | , , , | Comments

Special thanks to scrapur for providing this wonderful hack! ;)

What you need to do:

1. Go to Layout of your blogger account. Click on the Edit HTML tab.

2. Search for this code ]]></b:skin> as shown in the screenshot below:

3. Copy the following codes below (provided by scrapur.com)

<script src='http://scrapur.com/index/wp-content/uploads/2008/02/smile.js' type='text/javascript'/>

4. Paste the code right below the ]]></b:skin> code as shown in the screenshot below:

5. Use the following keywords below to display your preferred smiley/emoticon on your blog post. In order to add a smiley/emoticon to your blog post, press the SPACE key first followed by the keywords that signifies the smiley you like.

:) –> :( –> :p –>:D –> :$ –> ;) –> :@ –> :# –> :k –> :x –> :o –> :O –> :L –> :r –> :s –> :y –> :~ –> :v –> :f –> :d –> :c –> :z –>

Cheers and happy blogging!

5 Steps A Blogger Should Do Before Going On A Holiday

Posted by sksee82 | 4:32 PM | , , | Comments

Finally I'm back from a short vacation to Sabah, specificially Kota Kinabalu. Honestly Sabah is a great place to go, no pun indeed. Two things I have to highlight, number one, tasty and affordable seafood. Number two, extreamly courteus and friendly people over there. Just incase you were wondering, I DID NOT climb Mount Kinabalu.

My recent holiday to Sabah (16-19 May 2008) and my intentional neglect on Bloggerfocus Dot Com for that very same period, have given me some insights and ideas for today's post. If you're a blogger with plans to go for a holiday, this article might help you help your blog.

Traffic Analysis For Bloggerfocus Dot Com During My Selfish Holiday To Sabah
Let's begin with a traffic update for Bloggerfocus Dot Com from the 14th to the 18th of this month (May 2008). See screenshot below:
As you can see from the screenshot above, my holiday period (between 16-19 May 2008) saw traffic decline below the 100 unique visitor range on the very first day itself. Another significant change is also observed on the 18th of May(Sunday), where the total returning visitors is only 3. Clearly this shows that once a blog's usual pattern of posting gets disrupted, visitors tend to think that something might have gone wrong or that maybe the blog is dead.

Bloggerfocus Dot Com for example has been churning out new post daily and readers are accustomed to seeing an article daily. Once I stop posting on the 15th of May, returning visitors started to decline and ultimately hit an all time low on the 18th of May. If you've started to post on daily basis and your readers are accustomed to that, stick to that principal. If you intend to change your posting frequency, ensure that you let your readers know of your intentions well in advance.

5 Steps A Blogger Should Do Before Going On A Holiday

1. Stick To Your Posting Frequency
Say for example your post an average of one article daily and you intend to go for a 1 week holiday. Stick to your posting frequency by preparing seven articles/post in advance. Schedule each article to be published daily throught your 1 week holiday period. Regular readers of a blog dislike bloggers to make changes without giving them any notice. Take my trip to Sabah as an example. I did not mention about going on a holiday, disrupted my daily posting for 3 days and almost immediately you see the drastic drop in returning visitors. Blogging is serious business, so show your readers some respect!

2. Feature Articles From Other Blogs
I admit there aren't many bloggers(maybe none) whom let you use their articles for FREE. Therefore, for every article you feature on your blog should have the author's name and the link to the author's blog. Most importantly before featuring any article, get the prior approval from the author first.

3. Continuous Promotion
Enlist the help of a trusted friend to manage your blog articles while you are away. There's no denying that most bloggers have a fixed list of social sites/forums/blog commmunity/ping portal/etc which they use to promote a newly published article. So while you are away on a holiday, a trusted friend has got to do the job of promoting new articles from your blog. A blog that churns out daily article/post without any form of publicity or promotion would never be able to reach its targetted audience. Which is also why I would recommend you to read this article entitled "My Blog...Company, Friend, Child and Enemy".

4. Advertising Via Entrecard
This is a great way to boost your blog's traffic while you're away. Say for example you plan to on a holiday, seven days from today. Go to the Statistic section of your Entrecard account and search for "Top Clicks by Widget" section. If you can't find yours, see the screenshot taken from my account:

Using the Top Clicks by Widget as your guide, select and advertise on blogs at the top of your list if possible. Plan and purchase these ads at least 7 days before your go for your holiday. Ensure that the ads you are going to purchase while appear evenly over the entire lenght of your holiday. That should provide a steady flow of traffic to your blog while you're away.

5. Blog Contest
Run a blog contest that offers lucrative prizes right before you go for your holiday. Let the contest period run concurrently with your holiday. In fact this is the ultimate traffic generator if you have the "right kind" prizes to offer for your blog contest. Try checking out some of the mega blog contests I've reviewed by clicking on the BlogContest page. Smaller scale blog contest is still acceptable yet it will not guarantee continuous traffic while you're on holiday.

There you have it 5 steps that a blogger should do before going on a holiday. Don't leave your loyal readers dispaired or new readers lost just because you need to go on a holiday. Carry out the 5 steps above and you should be able to prevent any major problems from occuring while you're on holiday.

Till my next post, cheers and happy blogging!

If you like this article, please give it a Digg, Stumble or just subscribe to my RSS feed.

Say Goodbye To Plain Old Blogspot Comment System

Posted by sksee82 | 7:56 PM | , , , | Comments

This is how a plain Blogspot Comment system looks like:
Why does Blogspot Comment system suck?
1. The Word Verification feature is a total turn off for many readers. Although this feature is integrated by Blogger.com to prevent spam comments, many readers might find it too troublesome to verify themselves as human before being able to post a comment.
2. Readers are not allowed to include their own blog url and email along with the comments made.
3. To post a comment, a reader would redirected to another page(default Blogger comment page) that's not part of the original blog.

Say how would you like your blog comment system to look something like this:
Then head on over to IntenseDebate.com and get your blog an IntenseDebate Comment system. Once installed on your blog, your readers can post comments directly on your blog without the need to verify words or get directed to another page (somewhat similiar to the Wordpress comment system).

If a reader is also a registered member of IntenseDebate.com, they get to enjoy the following features and services while posting a comment:
1. A voting system that allows users to vote the best comments to the top.
2. A reputation system for commentors.
3. Users can create profiles, upload avatars, add links to their blogs and more.
4. Threaded discussions
5. Comment subscription (users can subscribe to a thread, a friend or all blog comments)

By the way, did I mention that registration as a member and usage of this comment system is FREE?

Assuming that you've registered yourself as a member and ready to start using the IntenseDebate Comment system, I'm going show you how to get this cool comment system installed on your blog.

1. Go to the "Dashboard" of the IntenseDebate user page.
2. Click on "Add Blog" as shown in the screenshot below:
3. Enter your blog url and click the "Get Intense Debate" button
4. Follow the Advance Guide steps provided as shown in the screenshot below:
(Leave the default selection of Replace comment on "Post With No Comments" as it is. If you select "All Post", your old comments will not appear on your blog once the system is implemented.)
5. Once you've found your saved template, click the "Upload File and Continue" button.
6. All you need to do next is to copy the modified codes (code modification done by IntenseDebate) and paste it over the old code in the Blogger Edit HTML section. The Steps are provided by IntenseDebate as shown in the screenshot below:
7. Click on the "Finish" button and you're all set.

Bloggerfocus Summarizes
This is a fantastic service provided by IntenseDebate.com. Apart from allowing easy commenting, the IntenseDebate Comment system makes it easier for your readers and you to interact. In addition, features such as monitoring your blog comments, moderation function, importing old comments and many more are also available for registered members.

All these benefits plus the fact that it is FREE to use makes the IntenseDebate Comment system a must have for all blogs.

How To Create Your Own PayPal Donation Button

Posted by sksee82 | 8:29 PM | , , , , | Comments

You spent countless hours in order to produce the perfect post and finally you manage to produce one that might just rival that of a pro blogger. Readers of your blog give you hundreds of comments for that post and some might even want to donate some moolah(money) to you as a sign of appreciation for your effort. But wait a second, your readers can't seem to find the donate button on your blog! That's where this post might just come in handy for you.

Today, I'll be sharing a guide on How To Create Your Own PayPal donation button. First of all, you are required to register a PayPal account in order to use the donation function offered by them. If you've never heard of PayPal, trying reading my article on PayPal.

Now that you're done reading, let's cut to the chase and begin.

How to Create Your Own PayPal Donation Button
1. Log-in to your PayPal Account.
2. Click on the "Merchant Services" tab and locate the Donation link(listed under Key Features) as shown in the screenshot below:

3. On the Donation page, enter your Donation Name/Service. You can choose to fill in the other requirements stated on the donation page. I strongly suggest that you do not set a fix amount for donation. Let your readers determine how much they would like to donate.

4. Select a custom Donation button from PayPal or choose to upload your own image. If you choose to upload your own image, click the "Use your own button image" link and enter the url of the hosted button image as shown in the screenshots below:

I've taken the effort to design a couple of custom 125 x 125 images that you can use as your donation button. Shown below are 6 Custom Donation Buttons created by me. The images are hosted on Imageshack and you can use any one of them by copying the url listed below the image. (If you like me customized your own image, drop me an e-mail at sksee82@yahoo.com)http://img518.imageshack.us/img518/6273/teawithmint125x125fk6.jpg
http://img518.imageshack.us/img518/5488/rose125x125finalda6.jpg

http://img518.imageshack.us/img518/7932/donuts125x125finalva1.jpg

http://img518.imageshack.us/img518/2590/cookie125x125finalus0.jpg

http://img293.imageshack.us/img293/3363/coffee125x125finaley2.jpg

http://img177.imageshack.us/img177/4052/beermug125x125finaljn7.jpg

5. For the button encryption section, select the "No" option as shown below:
6. Click the "Create Button Now" button. The HTML codes would then be generated by PayPal as shown below:
7. Insert the codes into your blog layout and save all changes made.

Congratulations, you now have your own donation button!

For Blogspot users, you can place the donation button on your blog by going to your Layout tab. Add a new Page Element and select HTML/Javascript. Copy and paste the donation codes generated by PayPal on your new element and then Save Changes.

Recommended Read:
1. Like to embed your donation button on each and every post? Read this post about Buy Me A Beer Code For Blogger by BetaBloggerForDummies

Like this simple guide? Subscribe to Bloggerfocus.com for more upcoming guides.

What's A Favicon? A small icon that is used by some browsers to identify a bookmarked Web site or blog.

How Do I Add Favicon To My Blogspot?
Stage 1 : Creating Your Own Favicon

1. Start by creating/designing an image that suits your blog best. Make it a simple yet distinguishable design. It could be a simple picture of yourself (if you intend to use it for your personal blog) or just alphabets(take a look at Blogcatalog or Yahoo favicon) I've chosen a simple design for Bloggerfocus as shown below:
2. Once you are done with designing your image, your next step is to convert the image into a favicon. I've found a site called IconJ that converts your image into a favicon as well as provide the hosting for your newly created favicon. Shown below is a screenshot of IconJ.com:
3. What you need to do is to browse for the image you have created and click the "Upload it!" button. IconJ will then convert your image into a favicon and generate the favicon code which you will be using later in Stage 2.
Stage 2 : Adding the Favicon Code to Your Blogspot Layout
1. Go to the Layout tab of your blog and select Edit HTML.
2. Before adding any codes to your blog, make sure you create a backup for your blog template first. I recommend that you look into this post on How To Backup your Blogger template first.
3. Search for the <head> code as shown in the screenshot below:
4. Paste the favicon code generated by IconJ earlier right below the <head> code. Remember to use the code generated at the "Host Your FavIcon.ico File at IconJ.com:" section.
5. Your final code arrangement should look something like this:
6. Click Save Template.
7. Congratulations! You now have your own blogspot favicon.
This is how Bloggefocus' favicon look like in a Firefox browser
Like this simple guide? Subscribe to Bloggerfocus.com for more upcoming guides.

Let me start by saying that this is going to be a long post, so bare with me if you really really want to have pages on your blogspot.


This "How To" guide have been divided into a seven stages for easy implementation. I would strongly advise that you complete each stage at a time before moving to the next. Now that you are ready, let's get started!

Stage 1 : Adding A Page Element to Your Header
Luckily for Stage 1, I've written the "How To" guide some time ago. Follow the instructions provided by this guide and move on to Stage 2. Here's the link to the guide:

How To Add A Page Element To Your Blogspot Header

Stage 2 : Creating button for your Pages
1. You have 3 options here, Option 1 is to design the buttons yourself. Designing your own buttons allows you can customize the button's size, shape,color, etc to suit your blogspot.
2. Option 2, search Google for sites offering FREE ready made Buttons. Download the button pack that fit your blog most.
3. Option 3, design your own buttons using sites that offer free button customization.
4. I've picked Option 3 for my buttons. Personally, I would recommend that you use Cooltext.com to design your buttons. The site is FREE and offers users various button customization options. For this How To guide, I've created two buttons using Cooltext as shown below:
6. Regardless of Option 1, 2 or 3, make sure that all button images designed or created by you have been saved to your computer.

Stage 3 : Hosting Your Button
1. In order to display your buttons on your blog, you must first get those buttons hosted first.
2. Look for reliable image hosting services such as Imageshack.com, Imagehosting.com or Photobucket.com to host your buttons.
3. Each hosted button will be provided a url. Make sure you save those url's on a notepad first.
4. I'm using Imageshack to host 2 buttons. Shown below is the url for each button hosted on Imageshack:

http://img504.imageshack.us/img504/8201/button1vp2.png

http://img135.imageshack.us/img135/696/aboutmeue3.png

Stage 4 : Creating Pages for Each Button
1. You've created and hosted your buttons via Stage 2 and Stage 3. Having those buttons on your blog means nothing if you have no contents to link the buttons to right?
2. Start by creating a new post for each button you've made.
3. Say for example you are planning to add an About Me page for your blog. Create a new post with contents about yourself.
4. The thing about Blogger is that for every new post, it will be displayed as your latest post. If you do not want your post to appear at the front of your blog, you've got to trick Blogger by tweaking the date of the post.
5. Before publishing a new post you've created for your button, change the date and time by clicking the Post Options link as show in the picture below:

6. Change the post date to a date in the past. Once you're done, publish your post and you'll find that post will not appear as your latest post in your blog.
7. Repeat Steps 1 to 6 for each and every page you are planning to add to your blog.

Stage 5 : Setting up the button and linking page to each button
1. Remember that in Stage 1, you've created a page element for your Header? Now you are required to add a new HTML/Javascript Element to your header.
2. Add the following codes to your HTML/Javascript Element:

<a href="http://bloggerfocus.com/2008/03/resources-page.html" target="_blank"> <img src="http://img504.imageshack.us/img504/8201/button1vp2.png"/> </a>

3. The codes above are written for 1 page. If you like to add 2 pages to your blog, just copy and paste the code at the bottom of the initial code as shown below:

<a href="http://bloggerfocus.com/2008/03/resources-page.html" target="_blank"> <img src="http://img504.imageshack.us/img504/8201/button1vp2.png"/> </a>
<a href="http://bloggerfocus.com" target="_blank">
<img src="http://img135.imageshack.us/img135/696/aboutmeue3.png"/> </a>

4. If you use the above codes in its entirety, you'll end up having buttons and links that I've created. Therefore you've got to change the url for img src and a href.
5. Replace the url for a href with the url of the post you've created in Stage 4. Proceed by replacing the url for img src with the relevant button url you've saved in Stage 3.
6. Repeat for each button and page you plan to add to your blog.
7. Save the page element and preview your blog.

Stage 6 : Minor tweaks and adjustment
1. I've dragged the HTML/Javascript element from my header section to the post section as shown in the picture below:


2. Since the template I'm using does not have a white background for its header, I've decided to place the new page element at the top of my post section.
3. Make the necessary adjustment for the location of the buttons by dragging the element around.

Stage 7 : Completion
1. There you have it, a simple guide (I hope!) on how to Add Pages to your Blogspot.
2. If you like to see the pages and buttons I've created, check out my test site using the link below:
Bloggefocus Test Site

I hope you've enjoyed this simple guide by Bloggerfocus Dot Com. Feel free to email me at sksee82@yahoo.com for any inquiries.

Cheers and Happy Blogging!

If you like this simple guide, do subscribe to Bloggerfocus.com for more upcoming guides.

Firstly, my apologies to 3Point8 for the late response with regards to his question :

The steps on removing the navigation bar for Blogger Classic are simple and easy to implement.

Step1
Go to the Edit HTML section and copy the entire code into a notepad. Save that file, which will then be your backup file in case you accidentally deleted certain codes. That downside of using Blogger Classic is that there is no Download Full Template option available to create your own backup. Hence the need to use a simple notepad to store all your template code.

Step2
Copy the code below:

#navbar-iframe
{

height:0px;

visibility:hidden;

display:none
}

Step 3

Search for this <style type="text/css"> code.
Paste the code from Step 2 below this code as shown in the picture below.
Step 4
You can try previewing to see if the navigation bar has been hidden. The hidden navigation bar should look like the picture below:



Procced to Save Template Changes if your navigation bar has been succesfully hidden.

Additional Note:
The code in Step 2 of this article can also be applied to New Blogger templates.

The guide on how to remove New Blogger navigation bar is available HERE. Although the code used in Step 3 of How To Remove Blogger Navigation Bar is different from this. Both can be used for the same purpose.


Like this simple guide? Subscribe to Bloggerfocus.com for more upcoming guides.

This is a great How To guide that I must share with all of you. Credits to phydeaux3 for providing the widget code and simple writeup on how to implement it into New Blogger template. Might I repeat that this code is written specially for New Blogger users only.

By using the guide from phydeaux3, I attempted to implement this widget into Bloggerfocus Dot Com. Guess what? It works right to the tee. While phydeaux3 might have written his guide in text, I thought of sharing the widget implementation using a pictorial guide.

Let's begin with the usual Step by Step guide:
Step1
Backup your New Blogger template. (Do not know how to backup your blog template? Here's a pictorial guide for it.)

Step2
Go to the Edit HTML tab of your blog.

Look for the ]]></b:skin> code (Refer to the picture below):

Step3
Copy the following widget code:


/* Label Cloud Styles
----------------------------------------------- */
#labelCloud {text-align:center;font-family:arial,sans-serif;}
#labelCloud .label-cloud li{display:inline;background-image:none !important;padding:0 5px;margin:0;vertical-align:baseline !important;border:0 !important;}
#labelCloud ul{list-style-type:none;margin:0 auto;padding:0;}
#labelCloud a img{border:0;display:inline;margin:0 0 0 3px;padding:0}
#labelCloud a{text-decoration:none}
#labelCloud a:hover{text-decoration:underline}
#labelCloud li a{}
#labelCloud .label-cloud {}
#labelCloud .label-count {padding-left:0.2em;font-size:9px;color:#000}
#labelCloud .label-cloud li:before{content:"" !important}


Place the copied code right ABOVE the ]]></b:skin> (Refer to the picture below)

Step4
Copy the second part of the code:

<script type='text/javascript'>
// Label Cloud User Variables
var cloudMin = 1;
var maxFontSize = 20;
var maxColor = [0,0,255];
var minFontSize = 10;
var minColor = [0,0,0];
var lcShowCount = false;
</script>

Place the copied code BETWEEN ]]></b:skin> and </head> (Refer again to the picture below)

Step5
Next is to look for the Label Widget Code in your code. The Label Widget Code should look something like this:

<b:widget id='Label1' locked='false' title='Labels' type='Label'/>

Replace the Label Widget code above with this code (You can download the code here)
Note : Although the code might be rather long, I'm sure it would worth your while to try it out.


The placement of the new code should look like the screenshot I've taken from my template:

Step6
Before Saving Your Template, try previewing your Blog first. Once you're satisfied with the result, save changes to your template. Your New Label Cloud should look something like this:

If you do not like the New Label Cloud or accidentally deleted a portion of your template code, you can always restore your blog's old template using the backup file you've created in Step1.

Good luck trying this widget out. Further description on modifying your Label Cloud can be found here.

Like this simple guide? Subscribe to Bloggerfocus.com for more upcoming guides.

I'm sure all New(Beta) Blogger users use the Page Element function to add more Elements into their template. The introduction of Page Element into New Blogger has made editing Blogger template hassle free as compared to Blogger Classic. There is one problem though for Blogger users. You are not allowed to add more Page Elements for the Header section.

As you can see from the picture below, the Header section has no "Add a Page Element" function.



If you like to have the "Add a Page Element" function for your Header and Post sections, here's a simple guide on how to do it.

Step1
Backup your existing template by following this simple guide.

Step2
Look for the following code as shown in the picture below. (Located somewhere near the bottom)



Step3
Change the value for maxwidget='1' to the number of elements that you wish to have on your Header section. If you change the value for maxwidget to 3, then you will be allowed to add 2 additional elements to your header. The remaining one element has been reserved for your header title widget. Say for example you decide to set the total elements to 3, your code should be:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='3'>
<b:widget id='Header1' locked='true' title='Bloggerfocus Test Blog (Header)' type='Header'/>
</b:section>
</div>


Step4

You're almost done. The last step is to enable the "Add a Page Element" function for your header. Use the code shown below:

showaddelement='yes'

Copy and add the code to the original code. Your final code should look like this:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='3' showaddelement='yes'>
<b:widget id='Header1' locked='true' title='Bloggerfocus Test Blog (Header)' type='Header'/>
</b:section>
</div>

Step5
Save the changes you've made to your template. Go to Page Elements tab. You should now be able to add new elements to your Header Section as shown in the picture below:


Like this simple guide? Subscribe to Bloggerfocus.com for more upcoming guides.

Tired of your Blogger Navigation bar?


Here's a simple guide on how to remove your Blogger Navigation bar.


Step1

Backup your blogger template.

Step2

Go to the Edit HTML section of your template Layout


Step3

Copy the following code:

.navbar {
display:none;
}
* {
margin: 0;
padding: 0;
}

Step 4
Paste the code as shown in the picture below.

Step 5
Click the SAVE TEMPLATE button.


There you have it. Navigation bar begone!


Like this simple guide? Subscribe to Bloggerfocus.com for more upcoming guides.

Before you jump into the blogging wagon, take some time to read what I have to say first.

Let me start by saying this:

"If you intend to blog for the sake of making money, you would most likely fail miserably in making any money at all."





Why would I say that you would most likely fail to make any money if you blog with the intention of making money? Here are some points I would like to share:

1. If you intend to blog for the sake of money, you would most likely start blogging on something that is trendy/popular but without you having much knowledge it. Honestly tell me if you are not interested in the topic you are blogging, how long can you sustain or drive yourself to post in your blog daily or even weekly?

2. Readers will only remember you and your blog if you have can serve them quality contents. If you intend to cut and paste articles from another site or post something that has does not benefit your readers, you will most certainly never ever be able to drive traffic to your blog. Not now and most certainly never in the near future.

3. As I have mention in point number 2, apart from good quality contents, readers want to hear your own views/opinions/perspective with regards to the what you are blogging about. Readers are always intrigued with bloggers who are able to project their personal opinions and perspective into their blog articles.

4. Do not, I repeat do not start a blog that you have minimal knowledge of what you are writing about. When you intend to blog, you should choose a subject that you have lots of interest in. The drive to continue posting in a blog on a daily or weekly basis can only be sustained if you are truly interested in what you are blogging about. Blogging about topics which you do not know much about would simply mark the demise of your blog.Why so? Its because you would most likely lose interest in the topic or get frustrated because you have no idea what to write for the next post.

5. Chucking large chunk of ads/banners into your newly started blog is a definite No No. Your main concern for a newly started blog should not be on how many ads should you put in your blog or how fancy should your blog be. The first and primary concern is the contents of your blog. If you intend to blog for the long run, please go back and read point number 2 and 3.

6. The next concern would be on how to make your "quality" contents be made known to your target audience/readers. I hope to write more about driving traffic to your site and rest assured that an article about it would be out soon. They are countless articles on the web about how to drive traffic to your site. You can try Googling it in advance if you are eager to know more about it.

Lastly, try pondering over all 6 points I have dished out. If you are ready, then we can move on to Part 2 of Want To Start Blogging?

Like my article? subscribe to me now.

Got a question? Drop me a comment or email me at sksee82@yahoo.com