How to backup your "Widgets"

Be like my promise at my previous post that is i will posting how to backup the data in the widget / page element.

If emerging question do we require to back up the data in page element? the answer is very require to. Because if you change your old template with new template, hence the data in page element will follow to be vanished, and you'd lose all data be like : guest book, blog accessory, blog tool, and also all which have been attached in your blog forever.

Many the way to back up the data in Widgets / page element, but i'm limitation of time to comment it in detail, hence I will try explain just two way, that is backing up directly from Page element and also backup from template source code.

Back up widgets From Page Element

Back up widgets in this way be in fact very disturbing, however than we lose various accessory and also tool which have been attached, wiser likely to do so.

Please follow the steps below :

1. Login to blogger with your ID


2. Click Layout.


3. Click menu Page Elemet, you will see the page be like this ( just example):





4. At representative of above seen the article edit which I give red circle, You must click at Edit in each the page element, hence will emerge popup window figuring in the code have in input to that. Pay attention the picture below :





5. Copy the code inside there, and paste to Notepad.


6. Repeat the step above at all the elements.


7. Finish.

There is the step how to back the data inside page element. This is the other way to backup your widgets.

Back up widget through Template Source Code

I think this way is more quickly and efisian, you need a few time to do this. This is the steps :

1. Visit your blog address.


2. After you at your self blog, click the menu View at the bar menu. See the picture below :





3. After click the menu View, will be out the sub menu, then click Source.


4. if your browser is Internet Explorer, so there is automatically will out the notepad with your template source code. If your browser is Mozilla Firefox or Opera, so there is out the new page with your template source code For example, see the picture below :





5. Save your template source code.


6. Finish.

If your question, where is the widgets code? there is always begin with :

And in terminating with code :

For example, in my template source code. there are code be like this :

my friends

So, my widget code is like this :









I hope with this post you become know how to backup your widget template. So, if you want change your template with a new template. Please don't forget to backup your template and your widgets too.

read more

Add a User Online Tracker to your Blog

How many people is online at your blog? you know that or don't? If you don't know how many people is online at your blog, you can use a free tracker to know it. That is much site provide this service. Once of them is www.histats.com. If you use them tool, you can know how many people online at your blog, how many people was visited to your blog, and any function. This is once of example :

How to get it? please following the steps :

1. Please visit www.histats.com.



2. If you was on the histats site, click Register at the top tab.



3. Content the form with your information, such as email, password, your blog url and etc.



4. Click Continue button.



5. Choose the style of histats counter, click Choose a counter from this category.



6. Please mark the radio button beside the counter style you wanted.



7. Click Continue button at the bottom of page.



8. Click at the drop down menu, choose the category which to display at your counter. the choice is : visitor today, Page views today, User online, Total visitors, and total page views. Choose empty if you want not to display them.



9. Click Continue button.



10. Wait a moment, your counter is updating.



11. Until the process is done, copy your counter code and paste to the Notepad or other text editor. Save into your computer.



12. Logout and close your internet browser.



13. Done. Now you has have a counter code to add at your blog.

Next step is add your counter code to your blog, please following the steps :

1. Login to blogger with your ID.
2. After entering the dasboard page , click Layout. Please saw the picture :

3. Click at Page Element tab. See the picture below :

4. Click at Add a Page element.
5. After emerging pop up window , Klik add to blog button for the things HTML/JavaScript. See the picture following :

6. Open your Counter code, copy and then paste into available column.



7. Click



8. Done. Please see the result.

Now you have a Counter, and you will know how many people online at your blog.

If you don't like with this counter, you can get at the other site, this is several site provide the same service :

• http://www.neoworx.net


• http://www.webfooted.net


• http://www.fastonlineusers.com

read more

How can Add Google Talk to Blog

I'm sure you are surely knew what is the Google Talk, with Google talk you can send instant messages, make voice calls, leave voice mail messages, transfer files and etc, however of course must with other Google user. Do you know, now you can add Google talk to your blog? not yet known its way? please follow the steps following :

1. Login to blogger with your ID.
2. After entering the dashboard page , click Layout. Please saw the picture :

3. Click at Page Element tab. See the picture below :

4. Click at Add a Page element.
5. After emerging pop up window , Click add to blog button for the things HTML/JavaScript. See the picture following :

6. Copy and paste the code below into available column :

<iframe width="234" frameborder="0" src="http://talkgadget.google.com/talkgadget/client?fid=gtalk0&relay=http%3A%2F%2Fwww.google.com%2Fig%2Fifpc_relay" height="350"><br /></iframe><p style="margin:-8px 0"><br /><center><br /><a style="text-decoration:none;font-size:70%;" href="http://www.onlinetipsukal.co.cc/2010/06/How-can-Add-Google-Talk-to-Blog.html">Add to your blog</a></center></p>

7. Click



8. Finish. Please see the result.

Now you have a Google Talk at your blog.enjoy and chat everyone.....

read more

How To Hide Blogger Navbar

