Blog Design

Yahoo Messenger Emoticons

2009-03-01T12:49:00.005+07:00

Want to make your post more attractive with Emoticons? We can add Yahoo Messenger emoticons to our blog post. Just put the link source in html code. I have made list of that source. You can copy and insert to your post

Happy
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif"
width=18 height=18 border=0>

Sad
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif"
width=18 height=18 border=0>

Winking
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif"
width=18 height=18 border=0>

Big grin
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif"
width=18 height=18 border=0>

Batting eyelashes
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif"
width=18 height=18 border=0>

Big hug
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/6.gif"
width=42 height=18 border=0>

Confused
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif"
width=20 height=18 border=0>

Love struck
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif"
width=18 height=18 border=0>

Blushing
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/9.gif"
width=18 height=18 border=0>

Tongue
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif"
width=18 height=18 border=0>

Kiss
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif"
width=18 height=18 border=0>

Broken heart
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif"
width=18 height=18 border=0>

Surprise
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif"
width=18 height=18 border=0>

Angry
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif"
width=34 height=18 border=0>

Smug
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/15.gif"
width=18 height=18 border=0>

Cool
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/16.gif"
width=18 height=18 border=0>

Worried
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/17.gif"
width=18 height=18 border=0>

Whew
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/18.gif"
width=34 height=18 border=0>

Devil
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/19.gif"
width=18 height=18 border=0>

Crying
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif"
width=22 height=18 border=0>

Laughing
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif"
width=18 height=18 border=0>

Straight face
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif"
width=18 height=18 border=0>

Raised eyebrow
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/23.gif"
width=18 height=18 border=0>

Rolling on the floor
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif"
width=30 height=18 border=0>

Angel
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/25.gif"
width=30 height=18 border=0>

Nerd
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/26.gif"
width=24 height=18 border=0>

Talk to the hand
<img src="http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/27.gif"
width=18 height=18 border=0>

Eliminate Label Number

2009-02-08T11:03:00.006+07:00

If we make label, as default will be showed a number which indicate how many post using that label. Like below: But we can lost the number, and it is so easy.

First please sign in to your blog and than click layout. Click tab edit html and don’t forget to click Download Full Template to backup your template design, so if you make mistaken in editing you can take back your first design. After you save your back up than check Expand Template Widget.

Wait a minute to process than please look for this code:

(<data:label.count/>)

After you get that code, please delete. Than save your template change.

Ok, you have finished. Please click preview to show the result

ALOTOFIT BIG CONTEST

2009-01-07T21:42:00.003+07:00

Hi friend, i have interesting information, that in alotofit blog there is a
contest which the prize is so many and interesting. This blog ever
make contest like this and paid for the winner, so you should get
participated with no doubt anymore.

This is the prize of current contest :

First Prize :

$100 From Alotofit.com
(Paypal Only)
(This Is the Most Special Prize)

Second Prize:

One Custom Blog mascot worth $149 from (LogoAngel.com)
One Custom Banner Design from Buy Templates worth $99 from (LogoAngel.com)
One Custom Logo Design from Logo Angel worth $99 from (LogoAngel.com)
One WordPress Template Design from Buy Templates worth $30 from (LogoAngel.com)
Sponsored Review From (Niessuh.com) worth $20
1 Year Webhosting in WpWebHost.com (WpWebHost.com)
1000 Entrecard Credits from Skidzopedia.com (Skidzopedia.com)
1 month 125×125 advertisement on Contestspot.Blogspot.com (Contestspot.Blogspot.com)
1 month 125×125 Ad space on Smarterwealth.net (SmarterWealth.net) Worth $10
1 month 125×125 Ad Space on NSpeaks.com (NSpeaks.com) Worth $10
1 month Text Link on shankerbakshi.com (Shankerbakshi.com)

Third Prize:

