Troubleshooting Blogger template

If some have noticed the present new look which I have taken some trouble in it. For a day and a half I was stuck with floating columns sitting underneath one another because the containing wrapper (often called #outer-wrapper) isn’t wide enough to accommodate them side by side. This struck when I attempted wrapping AdSense Ads around Blogger Post Content. I have restored a back up template but the item page view remained affected. (The front page is ok)(This which I understood later that wrapped AdSense Ads inline only shows in item page and affected the distortion)

Not realizing initially that the mishap was due to the manoeuvre in wrapping AdSense Ads around Blogger post to the left. This pushed the middle column side bar beneath. At first I manually increased all the Wrappers width in red- /* Outer-Wrapper ----------------------------------------------- */ #outer-wrapper { width: <span style="color: rgb(255, 0, 0);">950px</span>; margin:0 auto; padding:10px; text-align:left; font: $bodyfont; } #header-wrapper { width:<span style="color: rgb(204, 0, 0);">880px</span>; margin:0 auto 10px; border:1px solid $bordercolor; } #main-wrapper { width: <span style="color: rgb(204, 0, 0);">450px</span>; float: left; 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 */ } #sidebar-wrapper { width:<span style="color: rgb(204, 0, 0);"> 250px</span>; float: right; 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 */ } #newsidebar-wrapper { width: <span style="color: rgb(255, 0, 0);">250px</span>; float: right; 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 */ } <span style="font-style: italic;">Aligning the newsidebar to the right </span> <div id="main-wrapper"> <div id="newsidebar-wrapper"> <b:section class="sidebar" id="newsidebar" preferred="yes"> </b:section>

Scenario: Column Margins in Layout. Much later realized adjusting the margins would all be necessary. When adjusing the margins, the width of the sidebars, the main post column and all the margins must collectively add up to 950. If they exceed 950, one of your columns will drop to the bottom of the page. If they are less than 950, all three columns can still be seen but the layout will be asymmetrical. Read More here. READ Troubleshooting 3 column Minima layout. ( I abandoned the Adsense Ads inline wrapping method even after a successful makeover of this site)

While attempting further without the above prior knowledge mentioned, I somehow corrupted the template code in the confusion caused wrapping Adsense code inline.

The cause is obviously the main wrapper hasn't enough width to accommodate thus pushing the middle column beneath it. I got desperate and started to upload new & back up templates back and forth. Then stuck with permanent error messages of bX-cxyu7t & bX-y4ne02 being unable to upload and changed any more templates. Changing to a different browser did not help nor switching to Blogger standard template before uploading another.


I keep getting error messages and can't upload any Blogger template via the XML upload. I later found out the problem occurred because there were some widgets in the previous template which needed to be deleted. I deleted one widget code (Numbered Page Navigation for Blogger) which is the main culprit in the Edit HTML section and resolved the issue to upload template. (After remembering this which was one of the last thing I have done before the errors arised)

During the previous attempt in the process of unloading templates, widgets were prompted that they will be lost when proceed, which I did and lost most of the widgets.

I didn't realize all these until I got through the glitches in uploading a new template. Undoing the Adsense wrapping strategy resolved the issue realized when I tried again after successfully unloading a 3 columns template. Horror, I didn't save any widgets and thus losing all of them.

Wrap AdSense Ads Around and Inline Beside Blogger Post Content Add the following two line on top of Google Ad code ================================================== <div class='post-body entry-content'> <div style="float: left;" =============================================================== Add the following line after Google Ad code ===================================================== </div> ============================================================ Append the following lines of code into the template BEFORE the line of (Search for the following line in the new Blogger template HTML code in the text box:) <data:post.body/> or <p><data:post.body/></p> Parse the HTML code of AdSense JavaScript with escape character @ http://www.eblogtemplates.com/blogger-ad-code-converter/ (Red are the codes added as describede above) ----------------------------------------------------- <div class='post-body entry-content'> <div style="float: left;" <div class='post-body entry-content'> <div style="float: left;" <script type="text/javascript"><!-- google_ad_client = "pub-6379108292233674"; google_ad_host = "pub-1199571886004985"; //180x90, created 11/22/07 google_ad_slot = "0333033249"; google_ad_width = 180; google_ad_height = 90; //--></script> <script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript"> </script> </div> </div> ---------------------------------------------------------------------- Note the above code will align AdSense ad block to the left. You can also make it make it float to the right, but change the “float: left;” to “float: right;”.

How to copy widgets from one template to another as back up Create a test blog (with no widgets present), upload your new template, and copy all of the widgets over from your existing template (see this post for details). http://www.bloggerbuster.com/2007/09/how-i-copy-widgets-from-one-template-to.html ==================================================================== Your blog widgets are saved in your Blogger account, rather than in the actual template of the blog. The widgets are called to your blog by anchors within the template which look like this: <b:widget id='HTML1' locked='false' title='My Widget Title' type='HTML'/> Using a second "test blog" method for copying over your widgets from your old template to your new one:

View blog reactions