You have known blogger navbar, haven’t you? If you haven’t, you can see at the top of your blog. There you can see a bar, the bar has some important functions, they are; as blogger search, give a flag to tell blogger, log in or log out and others. Below is called as Blogger navbar:

In fact, many bloggers don’t like the presence of this navbar and want to hide it. Can we disappear it? Yes, we can. But before disappear it, please ask blogger if we can disappear it or not because I am afraid that it will break the blogger rules and will not responsible for any effect from disappearing the blogger navbar.

Disappear the Blogger Navbar

1. Log in into blogger with your ID
2. Click Layout
3. Click EDIT HTML tab
4. Click Download Full template. Back up your template first (important!)
5. Find the code which is similar to the code below, focus at the body code:

   body {
   background: #8F8E8E;
   width: 100%;
   color: #000000;
   font-size: 12px;
   font-family: Arial, Tahoma, Verdana;
   margin: 0px auto 0px;
   padding: 0px;
   }

6. Copy and paste the following code above the body {….} :

   #navbar-iframe  {
   display : none;
   height : 0;
   visibility : hidden;
   }

7. Click SAVE TEMPLATE
8. Finished and now your blog navbar has hidden.

Besides the steps above, there is still another alternative through AUTO HIDE, this auto hide is safer from breaking the blogger rules because we don’t disappear the navbar but only hide it. If we drop the mouse to navbar, then the navbar will appear again. These steps will not work normally in Internet explorer browser but work well in other browser.

Below are the steps to hide the navbar.

1. Log in into blogger with your ID
2. Click Layout
3. Click EDIT HTML tab
4. Click Download Full template. Back up your template first (important!)
5. Find the code which is similar to the code below, focus at the body code:

   body {
   background: #8F8E8E;
   width: 100%;
   color: #000000;
   font-size: 12px;
   font-family: Arial, Tahoma, Verdana;
   margin: 0px auto 0px;
   padding: 0px;
   }

6.Copy and paste the following code above the body {….} :
#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}<br />#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

7. Click SAVE TEMPLATE
8. Finished and now your blog navbar has AUTO HIDE.

I hope this is easier to understand and happy blogging.thanks for visit...

read more

Make a Table Of Content

Would you like to create a table of content like a book index,,if follow me.....

There is 2 steps to make a Table Of content at the blog :

Step #1

1. Login to blogger with your ID.
2. After entering the dashboard page , click Layout.
3. Then click edit HTML tab.
4. Click the Download full template link. Save your template.
5. Please mark the little box beside Expand Widget Templates. Wait for a moment.
   

1. Go to your template code, and find the code like this :
   
   




2. Delete above code, and replace with the following code :
   

<br /><b:if cond="'data:blog.homepageUrl"><br /> <b:if cond="'data:blog.pageType"><br /> <a href="'data:post.url'"><br /> <div style="padding:6px 0 6px 5px;border-right:1px solid #ccc;border-bottom:1px solid #ccc;margin-bottom:2px;background:#EAE9E9;color:#406A0E;"> <br /> <data:post.title/></div></a><br /> <b:else/><br /> <b:include data="'post'" name="'post'/"><br /> </b:if><br /> <b:else/><br /> <b:include data="'post'" name="'post'/"><br /> </b:if><br /> <br />

8. Click Save Template button
9. Done.

Step #2

1. Click at Page Element tab.
2. Click at Add a Page element.
3. After emerging pop up window , Klik add to blog button for the things HTML/JavaScript.
4. Copy and paste the code below into available column :
   
   YourBlogName.blogspot.com/search?max-results=200">Show all post »»



5. Alter YourBlogName with your blog name. Example : my blog name is oonlinetipsukal. Alter 200 with other number, because this is the sum of how much post want to show.
6. Click
   
7. Finish. Please see the result.

Now you have a Table Of Content at your blog.

See you at my next post. ok dear friends...

read more

How to make colered text box

here is some work for using colored text aria for your blog/website

---

Copy and paste below codes where you want in site
<input type="text" style="color: #FFFFFF; font-family: Verdana; font-weight: bold; font-size: 12px; background-color: #72A4D2;" size="10" maxlength="30">

read more

How to make mouse over changing table color

See the below table.which color are changing when mouse over.this work is very simple.You can customise below html codes as you wish

---

Your Table Data

Your Table Data

Your Table Data

Use below html codes where you want

<table width="100%" border="2" cellpadding="2"><br /><tbody><tr onmouseover="this.bgColor='#B8C518'" onmouseout="this.bgColor='#ff5a00'"><br /><td>Your Table Data</td><br /></tr><br /><tr onmouseover="this.bgColor='#EEEEEE'" onmouseout="this.bgColor='#B1ACB1'"><br /><td>Your Table Data</td><br /></tr><br /><tr onmouseover="this.bgColor='#ff5a00'" onmouseout="this.bgColor='#B8C518'"><br /><td>Your Table Data</td><br /></tr><br /></tbody></table>

read more