One Custom blog mascot worth $149 from (BuyTemplates.net)
One Custom Banner Design from Buy Templates worth $99 from (BuyTemplates.net)
One WordPress Template Design from Buy Templates worth $30 from (BuyTemplates.net)
1 month 125×125 advertisement on SlightlyMordant.com (SlightlyMordant.com)
1 month 125×125 advertisement on ContestWhiz.com (ContestWhiz.com)
1 Year Webhosting in WpWebHost.com (WpWebHost.com)
1000 EntreCard Credits from Dailysms.in (Dailysms.in)
500 Entrecard Credits from Affiliatizer.com (Affiliatizer.com)

Fourth Prize:

1 Year Webhosting in WpWebHost.com (WpWebHost.com)
2 months 125×125 advertisement on 1.pinoyko.info (1.pinoyko.info)
2 months 125×125 advertisement on Pinoyko.info (Pinoyko.info)
500 Entrecard Credits from Scandalsprime.com (Scandalsprime.com)
500 Entrecard Credits from Indocontest.com

Random Prizes:
125X125 Advertisement Prizes:
1 month 125×125 Ad space on pinkyposh.com (pinkyposh.com)
1 month 125×125 Ad space on namesherry.com (namesherry.com)
1 month 125×125 Ad space on sherryshopping.blogspot.com (sherryshopping.blogspot.com)
1 month 125×125 Ad space on Iluvcontest.BlogSpot.com (http://IluvContest.BlogSpot.com)
1 month 125×125 Ad space on AnotherContest.BlogSpot.com(AnotherContest.BlogSpot.com)
1 month 125×125 Ad space on sherrycontest.blogspot.com (sherrycontest.blogspot.com)
1 month 125×125 advertisement on Contestspot.Blogspot.com (Contestspot.Blogspot.com)
1 month 125×125 advertisement on Bubbblecrush.org (BubbleCrush.org)
1 month 125×125 advertisement on Skidzopedia.com (Skidzopedia.com)
2 months 125×125 advertisement on Mommyko.com (Mommyko.com)

EntreCards Prizes:
500 Entrecard Credits from Princess-Love (Princess-Love.net).
500 Entrecard Credits from sherrygo.blogspot.com (sherrygo.blogspot.com).
500 Entrecard Credits from heartrandom.com (heartrandom.com ).
500 Entrecard Credits from Rapidshoots.com (Rapidshoots.com)
(Indocontest.com)
500 Entrecard Credits from SunsetKitsch.net
(Sunsetkitsch.net)
500 Entrecard Credits from i-heart-contest.com (I-Heart-Contest.com)
500 Entrecard Credits from Maldita.us (Maldita.us)
All The Random Prizes Will be Chosen By Random.org For Each prize.

How to win? Collect entry by do blog post, commenting, subscribing, etc....

DEADLINE : 15th January 2009

Sharing Ms Office Files

2009-01-03T15:49:00.003+07:00

Have you know if we can also share our file in blog? So we can add our Ms Office files (Word, Excell and Powerpoint) in our posting. But as Image, we must have hosting to save this file. We can use service of Google docs. In Google docs we can create Ms. Office files or upload files from your computer.

First Step
For using Google.docs service we must have email account in Google (Gmail). Than log in to http://docs.google.com

In Google docs you can create file Microsoft Word (document), Microsoft Excell (spreadsheet) and Microsoft Powerpoint (presentation). It is so easy, just like using Ms Office. But if you have your files in your computer or drive, you can upload your files and editing if it is needed.

After uploading your files to Google docs. click publish button at top right side of your monitor than will be shown :
This document is not yet published.
Click Publish Now button.

Than click More Publishing Option
After pop up window being shown, click drop down menu beside File Format than choose HTML to embed a webpage
Click General URL button. Than copy the HTML codes and paste first to Notepad or other text editors.

Second Step

Sign in to your blog. Than make new posting. When you want to insert your Ms Office file, please click Edit HTML. Than copy the codes which you get from Google docs and paste to your posting. Dont forget to click Publish after you finish your posting, and preview your blog to see the result.

Color Code with ColorZilla

2008-12-23T18:22:00.004+07:00

Do you ever have a problem with color design of your blog? I am sure that you join AdSense program, often experience problems in adjusting color ad format with color pages where ads are placed. If we have to memorize thousands of color code,it can make our eyes being color blind. So is there an easier way?

For Firefox users, I say Congratulation, because you can activate, ColorZilla working with Eyedropper that we will use to know the color code.

Install colorzilla by downloading from http://www.iosart.com/firefox/colorzilla/, follow the instructions to install. after the install is completed, usually firefox requested to restart. Close Firefox and then open again. In the bottom left StatusBar Firefox browser will be appeared small icon of ColorZilla.

To know the color code click once in the colorzilla icon in the StatusBar, and then navigate the + shaped cursor and click on the picture or background that you want to know the color code. Automatically at your status bar the color code will appear in the version Hex Color, like this
#F0F8FF

Optimate Your Blog Using SEO

2008-12-14T16:23:00.003+07:00

SEO is shorten from Search Engine Optimization. It is mean making optimation of your website/weblog so can be displayed in the top ten of search engine if somone types the keyword in the search engine. If we have website or blog of course we want there are many visitors. It will be unuseful we spend time to make blog if there are no or just little of visitors. Everyday there are many website or blog which born. It makes Search Engine is very needed beacuse it will be hard for internet user to memorize the adress of many sites.

As a blog owner, we should try hard how to make our blog familliar and get top ten of search engine. So we have many visitors who give challenge for us to have many friends, relationship and network. The first target of SEO is traffic which comes from search engine. There are some tips to make how your site/blog can be displayed in the top ten list of search engine ( 1st or 2cd page).

Content
Your content must have many keywords, but remember dont make many repetation of your keyword. Also an original content will be better than content which you get form copy and paste.

Back Link
Back link is our adress blog which is putted in other blog or site. Back Link can support Page Rank. More many back link can make more higher page rank. With high page rank, search engines will think if our blog has quality content.

Domain (Blog Address)
Make blog address with related with the content. For example you make blog about online jobs. It will beter if your blog address is www.onlinejobsource.blogspot.com than www.lifestyle.blogspot.com

Tittle and Metatags
Your blog title and meta tag also must be related with the content or keyword. Here are codes for title and meta tag. Put this codes bellow <head>

<title>yourblogtitle</title>

<meta name="keywords"content="yourkeyword1,yourkeyword2,yourkeyword3">

<meta name="description"content="your blog description">

Sitemaps
Sitemaps is a page which shows link map on your blog. It makes spider of search engine easier to know our blog content. To make sitemaps please log in to google (gmail) than open this page:
www.googe.com/webmasters/sitemaps
Insert your blog address than click Verify Site, choose verification code = Add a meta tag
Copy the code than paste to your template bellow or above . Save your template, than click verify button in the google sitemaps page.

Natural Listing
Natural listing is registering your blog to search engine. Here are the address of search engine.
Google = http://www.google.com/addurl
Yahoo = http://www.submit.search.yahoo.com
MSN = http://search.msn.com.sg/docs/submit/aspx
Dmoz = http://www.dmoz.org

For blog, dont forget to register your blog to technorati. Technorati is blog search engine. If you dont register yet, please click link bellow to register you blog.

Faster your Mozilla Firefox Loading

2008-12-08T14:58:00.001+07:00

This chance I want to write about something which have no concerned with blog design. But I am sure if it is useful information for you. Using some steps I write bellow, you can make your Mozzila Firefox loading will be faster. So you don’t wasting time to wait the connection when you are surfing.

Follow the step bellow:

Open your Mozzila Firefox
In address bar type : about config
Than look for this file:
network.http.pipelining
network.http.proxy.pipelining
network.http. pipelining.maxrequests

After you got that file, change the setting :
network.http.pipelining become “true”
network.http.proxy.pipelining become “true”
network.http.pipelining.maxrequests change the value become 50 or 64.

Create new file : nglayout.initialpaint.delay. How to create it? Follow this step:
Right Click, than choose New : Integer
Type file name above and for value setting with 0 (zero)

Ok that’s all. Now close your Mozzila than trying to load again. Happy surfing!

Refresh your Blog Automatically

2008-11-22T21:55:00.000+07:00

To make our blog not tired it is better if we refresh the blog. But we often forget to do it. So how come if we want to make automatic refresh, without pressing refresh button in the toolbar? It is so easy, just put a simple code in your template.

For classic template, as template in this blog, we just need to put this code
bellow between <head> and </head>

<meta http-equiv="refresh" content="X">

X = time to refresh. E.g you want every 15 minutes your blog is refreshed, so please type 15 to remove X.

For new template, it need closing tag </meta>. So here is the code :

<meta http-equiv="refresh" content="X">

</meta>

Refresh also can be used to redirect from URL address which is opened to other URL address. For example, you have 2 blogs. The old and the new one. You dont contine the activity in your old blog. But sometimes there are vistiors. If you want your visitors can visit your new blog, you can use refresh to redirect your old blog address to your new blog address.

Using this code to redirect your blog :

<meta http-equiv="refresh" content="0;URL=your new blog address

0 can be changed with time you want the visitor will be directed to other blog
address. If you use the new template do not forget to put closing tag </meta>

It is so simple. Just try to refresh your blog!

Creating unique email

2008-11-09T21:40:00.005+07:00

Have you ever heard free domain of co.cc? I am sure some of you already know. I often see bloggers who have been packing for co.cc domain. In addition to the domain, we can use this to create email. Join with the facilities provided by google apps. We can make free domain name on co.cc, and then register the domain with Google apps. Later we can make this kind of email: hanna@cutegirl.co.cc. I am sure it is more interesting than just email : hanna@yahoo.com or hanna@gmail.com

Are you interested? A little complicated but not difficult.

First we must register in co.cc. Try the link below:
Co.cc

Now try to check whether the domain that you want still available? For example above, hanna@cutegirl.co.cc the domain is cutegirl. You can make anydomain as you want. Greatbusiness, onlinemoney, sexygirl, or whatever. If available, note also free or not. For “beautiful or unique” domain, usually it is not free. For example check this domain “businessonlineopportunity” This price is $15 for a year. If it is not free, try changing the instruction other domain. Unless you want to pay, it is up to you

After you get domain name, continue to click on registration. If you already have an account previously in co.cc can directly log in, if not yet have a click Create an Account Now. Fill the registration form.

First log in to co.cc. You was successfully created the account, right? Once logged in, you will be notified of the domain is registered to you, and given 48 hours to set up. If you do not set up the domain will be canceled. So click the Set Up. Meanwhile, do not touch it first. Leave it open, we jump to the second step

Second, we used to register for Google Apps it. Open http://www.google.com/a/cpanel/domain/new
Once open click Administrator. I Own or Control this Domain, and enter the domain name from co.cc which was already registered, such as cutegiril and then click Get Started.

Third, fill all of form to register. For Number of Users, enter necessary. For example cutegirl as your domain name. When the number of users you enter the value of 100, meaning you can register a domain name with 100 cutegirl.co.cc. So can also register the names of others. After all the information on the contents, click the Continue button.

Fourth, creating Account Administrator of the domain that was registered. Administrator is people who can do the Google Apps services, which also has the right to add other users. Here's an example of hanna as an administrator. For Terms and conditions, click I Accept, and then Continue with Set Up.

Fifth open Google Apps Dashboard. Here we will make set-up and verification of ownership of the domain was registered. Click on the Verify domain ownership.

Sixth. Already into the page verification of domain ownership, right? Ok, now select the method used for verification. There are 2 kinds, select the Change Your CNAME Record. Next will appear the instructions how to do the verification. Find the name of the CNAME, than copy. Don’t click Verify button and leave it open. Now jump back to co.cc

Seventh, You are now in page of co.cc. For setting up please choose the second option, click it - Zone Records. In the Host form, paste the name of CNAME that was copied of Google Apps, followed by the domain name. To cutegirl.co cc will be googleb03d2b040199e393.cutegirl.co.cc Then, for Type / Pri select CNAME Value and type Google.com. Than click the Add Record button.

Eight. Back to the page of Google Apps. Now you can click the button to Verify. After that will be brought back to the Dashboard page. You will find information that the ownership of the domain is under check processing. We continue next step. See the Service Settings in the dashboard and click Activate Email.

Ninth. We will be taken to a page that gives instructions for creating MX records. There is a table listing the MX server Address with the value of the priority that must be entered as the MX record on setting co.cc. This is the order of priority set by Google, and we can not change. Leave this page open, do not click on anything and return to co.cc

Tenth, back to page co.cc click Zone Records. For Host, enter your domain name. For example cutegirl.co.cc. Than for Type / Pri select MX and filled according Priority given by Google (in the pages of Google Apps), for example, 10. For Value please enter the MX server address, for example ASPMX.L.GOOGLE.COM. Then click the Add Record button. There are many MX Records list in Google Apps. For other record just follow that step, do one by one until finish.

Eleventh, Return to the page of Google Apps. Click I Have Completed These Steps Than you will be returned to the Dashboard page. See Service settings, and click on the link Email. On the next page, click on the link Change the URL. Then on the next page again, we can choose to change the access email address, so we can easy to remember the login email address. Here, for example, the domain cutegirl.co.cc will be made address access : http://mail.cutegirl.co.cc. So next to open the email, use that address. If not be changed, the default address for access is : http://mail.google.com/a/cutegirl.co.cc. It is quite hard, to remember, right? If have been finished, click Continue.

Twelfth. We are now under to a page that gives instructions to create a CNAME record, for addressing of access email that we had created. Later we will use the information in point 3 and 4. Jump to the page of co.cc

Thirteen. In co.cc page, click Record Zone. For Host, for example mail.cutegirl.co.cc. In Type / Pri select CNAME and Value to enter any given point to Google on-3 and 4 above, for example ghs.google.com. Then click Add records. Than return to the Google Apps page, click the button I've completed these Steps.

Now back to the Dashboard, and see in the email. There are still updating status. It takes about 1 hour. To find out, after one to 2 hours trying to open your email. Here, for example: http://mail.cutergirl.co.cc. Then sign with the name of the administrator that you had made, for example hanna. If you can open, its mean you have success creating your unique email.

Not hard, right? Now you have a unique email. In this case hanna is the administrator. So people who using hanna can change the settings on the Google Apps for domain cutegirl.co.cc. Hanna can add another users, her friends, groups or others with the format name@cutegirl.co.cc

Place to discuss blog design

2008-10-21T22:58:00.002+07:00

Hi, looking for something related to blog design? Just go here in http://www.sitetalkzone.com , this is a place to share and asking about blog design and blog monetizing, SEO, programming, etc...Hopefully, after visiting this site, your have an idea to design your blog. While discussing about blog design, join for contest which currently running in this site is a good idea. Yeah, there is a contest running until 28 october 2008 and the prize for 1st place is $250. Interesting, right? So, just go there for the detail.

Badge/Button Code

2008-10-06T23:25:00.003+07:00

In my side bar, you can see there is a code box which the code can be copied if someone wants to put link to this blog. By putting link in their sites, the visitors can more easily to access this blog. They dont need to remember of this blog address, just click the link in their sites to open it.

To make code box you must prepare the button or badge first. It is so easy. We can generate from sites which gives service of free button. You can use Brilliant Button Maker or Kalsey Button Maker to generate your box. Click the link below to open:
Brilliant Button Maker
Kalsey Button Maker

After you have a box, you can save it in your image hosting, photobuckets or others.

Than insert the code bellow in your blog template:

<a href="AAA"><img src="BBB" border="0"></a><br>

Copy kode di bawah ini: <br>

<form>

<textarea name="code" rows="3" cols="13">

<a href="http://AAA" target="_blank">

<img src="http://BBB" border="0">

</a>

</textarea>

</form>

AAA= for blog address, e.g : http://tutordesignblog.blogspot.com/
BBB= for your button/badge URL.

After editing your template, dont forget to save. Ok, you can preview to show the result.

Inserting HTML Code to Posting Area

2008-10-01T17:42:00.004+07:00

In my last post, when I have to insert html code to posting area, I always use image. Do you know my reason? Because if I type it directly in posting area, when I publish the post, the html code can not be shown like we expected. For example if type :
I insert code </style>.

It will be shown:
I insert code .

The code can not be displayed. So I make html code as jpeg file than attach it to my posting. But actually there is simple way to insert it, without creating the html code become image.

We need helper software like Macromedia Dreamweaver or other HTML editor. In this cases I use Macromedia Dreamweaver. It is so easy, just follow this step:

Open your Macromedia Dreamweaver in Design menu. Click View – Design. For example type code bellow to the area.
In Post template, fill with this code:

<span class=”fullpost”>

</span>

Now, please move to code menu. Click View – Code. You will get code like bellow :

In Post template, fill with this code:<br>

<span class=”fullpost”>

<p><br>

</span><br>

It is placed between <body> and </body>.
Copy the code above, and paste to your posting area in Compose menu (not html). Ok, now please preview to test the result.

2008-09-27T21:49:00.009+07:00

If we want our posting can be displayed shortly, we can cut on certainly paragraph, than if visitor click read more, and article will be displayed full one page. Just like posting in this blog.

Ok, I will write here but it is just for classic blogger template.

First Step:
Log in to Blogger
Open Settings – Archiving
In Enable Post Pages? Choose Yes, than click Save Setting

Second Step :

Open Settings - Formatting
In Post template, fill with this code:

<span class=”fullpost”>

</span>

Don't forget to save your template change.

Third Step :
Open Template - Edit HTML
Insert the code below, above code </style> in your template

<MainOrArchivePage>

span.fullpost {display:none;}

</MainOrArchivePage>

<ItemPage>

span.fullpost {display:inline;}

</ItemPage>

You can use ctrl+f to find </style>.

Than insert the code below at the right side of <$BlogItemBody$>

<MainOrArchivePage>

<a href="<$BlogItemPermalinkURL$>">

Read More...</a><br>

</MainOrArchivePage>

You can change Read More with other language. Click save template change.

The display of your posting cannot be changed by just editing the setting and template. You must do it manually.

Edit your posting. Insert code <span class=”fullpost”> above

the hidden paragraph. Than close your posting with code </span>.

For posting, always do step above. Put your hidden paragraph bellow code <span

class=”fullpost”> and close your posting with code </span>.

Favicon : Identity Icon of Blog

2008-09-14T23:25:00.004+07:00

What is Favicon or Favorite Icon? Favicon is a small picture as icon of blog identity. For free blog usually has stadard favicon. But for blogspot we can make our own icon. The picture bellow is favicon of blogspot:

Follow the step bellow to make an icon.

Prepare picture with extension .ico which is used for your icon.
You must have picture with extension .ico. But dont worry, if you just have format .jpg, .gif or .png. These formats can be changed to extension .ico. There are many sites which give service to generate picture to be icon. Please open www.htmlkit.com/services/favicon.

Upload your picture by clicking browse button to choose the picture from your computer. Than click Generate Favicon.ico
After picture have been uploaded, click Download Favicon to save the picture with extension .ico to your computer

Than your picture have to be saved in your image hosting, as I have wrote in the last post (read Displaying Picture and Gallery). Copy the code from your image hosting, than paste to your template and combine with code bellow:

Insert code above between code and . Dont forget to save template change. Now try to preview your blog. Look at the address bar browser. Your icon has been showed?

Displaying Picture and Gallery

2008-09-09T01:48:00.003+07:00

A picture can make our blog more beautiful. Pictures are not just for accessories but sometime we also need to give more information beside of our articles. But we can not save the picture in our own computer also in our blog, because blogspot doesn’t give this service. So we need a place to save the picture or image hosting. There are many sites which give free service. We can use Photobucket, www.photobucket .com, as hosting for save our pictures for header and articles. If we want make gallery, Flickr – www. Flickr.com- also give free service as image hosting.

Photobucket.

In photobucket, we can save our pictures, video and slide show. To use photobucket service we have to register as member. Please click Join Now or Sign Up, fill the form to register than clicking Done. Lets go!

We will be offered free sponsor, but if don’t want just ignore it. Click No and Submit to Continue. Open My Album, and download your pictures. Image/picture which we download and their URL will be shown. We can make this image as header or to give accessories or more information of our articles by copying the URL and put it in our template.

Showing Picture in Blog

We have saved our picuter in image hosting. But the picture can not be shown in our blog. We need to insert html code in our template to show our picture. The code is:

If we want to make this picture as header, just put the code above in header area. Open your template - edit html, than looking for header side. Click preview to show the result, than don’t forget to click Save Template Change.

But if we want show the picture as accessories of our articles, it is more easy. We don’t need html code. When posting articles, click add image in toolbar. Than insert URL code from Photobucket. Click Upload Image.

Flickr

To access flickr we need email account in Yahoo. So if you don’t have email in yahoo, you have to sign up first.

Open http://www.flickr.com/, than sign in using ID and password of yahoo email. Than make your Flickr name, after finish we can upload the picture. After uploading we can give title and description of our pictures. Don’t forget to click Save.

Before we show our pictures as photo gallery in blog, we have to make design of gallery badge.

Open Flickr badge. www.flickr.com./badge_new.gne
There are 2 choices of badge. HTML or FLASH. For clear gallery choose HTML. For Flash just showing gallery in small pictures. Than click Next: Choose Photos
There are 3 choices. All your public photos for showing all of our pictures. Your public tag tagged with for showing your pictures with certain tag. Everyone to showing everyone pictures in our album. Than click Next: color
In this step we asked for to decide, we show our buddy icon and name screen or no, the amount of photo which be displayed, the newer photo or older photo, the size and orientation of photo. Click Next: Color
Choose badge color include of background and text color. After finish, click Next : Preview & Get Code
We will get code, just copy and paste in your blog template.

Yahoo Messenger Status

2008-09-09T00:53:00.004+07:00

The visitor of our blog, can know if we are online by using Yahoo Messenger (YM) Status. So we can chat with the visitor. If we are online the picture of YM will flame with status “I’m online” or “Online Now”.

This way can make visitor interested to more active. If there are anything they want to know more about our blog or our service. The visitor can click the YM status and send massage directly and getting answer from us without delaying like using shoutbox. To add YM status, we have to put the code in template. Open your edit html, than add the code below, anywhere in side bar.

For X can you fill by:
0 for small picture
1 for medium picture
2 for large picture

It is so easy right? Don’t forget to save after you are sure with the size of your YM status and the position in your side bar.

Free Template

2008-09-05T18:44:00.003+07:00

I think I should post this article after posting how to create a blog. But I forgotten and just remember if the visitor should know it first. Before we make design of our blog, we have to assure our self with the template. Because if we have design, and next day we change the template, all of our design will lost and we must redesign again. If we don’t satisfied with standard blogger template, we can look for others free template. There are many sites which give this service.

After downloading the template we need to paste this new template in our blog template. If our new template have some pictures we have to save it first in our image hosting. For saving pictures in image hosting can be read in the posting about Displaying Picture and Gallery.

Log in to Blogspot than open Template – Edit html. Delete all of html code of your template. Than please copy the new code template and paste to change the old template. Click Preview to show the result. If you have been sure to change your template, click Save template change.

Commenting System.

2008-09-04T12:20:00.003+07:00

We have 2 ways to make interaction with the visitor. First, using commenting system which is a service from blogspot. And the second we can use shoutbox which we get from other service sites, and we must take it manually in our template.

For editing template, don’t forget to click refer to classic. So after we are in the dashboard, please click template, than edit html. In the bottom side of the template there are choice to refer to classic

For editing template, don’t forget to click refer to classic. So after we are in the dashboard, please click template, than edit html. In the bottom side of the template there are choice to refer to classic

To activate commenting system, we should make change in the setting.
1. Click Change Setting than Setting – Comment
2. Choose Comment : Show
3. Don’t forget to click Save Setting after finishing.

If we want using shoutbox, we must add by our self manually. There are some sites which give service free shoutbox. We can register in Oggix or Cbox and get their free shoutbox. We can make setting of our shoutbox than generating code to get the html code. Please copy the code, than edit your template. Clik Template – Edit html. Paste the code anywhere in side bar. You can put bellow profile side, or bellow YM Status. If you want to see first before saving, click preview. If the displaying of your blog is not nice, and you want to move the shoutbox, we can cancel by clear edit than pasting again anywhere in side bar. If you have satisfied with the display, click save template change.

Characteristic and Anatomy of Blogspot Template

2008-09-04T12:02:00.005+07:00

For designing weblog, we have to understand about characteristic and anatomy of the template. Below the characteristic of blogspot template :
* A user can create many blog

* A User can make team author, so a blog can have many writer.

* Having commenting system, so the visitor can give comment to writer posting.

* Have no link manager, so we have to insert a code manually if we want having lin manager

If we want our weblog more beautiful we must edit the template. For editing template we sign in first to blogger.com. Than choosing Dashboard / control panel, click Template and Edit html.

For editing the template we have to understand the anatomy of template. A weblog template arranged from HTML code (HyperText Markup Language). But inside of HTML, weblog template also have special code from each hosting weblog service. When we make any change we have to be careful so we don’t remove or change the special code. Below the sample of special code :

* <$BlogPageTitles$>, name of weblog
* <$BlogMetadata$>, meta data of weblog, it consist of information about our weblog.
* <$BlogURL$>, weblog address
* <$BlogDescription$>, weblog description.

Are you confuse? Don’t worry it doesn’t mean if you don’t understand. When I learnt it first, I was also confuse. But it will be familiar after we often edit the template. If we want to add the accessories in left or right side of weblog, we have to understand with the comment code

* : Begin of side bar
* : End of side bar
* : Begin of profile
* : End of profile
* : Begin of post

The comment code make us easier to know the position in lay out of our weblog. For example we will put a shoutbox below profile. Just inserting html code of shoutbox bellow code

The anatomy of weblog consist of Header, Main Column, Side bar and Footer. In header there is title of our weblog. Than main column, consist of articles which we posting. Side bar consist of our profile, archive, and other weblog accessories. And footer, we can add any explaining here.

Creating Weblog

2008-08-31T03:20:00.002+07:00

Blogger.com or usually called blogspot is free weblog service from google. Actually there are many free weblog service like Blogsome, Blogdrive, Wordpress and many more. But I prefer using service of www.blogger .com because template of blogger/blogspot more familiar and easy to design than other service.

Creating a blog is so easy. Just like creating an email. But for designing we need language program skill of html. We will learn it in next posting. We must create weblog first.

Open http://www.blogger.com/

The page will be displayed like below:

Please click Create Your Blog Now to open the first page of register form.

Fill the form and dont forget to use your email in gmail for register. If you have no account in gmail, you can sign up first here. After fill all of the form, click continue to open the second page.

Make your blog title which related with the content of blog. Fill all the form than click continue to open template page.

Choose one of template which interesting you as your blog design. But you can change later with other template. After you choose your template and click continue, you will open the last page which give you information if you have success to create a blog. Now you have a blog and can post your article. But if you want your blog more interesting, attractive and useful, you need to design your template. But don’t worry! It is also so easy