Internet is fault tolerant .... Not !

Internet has become a part and parcel of most of our lives. But I did not realize the extent to which I personally was dependent on the Internet till two days back when due to a major underwater cable breakdown in the Mediterranean sea, the Internet slowed to a crawl - well you can say it almost stopped. News reports say 60% of India was affected and over 70% of Egypt.

In India for instance, the three main service providers namely TATA owned VSNL, Reliance and Bharti Airtel Ltd were affected. The repair of the sea cables is expected to take a minimum of 10 days even when conducted on a war footing. According to news reports, the cable snag occurred near Alexandria, off the coast of Egypt on Wednesday affecting ILD and Internet traffic to Europe and the US.

Checking email which we all took for granted was a big chore with opening a single email taking close to an hour. Most sites were not accessible. It did not help that over 90% of the popular sites on the Internet are hosted on a server based in the United states with no cross continental mirroring plan to meet such a scenario.

An exception was Google search which did not see any slowdown because it has data centers in every part of the world and is prepared to meet such emergencies.

This makes me wonder if it is wise to be more and more dependent on the Internet for carrying out even the most mundane but critical tasks like banking, paying bills and booking tickets. Now a days, more and more people are working from the safe confines of their home. As days go by we are getting more and more enmeshed in the online world and acquiring alternate identities. And keeping the Internet fault tolerant is turning out to be a very important factor in our personal wellbeing.

How to Create Horizontal Tabs Menu

What is horizontal tabs menu? horizontal tabs menu is bla..bla..bla... I can't explain anymore, he..he., it's look like this:



To create it is not as simple as it's look, it's complicated. You have to design button, you have to create CSS and HTML code. Now I will show you how to create "Horizontal tabs menu" in blogger.


The first thing you have to di is create an image like this:

and

If you can't to create it, you can use my below images:

blackleft.gif	blackright.gif
greenleft.gif	greenright.gif
redleft.gif	redright.gif
unguleft.gif	unguright.gif
yellowleft.gif	yellowright.gif
blueleft.gif	blueright.gif
whiteleft.gif	whiteright.gif

Ok, let's begin

1. Login to Blogger, chose "Lay out --> Template --> Edit HTML"
2. Don't forget to backup your template first.
3. Check the "Expand Widget Templates" checkbox.
4. Try to find this code ]]></b:skin>, if you found it then put the code below above it

/*credits : http://trick-blog.blogspot.com */
#tabshori {
float:left;
width:100%;
font-size:13px;
border-bottom:1px solid #2763A5; /*Under Line, you can change or delete it */
line-height:normal;
}
#tabshori ul {
margin:0;
padding:10px 10px 0 50px; /* Menu position*/
list-style:none;
}
#tabshori li {
display:inline;
margin:0;
padding:0;
}
#tabshori a {
float:left;
background:url("http://blogoholic.info/files/menu/blackleft.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabshori a span {
float:left;
display:block;
background:url("http://blogoholic.info/files/menu/blackright.gif") no-repeat right top;
padding:5px 14px 4px 4px;
color:#24618E; /*Text menu color*/
}
#tabshori a span {float:none;}
/* End IE5-Mac hack */
#tabshori a:hover {
background-position:0% -42px;
}
#tabshori a:hover span {
background-position:100% -42px;
}

you can change the bold text with other image, for example, if you want to chose my red menu image the code will be like this:

background:url("http://blogoholic.info/files/menu/redleft.gif") no-repeat left top;

background:url("http://blogoholic.info/files/menu/redright.gif") no-repeat right top;

5. Then copy the code below

<div id="tabshori">
<ul>
<!-- Change the links with your own links -->
<li><a href="http://trick-blog.blogspot.com"><span>Home</span></a></li>
<li><a href="http://trick-blog.blogspot.com"><span>Trik-Tips</span></a></li>
<li><a href="http://trick-blog.blogspot.com"><span>Free Template </span></a></li>
<li><a href="http://trick-blog.blogspot.com"><span>Blog Dictionary</span></a></li>
<li><a href="http:/trick-blog.blogspot.com"><span>Profile</span></a></li>
</ul>
</div >

change http://trik-tips.blogspot.com with your own link, and change the bold text with your own text.

6. Next step is to put the tabs menu into your blog, this more difficult because we have different templates. There are some methods to do this, Here is the methods, you can chose and try for any methods.

