Remove sidebar background in the Travel template

<div dir="ltr" style="text-align: left;" trbidi="on"> <b>This quick-tip is about removing the coloured section that is in the background in Blogger's Travel template.</b><br /> <br /> <a href="https://draft.blogger.com/null" name="more"></a><br /> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_PU7Vj7d4VOpQN_8DH5JBRBuEXtI2mYy09XjWYngPyRusB-eDJVolUkU7SH32FXLP0pJDXAtGBJrNPSNkoAuuXijUxNhQoPZWYzveiibL9S5IZnlhu0hZSXQPyxFgFuiK6XzJNujDJfwV/s217/quick-tips-blogger-hints-and-tips.png.png" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><br /><img alt="quick-tips logo" border="0" height="165" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_PU7Vj7d4VOpQN_8DH5JBRBuEXtI2mYy09XjWYngPyRusB-eDJVolUkU7SH32FXLP0pJDXAtGBJrNPSNkoAuuXijUxNhQoPZWYzveiibL9S5IZnlhu0hZSXQPyxFgFuiK6XzJNujDJfwV/s217/quick-tips-blogger-hints-and-tips.png.png" title="Quick tips for Blogger Users - especially about how Blogger works with other popular tools" width="200" /></a></div> Recently, I've been using the Travel template a lot:  it just seems to line things up more sharply on the page.<br /> <br /> Today I noticed that there is an option for setting the Sidebar background colour under the <b>Template Designer > Customize > Advanced</b> tool.  However it doesn't seem to work.<br /> <br /> Investigating the template shows that as well as this sidebar background colour (which is correctly set by the option above), the template also specifies a <b>background image</b> (ie not a colour) to use in the sidebars.    This isn't removed when the overall background image for the template is removed, and cannot be controlled from the template designer.<br /> <br /> But it's simple enough to get rid of it, by following these steps:<br /> <br /> 1   <a href="http://blogger-hints-and-tips.blogspot.com/2012/02/how-to-edit-your-blogger-template.html"><b>Edit the template</b></a> in the usual way.<br /> <br /> 2   Tick the <b>expand widgets</b> checkbox.<br /> <br /> 3   <b>Find</b> this code:<br /> <br /> <blockquote class="tr_bq"> <span style="font-family: "courier new" , "courier" , monospace;">background: $(widget.outer.background.color) $(widget.outer.background.gradient) repeat scroll top left;</span></blockquote> <div> <br /></div> <br /> 4   And either <b>replace</b> it with this code, or <b>delete the line</b> entirely.<br /> <br /> <blockquote class="tr_bq"> <span style="font-family: "courier new" , "courier" , monospace;">/*  background: $(widget.outer.background.color) $(widget.outer.background.gradient) repeat scroll top left;  */</span></blockquote> <div> <br /></div> <br /> The first option just comment its out, meaning you could re-instate it again by removing the /* and  */. But if you are certain that you never want it back, just delete the whole line instead.<br /> <br /> Depending on the sidebar layout chosen, there may be <b>one or more places</b> where the background image is.   Make sure that you <b>do all of them</b> that you want the background removed from.<br /> <br /> Also, if you later choose a different layout, you make need to remove the background image again even though you haven't actually changed templates.</div>

Remove sidebar background in the Travel template

This quick-tip is about removing the coloured section that is in the background in Blogger's Travel template. Recently, I've b...

Read more »