Left Sidebar...123

1.)
Left-Sidebar code to go in css

/* ----------------------------------------------- Blogger Template Style Name: 3 Column Rounders Designer: Webfixer URL: http://webfixer.blogspot.com Date: 3 May 2008 ----------------------------------------------- */ #left-sidebar-wrap { width:240px; float:$startSide; margin:15px 0 0; font-size:97%; line-height:1.5em; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ } #left-sidebartop-wrap { background:$topSidebarBgColor url("http://www.blogblog.com/rounders2/corners_prof_bot.gif") no-repeat $startSide bottom; margin:0px 0px 5px; padding:0px 0px 10px; color:$topSidebarTextColor; } #left-sidebartop-wrap2 { background:url("http://www.blogblog.com/rounders2/corners_prof_top.gif") no-repeat $startSide top; padding: 10px 0 0; margin:0; border-width:0; } #left-sidebartop h2 { line-height:1.5em; color:$topSidebarHeaderColor; border-bottom: 1px dotted $topSidebarHeaderColor; margin-bottom: 0.5em; font: $headerFont; } #left-sidebartop a { color: $topSidebarLinkColor; } #left-sidebartop a:hover { color: $topSidebarVisitedLinkColor; } #left-sidebartop a:visited { color: $topSidebarVisitedLinkColor; } #sidebartop-wrap { background:$topSidebarBgColor url("http://www.blogblog.com/rounders2/corners_prof_bot.gif") no-repeat $startSide bottom; margin:0px 0px 15px; padding:0px 0px 10px; color:$topSidebarTextColor; } #sidebartop-wrap2 { background:url("http://www.blogblog.com/rounders2/corners_prof_top.gif") no-repeat $startSide top; padding: 10px 0 0; margin:0; border-width:0; } #sidebarbottom-wrap1 { background:$mainBgColor url("http://www.blogblog.com/rounders2/corners_side_top.gif") no-repeat $startSide top; margin:0 0 15px; padding:10px 0 0; color: $mainTextColor; } #sidebarbottom-wrap2 { background:url("http://www.blogblog.com/rounders2/corners_side_bot.gif") no-repeat $startSide bottom; padding:0 0 8px; } #left-sidebarbottom-wrap1 { background:$mainBgColor url("http://www.blogblog.com/rounders2/corners_side_top.gif") no-repeat $startSide top; margin:0 0 15px; padding:10px 0 0; color: $mainTextColor; } #left-sidebarbottom-wrap2 { background:url("http://www.blogblog.com/rounders2/corners_side_bot.gif") no-repeat $startSide bottom; padding:0 0 8px; } .left-sidebar .widget { margin:.5em 13px 1.25em; padding:0 0px; } .left-sidebar h2 { margin:0; padding:0 0 .2em; line-height:1.5em; font:$headerFont; } .left-sidebar ul { list-style:none; margin:0 0 1.25em; padding:0; } .left-sidebar ul li { background:url("http://www.blogblog.com/rounders/icon_arrow_sm.gif") no-repeat 2px .25em; margin:0; padding-top:0; padding-$endSide:0; padding-bottom:3px; padding-$startSide:16px; margin-bottom:3px; border-bottom:1px dotted $borderColor; line-height:1.4em; } .left-sidebar p { margin:0 0 .6em; } #left-sidebar h2 { color: $postTitleColor; border-bottom: 1px dotted $postTitleColor; } .left-sidebar .clear, .main .widget .clear { clear: both; }

2.)
Edit css code in these areas

#outer-wrapper { width:995px; margin:0 auto; text-align:$startSide; font: $bodyFont; } #main-wrap1 { margin:15px 15px; #header-wrapper { background:$titleBgColor url("http://i265.photobucket.com/albums/ii224/webfixer/corners_cap_top.gif") no-repeat $startSide top; #header { background:url("http://i265.photobucket.com/albums/ii224/webfixer/corners_cap_bot.gif") no-repeat $startSide bottom; #footer-wrap2 { background:$titleBgColor url("http://i265.photobucket.com/albums/ii224/webfixer/corners_cap_top.gif") no-repeat $startSide top; #footer { background:url("http://i265.photobucket.com/albums/ii224/webfixer/corners_cap_bot.gif") no-repeat $startSide bottom; /** Page structure tweaks for layout editor wireframe */ body#layout #main-wrap1, body#layout #left-sidebar-wrap, body#layout #sidebar-wrap, body#layout #header-wrapper { margin-top: 0; } body#layout #outer-wrapper { width: 995px; }