- methode A:
Find this code :<div id="content-wrapper">. if you found it, paste the above code (code number five) above it. Preview your template, if it looks good save your editting, but if it's not good try to put above this code </div>, you will find many codes like that, try to put the code above it and preview your your blog, do it more often until it's suitable for your template.

If you have nice with your menu position, is unnecessary to do methode B, but if you feel difficult to apply methode A you can try methode B
- methode B:
Find the below code :

<b:section class='header' id='header'
maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true'
title='your blog title (Header)' type='Header'/>
</b:section>

change the green text so that to become like this:

<b:section class='header' id='header'
maxwidgets='2' showaddelement='yes'>
<b:widget id='Header1' locked='false'
title='your blog title (Header)' type='Header'/>
</b:section>

Save your setting, the go to "Page Elements" and click "Add page Element " on the header area, chose "HTML/JavaScript" then put the number five code above into "content" box, then click "save" and preview your new blog.

How to Create Horizontal Tabs Menu

What is horizontal tabs menu? horizontal tabs menu is bla..bla..bla... I can't explain anymore, he..he., it's look like this:



To create it is not as simple as it's look, it's complicated. You have to design button, you have to create CSS and HTML code. Now I will show you how to create "Horizontal tabs menu" in blogger.


The first thing you have to di is create an image like this:

and

If you can't to create it, you can use my below images:

blackleft.gif	blackright.gif
greenleft.gif	greenright.gif
redleft.gif	redright.gif
unguleft.gif	unguright.gif
yellowleft.gif	yellowright.gif
blueleft.gif	blueright.gif
whiteleft.gif	whiteright.gif

Ok, let's begin

1. Login to Blogger, chose "Lay out --> Template --> Edit HTML"
2. Don't forget to backup your template first.
3. Check the "Expand Widget Templates" checkbox.
4. Try to find this code ]]></b:skin>, if you found it then put the code below above it

/*credits : http://trick-blog.blogspot.com */
#tabshori {
float:left;
width:100%;
font-size:13px;
border-bottom:1px solid #2763A5; /*Under Line, you can change or delete it */
line-height:normal;
}
#tabshori ul {
margin:0;
padding:10px 10px 0 50px; /* Menu position*/
list-style:none;
}
#tabshori li {
display:inline;
margin:0;
padding:0;
}
#tabshori a {
float:left;
background:url("http://blogoholic.info/files/menu/blackleft.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabshori a span {
float:left;
display:block;
background:url("http://blogoholic.info/files/menu/blackright.gif") no-repeat right top;
padding:5px 14px 4px 4px;
color:#24618E; /*Text menu color*/
}
#tabshori a span {float:none;}
/* End IE5-Mac hack */
#tabshori a:hover {
background-position:0% -42px;
}
#tabshori a:hover span {
background-position:100% -42px;
}

you can change the bold text with other image, for example, if you want to chose my red menu image the code will be like this:

background:url("http://blogoholic.info/files/menu/redleft.gif") no-repeat left top;

background:url("http://blogoholic.info/files/menu/redright.gif") no-repeat right top;

5. Then copy the code below

<div id="tabshori">
<ul>
<!-- Change the links with your own links -->
<li><a href="http://trick-blog.blogspot.com"><span>Home</span></a></li>
<li><a href="http://trick-blog.blogspot.com"><span>Trik-Tips</span></a></li>
<li><a href="http://trick-blog.blogspot.com"><span>Free Template </span></a></li>
<li><a href="http://trick-blog.blogspot.com"><span>Blog Dictionary</span></a></li>
<li><a href="http:/trick-blog.blogspot.com"><span>Profile</span></a></li>
</ul>
</div >

change http://trik-tips.blogspot.com with your own link, and change the bold text with your own text.

6. Next step is to put the tabs menu into your blog, this more difficult because we have different templates. There are some methods to do this, Here is the methods, you can chose and try for any methods.

- methode A:
Find this code :<div id="content-wrapper">. if you found it, paste the above code (code number five) above it. Preview your template, if it looks good save your editting, but if it's not good try to put above this code </div>, you will find many codes like that, try to put the code above it and preview your your blog, do it more often until it's suitable for your template.

If you have nice with your menu position, is unnecessary to do methode B, but if you feel difficult to apply methode A you can try methode B
- methode B:
Find the below code :

<b:section class='header' id='header'
maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true'
title='your blog title (Header)' type='Header'/>
</b:section>

