TechnoBlog : open your blog.

Searching for information is the real problem on the internet. This rule also applies to the Blog-o-sphere and even your own blog !

Here is a way to insert a Google search engine on your blog at Blogspirit.

First let's insert the html code in your blog with the help of the "link-note" box.

<div class="link-note">
<form method="get" action="http://www.google.com/search">
<input type="text" name="q" size="5" maxlength="255" style="width:95px;" />
<input type="submit" name="btnG" value="Go" style="width:25px;" />
<input type="hidden" name="domains" value="http://YOURBLOG.blogspirit.com" />
<input type="hidden" name="sitesearch" value="http://YOURBLOG.blogspirit.com" />
</form>
</div>

Now we will try to modify the text box. You can edit the width but also the background and the text color :

<div class="link-note">
<form method="get" action="http://www.google.com/search">
<input type="text" name="q" size="5" maxlength="255" style="width:95px; background-color: #addfe8; color: #01717f;" />
<input type="submit" name="btnG" value="Go" style="width:25px;" />
<input type="hidden" name="domains" value="http://YOURBLOG.blogspirit.com" />
<input type="hidden" name="sitesearch" value="http://YOURBLOG.blogspirit.com" />
</form>
</div>



The "valid" button can be changed the same way :

<div class="link-note">
<form method="get" action="http://www.google.com/search">
<input type="text" name="q" size="5" maxlength="255" style="width:95px; background-color: #addfe8; color: #01717f;" />
<input type="submit" name="btnG" value="Go" style="width:25px; background-color: #addfe8; border: 2px solid #000; color: #000;" />
<input type="hidden" name="domains" value="http://YOURBLOG.blogspirit.com" />
<input type="hidden" name="sitesearch" value="http://YOURBLOG.blogspirit.com" />
</form>
</div>



Before this search engine works, Google needs to know your blog. If you have just created your blog, this can take some days but as your blog is visible on Blogspirit home page, on communities, on Blogspirit search engine or on friends blogs, Google robots will be interested in your blog very soon !

Blogspirit blogs are set for a 800*600 resolution by default. Why ? Because we are 25% to have this configuration. Of course we never want to get rid of 25% of our blog visits !
The problem is you may not have enough width for your posts...

Now "Tips & Tools" has a solution :
A 100% blog for any resolution with a width set to "auto". Let's try with this blog, if you reduce or increase your window, you will see that Tip & Tools act like a rubber band !

Now let's check the code, only CSS no HTML...
Before we start, you have to choose design n°1 or n°2 in "Design"->"Template sets". The 100% mode is only available with these two designs :

Now we have to go in "Design" -> "Advanced Design" then edit the "Stylesheet" file (aka CSS file).
Only changing styles are written, any update is wrote in bold :


#container {
width: auto;
border: 1px solid #cc6600;
line-height: 140%;
margin-right: 17px;
margin-left: 17px;
text-align: left;
background-color: #fff;
}

#left {
overflow: hidden;
float: none;
width: 180px;
background-color: #fff;
margin-left: 18px;
left: 0px;
top: 120px;
position: absolute;
}

#right {
overflow: hidden;
float: none;
width: 180px;
background-color: #fff;
margin-right: 18px;
right: 0px;
top: 120px;
position: absolute;
}

#center {
overflow: hidden;
float: none;
width: auto;
background-color: #fff;
margin-right: 163px;
margin-left: 181px;
}


...


.content {
float: none;
overflow: visible;
padding: 20px 15px 8px 5px;
width: auto;
font-size: 70%;
line-height: 150%;
}


Here it comes ! You have a 100% resolution blog : anyone can enjoy visiting your blog and you have more space for editing your posts !

NB :
Tested with :
Win : IE 5.01 IE 5.5 IE 6 Firefox / Mozilla 1.7 Opera 7.3
Mac : IE 5.1 IE 5.23 Firefox / Mozilla 1.3