3.)
Code to go in BODY above the Main-wrap1
click for details

<div id='left-sidebar-wrap'> <div id='left-sidebarbottom-wrap1'><div id='left-sidebarbottom-wrap2'> <b:section class='left-sidebar' id='left-sidebar' preferred='yes'/> </div></div> <div id='left-sidebartop-wrap'><div id='left-sidebartop-wrap2'> <b:section class='left-sidebar' id='left-sidebartop'> </b:section> </div></div></div>

Basically you add a Left sidebar to any template the same way
The resized images...you can use my links or copy and add to your server
Always preview before saving template
If you get errors...just clear edits
Once you save your template...go to page elements and drag over from right sidebar or add new elements to the left sidebar
By adding the left sidebar this way...should be no way to lose your widgets

audio

test video

Image test

This post is in regard to this problem...click here

Getting Blogger Video to work

This post fixes the preview only video problem

Well today I set my mind to getting the blogger video to work.... Bingo....as you see below

Here's how...just add...quotations marks after all equal signs...like <OBJECT class="BLOG_video_class" id="BLOG_video-22cf805c62e079d" contentId="22cf805c62e079d" height="280" width="320"></OBJECT>

Posting code

Code:
<a href="" title="" target="_blank">one code line</a> <a href="" title="" target="_blank">two code line</a> <a href="" title="" target="_blank">three code line</a> <img src="" title="">fourth code line

Put audio on your blog

Listen to Webfixer...

<script src='http://images.del.icio.us/static/js/playtagger.js' type='text/javascript'></script>

<a href="http://igottadot.com/1/1/addplayer.mp3">Listen to Webfixer</a>

or use this one...

download player here

player.swf
http://webfixer.x10hosting.com/1/player.swf

audio-player.js
<script src='http://webfixer.x10hosting.com/1/audio-player.js' type='text/javascript'></script>

1st player code:

<object type="application/x-shockwave-flash" data="http://webfixer.x10hosting.com/1/player.swf" id="audioplayer1" height="24" width="290"> <param name="movie" value="http://webfixer.x10hosting.com/1/player.swf"> <param name="FlashVars" value="playerID=1&amp;soundFile=http://igottadot.com/1/1/I believe.mp3"> <param name="quality" value="high"> <param name="menu" value="false"> <param name="wmode" value="transparent"> </object>

---

2nd player code:

<object type="application/x-shockwave-flash" data="http://webfixer.x10hosting.com/1/player.swf" id="audioplayer1" height="24" width="290"><param name="movie" value="http://webfixer.x10hosting.com/1/player.swf"><param name="FlashVars"value="playerID=1&amp;bg=0xCCCCCC&amp;leftbg=0x771100&amp;lefticon=0xF2F2F2&amp;rightbg=0x771100&amp;rightbghover=0xCCCCCC&amp;righticon=0xF2F2F2&amp;righticonhover=0xFFFFFF&amp;text=0x357DCE&amp;slider=0x357DCE&amp;track=0xFFFFFF&amp;border=0xFFFFFF&amp;loader=0xAF2910&amp;soundFile=http://igottadot.com/1/1/I believe.mp3"><param name="quality" value="high"><param name="menu" value="false"><param name="wmode" value="transparent"></object>

<param name="FlashVars"value="playerID=1&amp;bg=0xCCCCCC&amp;leftbg=0x771100& amp;lefticon=0xF2F2F2&amp;rightbg=0x771100&amp;rightbghover=0xCCCCCC&amp;righticon=0xF2F2F2& amp;righticonhover=0xFFFFFF&amp;text=0x357DCE&amp;slider=0x357DCE&amp;track=0xFFFFFF&amp; border=0xFFFFFF&amp;loader=0xAF2910&amp;soundFile=http://igottadot.com/1/1/I believe.mp3">