Tuesday, October 30, 2007

Add footer sections to Blogger/Blogspot blogs

I wanted to edit my template a bit because I hate the speed of loading. My solution? I added a new Footer section.I have my blog arranged so the posts load first, then the sidebars, and my cellar loads last. So, unless you are a speed reader, by the time you reach the footer, it is fully loaded. No waiting.
My cellar is defined by a horizontal line with text across the top and a horizontal line across the bottom. This is how it appears on the Page Elements page.


Not only does it contain the 3 column area, it contains a full width column before and after the last horizontal line!

As always, it is a good idea to save your template before starting.

Now, add this code to the CSS sheet between :
#footer-column-container {
clear:both;
}
.footer-column {
padding: 10px;
}
.footer-bottom {
padding: 10px;
}

Next find this code:


<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>


Replace <b:section class='footer' id='footer'/> with this code:

<div id='footer-column-container'>

<div style='clear:both;'/>

<p>
<hr align='center' color='#cccccc' width='90%'/>
</p>


<div id="footer2" style="FLOAT: left; MARGIN: 0px; WIDTH: 33%; TEXT-ALIGN: left">
<b:section class="footer-column" id="col1" style="FLOAT: left" preferred="yes">
<b:widget id="HTML1" title="" type="HTML" locked="false"></b:widget>
</b:section>
</div>



<div id="footer3" style="FLOAT: left; MARGIN: 0px; WIDTH: 33%; TEXT-ALIGN: left">
<b:section class="footer-column" id="col2" style="FLOAT: left" preferred="yes">
<b:widget id="HTML2 locked=" title="" type="HTML"></b:widget>
</b:section>
</div>



<div id="footer4" style="FLOAT: right; MARGIN: 0px; WIDTH: 33%; TEXT-ALIGN: left">
<b:section class="footer-column" id="col3" style="FLOAT: right" preferred="yes">
<b:widget id="HTML3" title="" type="HTML" locked="false"></b:widget>
</b:section>
</div>



<div style="CLEAR: both">

<div id="footer-bottom" style="PADDING-RIGHT: 10px; PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; TEXT-TRANSFORM: lowercase; PADDING-TOP: 10px; TEXT-ALIGN: center">
<b:section class="footer" id="col-top" preferred="yes">
<b:widget id="HTML4" title="" type="HTML" locked="false"></b:widget>
</b:section>
</div>

<p>
<hr align="center" width="90%" color="#cccccc">
<p></p>
<div id="footer-bottom" style="PADDING-RIGHT: 10px; PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; TEXT-TRANSFORM: lowercase; PADDING-TOP: 10px; TEXT-ALIGN: center">

<b:section class="footer" id="col-bottom" preferred="yes">
<b:widget id="HTML5" title="" type="HTML" locked="false"></b:widget>
</b:section>
</div>

<div style="CLEAR: both">
</div>
You can name your footer here or remove this code if you don't want text. You can also change the color of the horizontal line.

Save your template. Depending on your blog, you may have to change some of the widgets from HTML1 to a different name...like HTML 15. Just depends upon what type of widgets you have in your blog. Remember you can always delete the widget and put in a different type later. This is just to get the code in place.
.

Thursday, October 4, 2007

Need for Speed ProStreet Screenshots

Checkout these pics of the Newly launched NFS ProStreet.

October 3, 2007


October 3, 2007


October 3, 2007


October 3, 2007

September 5, 2007


September 5, 2007


September 5, 2007


September 5, 2007

September 5, 2007


September 5, 2007


August 25, 2007


August 25, 2007