change the green text so that to become like this:

<b:section class='header' id='header'
maxwidgets='2' showaddelement='yes'>
<b:widget id='Header1' locked='false'
title='your blog title (Header)' type='Header'/>
</b:section>

Save your setting, the go to "Page Elements" and click "Add page Element " on the header area, chose "HTML/JavaScript" then put the number five code above into "content" box, then click "save" and preview your new blog.

Nokia cell phone giant acquires Trolltech

Here is news which will be interesting for all Linux users. Nokia the cellular giant headquartered at Finland has acquired Trolltech the Norwegian company which is developing the Qt library. The deal is believed to be worth around US $153 million. While many of us relate to Trolltech via the ever popular Desktop environment KDE which is built using the Qt library, a lesser known fact is that Trolltech's product is also used by other popular software such as Skype, Google Earth and Adobe's Photoshop Elements just to name a few.

What does that mean for us Linux enthusiasts ? Well, in the future we can look forward to better cell phones and devices from Nokia with a slick user interface powered by the Qt library. Nokia is a big supporter of Open Source. For example, it has released the N770 and N800 Internet tablet in the past which is powered by Linux. Trolltech has also released an open cell phone dubbed the Greenphone.

So in all respects, this acquisition bodes well for the Open source and Free software community at large.

You can read the Official press release at the Trolltech website as well as a joint statement (PDF) by Nokia and Trolltech CEOs to the KDE and Open source community.

Install KDE 4 on Windows

Not even a month has passed since KDE 4.0 has been officially released. Already the Windows port of KDE 4.0 is functional. Nay, you can really install many KDE 4.0 applications on Windows 9x/2000/XP (Vista users please excuse) via an installer.

The installer as such is a small piece of software which pulls the required packages from the remote repository and installs them on your Windows machine. It also automatically downloads any packages which are required to satisfy any dependencies which makes it very user friendly.

The download for me took a long time since the installer had to pull in over 400 MB of packages. But once all the necessary packages finished downloading, the installer then proceeded to install all the packages in the specified location. In my case KDE 4.0 applications were installed in C:\kde4 directory.

There are a number of applications already such as the KDE games, KWrite, Konqueror, Dolphin file manager and so on and all of them worked on my machine. I have to concede that other than the KDE games which played quite well, most other software is at the least, still buggy. Konqueror and KWrite guzzles up memory like there is no tomorrow. The Konsole (KDE terminal) has yet to be ported to Windows and so you cannot access the terminal from within Konqueror. Dolphin complains that it cannot find the home directory each time I open it in Windows. KWrite is a lot slow in opening up and so on.

But these chinks are sure to be ironed out soon. The complete build system of KDE 4 is ready. KDE 4 on Windows currently support two compilers namely Mingw and Microsoft Visual C++. Since Qt 4 is truly a cross platform library and KDE 4 being built using Qt 4, it is only a matter of time before you see people using KDE applications on Windows. Who knows, perhaps this could be one more reason which will prompt more and more people to embrace Linux.. or maybe not.

Check out a few screenshots of the installer and KDE 4.0 applications running on Windows. You can download the installer from windows.kde.org

Fig: KDE 4 Windows installer

Fig: Basic setup - choose the installation mode

Fig: Select proxy settings for your machine if any.

Fig: Select the most appropriate mirror

Fig: Choose the packages

Fig: The installer settings (most important section of installer)

Fig: The installer does automatic dependency resolution.

Fig: Installation completed dialog box

Fig: Dolphin file manager and a card game running natively in Windows XP

Fig: Two KDE4 games and KWrite

Fig: Konqueror running natively in Windows XP

Protect Your Blog From Plagiarize (Copy Paste)

May be you will be angry if your articel shown in other blog unexpectedly, moreover it without inserting the resource. I'll show you how to protect your blog from theif. But this trcik is pointed for small thief because it unusefull for expert thief. With this trick, the thief will unable to select your articel and unable to right click in your blog. But if you don't care about plagiarize, you will don't need this trick. Ok lets begin.

Go to your blog setting then chose "Template --> Edit HTML". Find this code <body> then replace with this code
<body onmousedown="return false" oncontextmenu="return false" onselectstart="return false">

Now your blog will be disable selecting and righ click, but the thief can still steal your articel by select "views --> page source" menu from their browser or by pressing "Ctrl + u", they can see your source code and can copy the articel from it. To deceive this, put your mouce cursor before this code <head> then press "enter" button many times, may be about 100 times :D the save your editting . Now if they press "Ctrl + u" they will only see a litle codes, he..he.. :D

But remember this trick is only work for a fool thieves, for an expert thieves is unusable.
I don't use it into my blog because there are many script that have to be copied by readers.

Protect Your Blog From Plagiarize (Copy Paste)

May be you will be angry if your articel shown in other blog unexpectedly, moreover it without inserting the resource. I'll show you how to protect your blog from theif. But this trcik is pointed for small thief because it unusefull for expert thief. With this trick, the thief will unable to select your articel and unable to right click in your blog. But if you don't care about plagiarize, you will don't need this trick. Ok lets begin.

Go to your blog setting then chose "Template --> Edit HTML". Find this code <body> then replace with this code
<body onmousedown="return false" oncontextmenu="return false" onselectstart="return false">

Now your blog will be disable selecting and righ click, but the thief can still steal your articel by select "views --> page source" menu from their browser or by pressing "Ctrl + u", they can see your source code and can copy the articel from it. To deceive this, put your mouce cursor before this code <head> then press "enter" button many times, may be about 100 times :D the save your editting . Now if they press "Ctrl + u" they will only see a litle codes, he..he.. :D

But remember this trick is only work for a fool thieves, for an expert thieves is unusable.
I don't use it into my blog because there are many script that have to be copied by readers.

Change Post Date Become Calender Icon

If you bored with your blog face, may be you can use this trick to make your blog more beautiful. This trick will explain "how to change posting date to become a calender icon" like as you see in my blog. If you interest c'mon let's do it now.
The first thing you have to do is change your "date header format" to become mm.dd.yyyy (1.24.2008). How to do this? go to your blogger account, then chose "Setting --> Formatting, change "date header format" to become what I said before (mm.dd.yyyy) then save your setting.

Next step is go to tabs "Template --> Edit HTML". Don't forget to backup your template first. Click on a "Expand Widget Templates" check box. OK lets go to the deep trick.

1. Find this code <TITLE><data:blog.pageTitle/></TITLE> in your HTML. If you found it, put the code below under it.

<SCRIPT type='text/javascript'>
//<![CDATA[
/*********************************/
/* http://trick-blog.blogspot.com */
/*********************************/
function date_replace(date) {
var da = date.split('.');
var day = da[1], mon = da[0], year = da[2];
var month =
['0','Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
document.write("<div class='month'>"+month[mon]+"</div> <div class='day'>"+day+"</div>");
}
//]]>
</SCRIPT>

2. Then Find this code:

.date-header {
margin: 1.5em 0 0;
font-weight: normal;
color: $dateHeaderColor;
font-size: 100%;
}

if you can't found it try to find this:

h2.date-header {
margin:1.5em 0 .5em;
}

3. OK, you have found it? next step is put the below code under it.

.dateblock {
background: url("http://blogoholic.info/files/kalender/bluecalend.gif")
no-repeat;
width: 50px;
margin: 0;
font-weight: bold;
height: 50px;
/*position: absolute;
top: 0;
left: 0;*/
float: left;
text-align: center;
}

.month {
font-size: 11px;
width: 37px;
margin: 0 5px;
text-transform: uppercase;
color: #fff;
}

.day {
color:#3366CC;
font-size: 19px;
width: 37px;
margin: 0 5px;

}

Code http://blogoholic.info/files/kalender/bluecalend.gif is the place for calender icon, you can change it with your own image or use my image below. what to do is change the bold text with the pictures code below, for example, if you want to change it with red icon calender, just change bluecalend.gif with redcalend.gif.
here is the icon images:

blackcalend.gif	blue2calend.gif	bluecalend.gif
greencalend.gif	orangecalend.gif	pinkcalend.gif
redcalend.gif	ungucalend.gif	yellowcalend.gif

4. Next step is find this code <data:post.dateHeader/>. The easy way to find it is by copying the code the press Ctrl-f then paste to the shown box, you will found the code immediately. If you didn't anything you can find it manually. OK, If you found it change the code with the below script.

<DIV class='dateblock'> <SCRIPT> date_replace('<data:post.dateHeader/>');</SCRIPT></DIV>

5. Save your editting, and see the result, is it working? :t

if the month and date upper, you can add this code padding: 4px 0px 0px 0px; under this code .month { and this .day {

Good Luck ............