In fact, you can customize any post page; the only advantage I see with static pages is that they are not archived and have no post footer, they are not visible to visitors unless you link to them from a menu or some other link.
This tutorial is applicable to layout templates. For designer templates (new templates), please read PART TWO.
If you are not sure what template type your blog is using check your template type first.
Hiding page elements, changing the layout of all static pages.
On some static pages you may want to hide some elements of the layout, like sidebar and footer. Why hide them? Let's say, you want a gallery page and you need more space on the page.There are probably many ways to do this but in any case you have to make the changes in the template.
Here is how I customized some of my pages:
1. Hide the sidebar and footer on all static pages.
In this case all static pages, existent ones and those you will create in the future, will have the same layout but different from post pages.In the code bellow, the sidebar and footer are hidden. As there will be no sidebar, we have to widen the main-wrapper by adding to it the width of the sidebar.
This works different, according to your existing template but here is the code that should work in all cases:
- From Dashboard go to Design/ Edit HTML.
- Back up your template!
- Look for the closing ]]></b:skin> tag in your template.
- Insert the following code right bellow (under) ]]></b:skin>:
<b:if cond='data:blog.pageType == "static_page"'>
<style>
.sidebar,.footer {display:none;}
#main-wrapper{width: 95%; float: none; margin: 0 auto;}
</style>
</b:if>
- Preview your blog first, to make sure you have no mistakes in your code and if it loads normally you can save your template. You will see the homepage in preview, not the static page.
Now go to your static page and see the changes.
2. Change the layout for each individual page.
In this case we use the conditional tag individually for each page url, so they will all be different one from another.Demo 1 Demo 2
Tips for customizing and changing the layout of static pages.
Besides hiding the sidebar, you can include further customization in the above code:1.Use a new background image or color for your page. When using an image as background you have to find out or calculate the exact width of the main-wrapper, otherwise you will have some gaps at the sides of the page.
In the code bellow, the header, sidebar and footer are hidden and a background image is applied to the page specified in the url in red. This example is for the Minima template, width=660px.
<b:if cond='data:blog.url == "your static page url"'>
<style>
.header,.sidebar,.footer {display:none;}
#outer-wrapper {width: 660px; padding:0;}
#main-wrapper{background:url(background image url); width: 660px; margin: 0;}
</style>
</b:if>
- Replace the code in red (your static page url) with the url of the page where you want to change the layout.<style>
.header,.sidebar,.footer {display:none;}
#outer-wrapper {width: 660px; padding:0;}
#main-wrapper{background:url(background image url); width: 660px; margin: 0;}
</style>
</b:if>
- I would recommend a tileable background image because it loads faster and it is easier to install.
Search for free tileable background on image search, than upload your background image to an image host.
Picasa is my favorite image host and you already have an account at Picasa, hosting all your blog photos. You can use any other image host, note the photo url and replace the code in green with the new address.
2. Center the title and change the title font size: replace the percentage (blue) in the next code with your preferred value;
3. Change alignment for the new content, give some padding;
Here is the code for all three changes together:
<b:if cond='data:blog.url == "your static page url"'>
<style>
.header,.sidebar,.footer {display:none;}
#outer-wrapper {width: 660px; padding:0;}
#main-wrapper{background:url(background image url); width: 660px; margin: 0;}
.post {padding: 20px; }
.post h3 a {text-align: center; font-size:160%;}
</style>
</b:if>
<style>
.header,.sidebar,.footer {display:none;}
#outer-wrapper {width: 660px; padding:0;}
#main-wrapper{background:url(background image url); width: 660px; margin: 0;}
.post {padding: 20px; }
.post h3 a {text-align: center; font-size:160%;}
</style>
</b:if>
Most of us have a wider template than 660px. If you don't know how to check the width of you main-wrapper, use percentage, like in the first code. Don't forget to put margin left/right to auto, for centering the page.
Be aware that this code will change the page layout only; any other content in your usual post pages, like ads in the post or Linkwithin widget, will also be visible, like in this page, or see another example!
You can hide these elements too, with some more work.
One more thing: when changing the background color of just certain post pages or static pages, the comment block background won't change, you have to change it yourself.
It is possible to change the layout of every other post page, not just static pages, using the <b:if conditional tag. Replace the code in red (your static page url) with the url of the page where you want to do the changes.
For example, all my posts about Blogger static pages have a different background color from the rest of the post pages.
Be creative, break the monotony of you blog by customizing your pages.
Related posts:
Hide all widgets on Blogger pages-create a simple page New!
Create static pages - new feature in Blogger
Different ways to display static pages
Difference between static pages and post pages.
Managing static pages in Blogger blogs
Style static pages menu list-customize pagelist navigation
Hide the sidebar on designer templates-static pages Blogger
How to change the background color of the comment block on specific pages
Create static pages - new feature in Blogger
Different ways to display static pages
Difference between static pages and post pages.
Managing static pages in Blogger blogs
Style static pages menu list-customize pagelist navigation
Hide the sidebar on designer templates-static pages Blogger
How to change the background color of the comment block on specific pages
Update: There is a newer version of this tutorial, easier to implement and also explaining how to hide widgets in the main section.
For other templates, identify the elements you want to change and try to use Blogger template designer to add new styles. Go to Design > Template designer > Advanced > Add CSS.
I recommend installing Web Developer (add-on) for Firefox with various, excellent web developer tools, for identifying elements and their sizes.
75 comments:
I see I've found someone who has figured out the static pages. I have a problem with my template - I have automatic readmore - do you know if there is anyway to stop it being automatic on the static pages? as the read more stops the new blogger pages from working.
In a usual Minima template the jump feature doesn't interfere with pages.
You have a custom template and I can't help you.
Find the jump code in your template, delete it and use the jump feature from Blogger's new editor.
Hi there - I've done that and its working great now thanks. I would like to increase the width of the posting area but everytime I increase - it moves it back over to where it is on the home page. Using your code it is centered but there is such an empty space at each side of the posting area that I would like to incorporate into the posting area. Altering the sizes from your code doesn't work - is this also because its a custom made template? or what code do I need to add to get the posting area bigger?
This looks good as it is. You have a 1280 resolution monitor, other people with a smaller monitor will not see the whole picture if you widen it.
You don't need any code to do this, just change the width of the main-wrapper (main-by you) in you template from 600px to what width you want. See the difference between the old and the new value and add that difference to all other elements in the css of your template. This will change the whole blog not just a page. Is this what you want to do?
You have:
.wrap, header: 980px;
.header-wrapper: 980px;
.outer wrapper 960px;
.main:600px;
.post:569px;
.footer: 960px;
To all of them add the difference, but I wouldn't recommend it. They are boxes in boxes.
Google "box model" to understand what is it about but you can destroy the hole blog very easily. Back up twice your template. There are many tutorials out there, I can't write tutorials in the comment box.
If you have more questions, please enable right click; you can't hide a thing with it, just slow me down.
Thanks a lot for this. I was having problems with the sidebar of one of my static pages. This fixed it up quickly and it was easy.
what I want to do is add a widget to my stand alone page - the label one, so i can have the tag cloud as a separate page. Do you know of a way i can add code to the template that shows this widge in the body of the page? I've already suppressed the side nav
The easy way:
Go to Layout > edit posts > drag the label widget to the main area above blog posts.
- use conditional to show the widget only on your label page.
- you can hide the post section too (#Blog1) if you don't like how it looks.
- see my Archive page (from the navbar), as example. I used a post page for it.
Hi, I've tried to implement your solution, but I cannot get my main page content to expand. I've got the sidebar removed, but nothing I do seems to expand the main content to take up the missing space.
http://activistposttest.blogspot.com/p/forum.html
Any ideas?
thank you.
Correct your divs for starters, your outer boxes are smaller than the inner ones, ex:
#main .main section, post outer 576
.post-body entry-content 880
Install Web developer for Firefox to better see what you have there (ancestors & children).
All problems come from elements' width but you have to correct them yourself.
Thank you so much for the instructions. Question on my site their is a lighter colored box that holds the content how do I get it to stretch out? http://yimmarthaedm310.blogspot.com/p/important-links.html
Martha Yim, I've explained everything in my post, obviously you didn't read it.
Thought my tutorial is for Minima template, the same things go for whatever template; you just have to identify the elements.
For your link page, try this :
.column-right-inner {display:none;}
.column-center-inner div {
width: 930px;
margin: 0;
padding: 0;
background: none;
}
1.Insert the first code from my post with the above styling, to change the style for all your static pages.
2.Insert the second code, also with this styling, to change just one page.
Insert the code just before the closing head tag!
Actually I did read it several times but I am brand new to blogging and this is the first time that I have ever tried to do anything with html code. I had no idea what a minima template was so if you were planning to be rude you did not have to answer. I could only find two blogs explaining how to change static pages and yours was so nice and it seemed that you were answering peoples questions as well. Thanks but no thanks for the information.
I just tried to be brief, not rude.
Without minimal html knowledge, nobody should even open the template.
I can't write tutorials in the comment box, so please only ask questions if you know what to do with the answer.
I'll try to behave in the future.
The code worked beautifully. I had absolutely no problems dropping it in. If you would like to help me with another html issue that is completely different let me know.
I'm glad I could help.
I don't know if I can help you as long as I don't know what it is about.
Html tags are not allowed in comments, Blogger doesn't publish them, so in the best case I could describe what you have to do.
I recommend to join a forum where you can get professional help and ask anything you want. This is a great one and Aneesh, the site owner is a very sweet guy, he always answers questions.
Fabulous. Thank you very much, I will check out the forum.
Thank you! This was so helpful to rid my static pages of all the clutter. Any chance you can tell me how I can customize the static page buttons on the home page so that they look more like tabs? Thanks again :O)
I'm glad I could be helpful Mrs. Plish.
Your pages look beautiful and you have gradient tabs on your navigation, so I'm a little confused.
This is a new template (faux-column template), so try to change the tabs from the template designer; go to Dashboard > Design > Template designer.
I'll give it a try. Thanks again!
Impressive indeed! I like the way you restructured your various pages. Most appropriate for its respective content.
I've been looking for this information for a while. By the way, I've been wanting to keep my post pages sidebar-free so as to widen the reading experience. So sidebars will only be visible in the main front page. How can i accomplish this. Appreciate the advice, very much.
ed
Ed, I can't tell exactly if I can't see your template but theoretically;
- change the first line of the second code with the following bold code:
'data:blog.url != data:blog.homepageUrl'
meaning: on all pages except the homepage.
- edit the rest of your code (sidebar, footer) to suit your needs.
Thanks for the extremely quick response Maia.
I did as you suggested, and voila! the sidebar disappeared on the post pages. I've tried adjusting the width, but to no avail. Also, i've tried looking for 'div classes' to get rid of the other widgets below the comment form, such as the video, multi-tab widget, labels. I've even tried to get individual widget id's to get rid of it. Understand that i'm operating purely on my own logical skills and have just about no knowledge in this field.
Anyway, I thank you for your suggestion. I'll see if i can resolve it. I would like to show you my template, include you as a member etc so you can see it. But I don't really want to inconvenience you further. Thanks again.
ed
Maybe I'm just tired, but I followed the above instructions and although it worked beautifully, it also took the sidebar out of the post page (which I didn't expect). Am I misunderstanding what we're doing here or doing something wrong? I just want the sidebar out of the pages, not the main post. Thanks
Renee and Mike,
You probably have a faux-column template (new template). That means, the columns you see are fake, just a background image.
If you have a usual Blogger template, use the first code, it works.
As I said before, I can't help if you keep your profile hidden. I have to see the blog.
Thanks Maia. I use the Stretch Denim Light template in Blogger. I did use the first code. My post changed and then I saw Ed's entry and tried to replace the one line with 'data:blog.url != data:blog.homepageUrl' and that didn't seem to work either (the post changed again). If that's not enough info, let me know how to give you the profile info to troubleshoot. Thx
Renee and Mike,
- the code for Ed is to get rid of the sidebar from all post pages.
- the first code in my tutorial is just for static pages.
-I don't need the profile info, just your blog's url in a comment. I shall not publish it if you say so but I'll answer tomorrow because it is 2:46 AM at my clock.
Get some sleep. And then you can look at www.islandbabble.blogspot.com/. I got the impression Ed had the same problem, but either way, I'm getting the post to change and not just the static pages. Appreciate the help. I'm probably at the point I need to convert to an actual webpage...Talk to you later, Renee
Not sure if the earlier comment took, but the blog is www.islandbabble.blogspot.com.
Yes Renee and Mike, I published your comments because you didn't specify what to do.
So, you don't know exactly what you want, either.
For static pages:
- insert the first code at the exact place described in the tutorial;
- change the second line to:
#main-wrapper {width: 90%; margin: 0 3%; padding: 0 20px;}
You have a very wide template and the content will spread over the whole width.
I tested this on your announcement page and it looks acceptable.
If you want to change all your pages, there is much more to do and it is not the subject of this tutorial.
It can't be done in a comment box.
There are so many beautiful templates, choose one you like from the new template designer.
Have a great weekend!
Every time I do what I'm thinking the tutorial says (I can cut and paste), the post page changes as well as the static page. I want the post page to have the side bar, the static pages not to. I'm not having any problems with the sizing - it looks perfect when it does it on my post - the problem is I don't want it in my post...
I was going to paste the code so you could see it, but the comments thing won't let me. So in brief, I'm putting exactly what you've got...
I have this in my template and then the head entry:
#navbar { display: none; }]]>
I've put the info from your website right after "skin>"... Then after head, I have the <body.
Yes, I see it now. Something is missing from the template but I have no time to check it piece by piece, besides I'm just an amateur.
Go over to Asheed's forum for professional help, sign up and tell your story. You can find the link at the 15th comment, above.
Sorry that I couldn't help.
Will do. Appreciate you trying to help.
I found your advice via Google. All I wanted to do was to post a calendar on a separate page and not have the sidebar cut it off and your bit of code worked like a charm. I was able to have the calendar page show up without the sidebar — wonderful. Thank you very much.
MayneNews Community Events Calendar
I finally found out how to do it and it doesn't sound like chinese. I have tried a few others but they made the instructions more complicated than they had to. Yours is clean, easy and straight to the point. Plus it worked. Peace
Hi,
Can you please let me know how to get rid of the buzz this button on the title on the static pages? I've tried .post-title {display:none;} but didn't work.
http://cockasnook.blogspot.com/p/photobucket.html
That's a javascript, unless it's not in a widget, I don't know how to hide it on just one page.
Thanks for this!
Thank you so much for providing correct instructions for removing sidebars from static pages!
Hi,
I was able to remove the sidebar with your code but the area in the contact page isn't wide enough now that the side bar is gone. I tried messing with the wrapper width but it didn't change anything. Do you know what I am doing wrong?
PD4SP,
Your blog uses a designer template, so this is not the right tutorial for you.
There is a link at the end of the third paragraph (part two), that will take you to the right tutorial.
I couldn't find your contact page but I've tested the code on your last page.
Here you can see a screen shot of it in the next two days.
If you have questions please address them on the appropriate tutorial.
Much luck!
awesome worked great thanks alot
I'm glad I could help. Your page looks great.
hey maia my blog is at www.dopedealskateboards.com
I see that in your post " customize-style static pages,hide sidebar in blogger" you explain how to take away the sidebar in static pages I did like you explained and it worked thank you very much but you you also wrote about making the static pages bigger once the sidebar is removed... that's exactly what I need to do I see that you have done it on your blog If you could please explain how to do this I would be extremely grateful and subscribe to your blog thank you very much!!!!
Sharp,
You have a new (designer) template too.
Use the other tutorial; there is a link at the end of the third paragraph (part two), that will do the magic.
I've left some instructions for you in a comment, at the appropriate tutorial.
Hi there again..
thanx for your comments to me.
Hi there,
I've fixed your page (hiding the sidebar) but when I was ready, Blogger went down.
I see you deleted the page.
If you still need the code, let me know.
Actually it's not me who deleted it. All of my posts/changes I made to my blog between that maintenance time is gone. D;
Anyway i remade the page, here can u look at it
http://mazuto.blogspot.com/p/narutofangc.html
I need the width post to be maximised. Dunno why it doesn't work.
And Yes, I still want it plz :D
Thanx!
MaZ_OnE,
It doesn't work because your template is somewhat different.
1. Use the conditional tag for that page but put this code between style & style:
.header,#sidebar-wrapper,.footer {display:none;}
.cover {margin: 0 auto;}
#content {width: 100%; margin: 0 auto; padding: 15px 0 0;}
.post {width: 950px; margin: 0 auto;}
.entry {padding-left:15px; background: url(http://stopgame.ru/files/wallpapers/9310/grand_chase-2.jpg)}
.post h3 a {font-size:160%;}
2. IMPORTANT!
- I've placed your background image in the entry section and put some padding to the content.
Now you have to delete the div with the background image from inside your post, otherwise you will have two of them.
- I've just approximated the width of your post (950px), I leave you to calculate the exact value if you don't like it.
3. Here is a screenshot of how it should look like. This was the page that you've lost, you can recover your text here.
4. Btw, I've lost your first comment too, I tried to publish it when I've got the bX-error and it was gone.
Much luck!
I am trying to remove the sidebars for only one of my static pages, not all. In the second part of the code where you indicate how to change backgrounds and such. I tried to just put in the url in red and it doesnt work. What is the best way to only remove the sidebars for one static page?
The code is always the same but templates are different.
You have a beautiful Minima template with an additional sidebar. If you just want to hide the two sidebars than:
Step 1. Use the conditional tag as in the second code but replace the code in red (your static page url) with your static page URL
Step 2. Replace everything between style & style with this:
--------------------------------------------------------
#sidebar-wrapper,#left-sidebar-wrapper {display:none;}
#main-wrapper{width: 860px; margin: 0;}
.post{width: 700px; margin:0 auto;}
--------------------------------------------------------
- The last line is to make your post narrower; you can delete this line (or change the value), if you don't like it.
For comparison, you have two screenshots of you Getting started page here 1 and 2
That's all, let me know if you have more problems.
Check the existing page in IE before you start, and the new one too after.
wonderful work, i was badly needed this trick,. thank you very much, i love you.....
Wow, I'm flattered Kamal and I'm glad it worked.
I am attempting to change my static pages to a primary content area with no side widgets... For example my price page under publications... I would like the pricing table to be the only thing on the page... please also advise me in the over customized area, what do you think is over done... This is my first time doing this please provide as many comments as possible...
Custo-Minz,
1.To change all static pages:
- use the conditional tag (line 1 and 2) from the first code;
- replace the lines between style & style with this code:
#sidebar1,#sidebar2 {display:none;}
2. To change just one page do the same using line 1 from the second code, as explained.
It looks like this in Firefox and Chrome. I can't check it in IE, my browser crashes when I load your page.
Forget about the customization. What I meant is that you have tons of classes and IDs and 29 background images on one page.
That's all I can help with. Good luck!
It is not possible to enter html code in the comment box but here is a photo of the code itself and its placement, for your pricing page.
You can't copy it, its a picture, just follow the instructions in my previous comment.
First I would like to thank you for taking the time out to help me. Then my apologizes for the duplicate worries lol. You have helped me tremendously. Thank you Thank you Thank you, you are the best!!!!!!!!
You are welcome Custo-Minz. I like the new colors on your site, nice work!
Thanks this was just what I was looking for.
It took me awhile to figure out how to get my post area to expand to fill the whole page but adding this code did the trick...
#main {background:url(background image url); width: 978px; margin: 0;}
I was wondering if there is a way to remove a specific widget from the page like the one located above the post section? i tried severl things and they just removed all the widgets.
is this possible?
http://testlousblog.blogspot.com/
Sorry for any sloppy code this is just a test blog.
Lou Jones,
Yes, as I said in the tutorial, you can hide any other element with these codes.
If you are using one of the above codes for a specific page, just enumerate the ID of the widget you want to hide among the other elements, like this:
.sidebar,.footer,#HTML5,#Label1 {display: none;}
First find in your template the ID of the widget you want to hide; with your browser (Edit menu/Find or Ctrl+F in FF),look for the title of that widget.If it doesn't have a title, give it a temporary title to ease your search, let's say "My pictures";
Than looking for that title; you will find a code line with the widget ID, like in these examples:
b:widget id='HTML5' locked='false' title='My pictures' type='HTML' or
b:widget id='Label1' locked='false' title='Labels' type='Label
That's it, the widget is hidden on you page of choice.
one thing maiaT, i have some widget that are un removable unless from edit html. i have creat a static page http://kamalashraf.blogspot.com/p/forum.html
how can i remove these un removable widget, i am waiting for your reply
Kamal,
What do you mean by un-removable widgets? Could you be more specific?
You have the same sidebar on this static page as on your homepage, for now.
We don't remove the widgets with these codes, we just hide them on certain pages. They are still in the template and yes, you have to do this in EDIT HTML, the only way to edit the template.
Hello mate, really like that you are helping people make changes via html coding as that is some very challenging stuff, i have been fiddling around with it but have no clue.
I have tried removing the sidebars from a specific page but i cannot do it mate,i input what it is that you have said on here but it isn't working. MY blog is http://www.fluffnutsportstrading.blogspot.com
The page in question is Trading Store.
Also i wanted make certain widgets only appear on certain pages if you can shed any light on that. I know how to get the widget id etc but i think the problem is i am not sure what constitutes a static page url?? is it the last part of the normal url that makes it different from your homepage or the whole address http://www.etc.etc.etc.ec
Thanks in advance mate and keep up the good work.
ps im no programmer so if you could keep it as simple as you can i would really appreciate it.
Thanks again Maia T i am ver y very grateful.
Regards
fluffnut,
1.Go to the other tutorial for designer templates, there is a link at the end of the third paragraph of this tutorial (part two).
To hide both your sidebars use code 3.4 after you read the instructions in that tutorial.
2. To hide widgets read Lou Jones's question above and my answer to him.
Much luck!
Save With Me 24/7,
Use the second code but:
1. Replace the code in red with your own page url;
2. Replace everything between the opening and closing style tag with this code:
#newsidebar-wrapper,#sidebar-wrapper {height:0; display:none; visibility hidden;}
#main-wrapper {width: 95%; padding:0; margin: 0 auto; float:none;}
3. Replace 95% with 100% in this code if you don't want those margins at the sides.
4. Read the tutorial to find out where to insert the code.
Good luck!
hi,
In my blog , static pages are not opening at all. plzz help me out
give a look plzz
www.bhojpurigaane.com
Bhojpuri Song,
I checked your first page which is a link list from A-Z.
You are using Freewebs classes in your blogger template HTML like fw-text, fw_link_paragraph that are not specified neither in your template CSS nor in a linked stylesheet. No wonder nothing shows up.
You have to specify a style for these selectors in your CSS if you want to keep them.
See some help here.
Hi Maia T,
I'm having a hard time making the #main-wrapper expand on a specific url that has a large chart widget (http://www.distressedvolatility.com/p/real-time-interactive-chart.html). I'm using an old school 2004 Minima blog template.
Do you know what I'm doing wrong? Thanks!
Hello Matt Dvolatility,
This is not the original Minima but close.
To stretch the main-wrapper do the followings:
1. in your template find this code
#main-wrapper {
border: 0px solid white;
max-width: 726px;
delete max- and leave only
width: 726px;
This is what prevents the stretching of the main-wrapper.
2. Your outer-wrapper is 1060px but the main-wrapper has 2x8px (left/right) padding, so the new main-wrapper will be 1044px wide (1060-16 = 1044).
#main-wrapper {width: 1044px !important; float: none !important; background: red;}
or you can have the whole 1060px but then loose the padding,
#main-wrapper {width: 1060px !important; float: none !important; padding-left: 0; padding-right: 0;}
3. Give some padding to the post for a better look:
.post {padding-left: 10px;}
You can insert the code directly on you static page instead of the template as described in this tutorial at the link above. Pay attention to 2.3. at step 2.
Happy coding!
YES! Thanks for catching that max-width mistake. I tried to make the Minima template fluid but I couldn't figure it out.
Thanks again,
Matt
You're welcome Matt.
Hi Maia! May I please seek your assistance on my template? See, I downloaded a template and originally, the homepage didn't have a sidebar. I had it inserted some codes for it to have a left sidebar about a year ago, but now I want the old homepage back (without the sidebar). I can't quite figure out though how to put it back to its original state. Also, with the original template, when you click on any page or blog post, I still has that sidebar even if there aren't any widgets on it and I would like all pages/ posts converted to a full-width page (without sidebars as well). Would really appreciate if you could take a look :) My blog is www.filipinaexplorer.com. Thanks!
Hi Gretchen,
Piece of cake but you have to make the changes in the template. Please pay attention!
1. Go to Layout and drag all sidebar widgets somewhere else or delete them if not needed.
2. Go to Dashboard/Template/Edit HTML, click the arrow at b:skin <![CDATA[/* and find this piece of code:
#main-wrapper {
width:680px;
float:right;
word-wrap:break-word;
overflow:hidden;
}
#sidebar-wrapper{
width:240px;
float:left;
word-wrap:break-word;
overflow:hidden;
}
3. Replace the following values in the code:
- at main-wrapper:
680px replace with 945px;
float:right; replace with float:none;
insert right after: margin: 0 auto;
- at sidebar-wrapper:
width:240px; replace with width:0px;
4. preview the template first, you can revert it if something goes wrong. Save when it looks ok.
My test page looks nice but you never know.
If you change your mind sometimes in the future you can always get back this layout by reinserting the old values. It is a good idea to copy this comment to notepad and save it, so you know what changes you've made.
Happy coding!
I have tried this and it works with one exception... my pages don't show the sidebar but the page doesn't get any wider... it's like the sidebar is still there but with nothing in it. I have tried everything I could think of and it still doesn't work :o(
Tania
Hi Tania,
I can't stress enough that these customizations are for Blogger free templates not for Etsy's custom templates.
Your blog template is so heavily customized already that it is impossible for me to help you in a comment box, sorry for that.
Ok, is it possible that you could help me for a fee? I would really like just one of my static pages to be full screen if possible :)
Thanks,
Tania
No, that's out of the question. The problem is that I am very busy and your template is like a jungle (no offense). Too many things to change.
I'll try to look at it next week and I will let you know in a comment on your blog but I can't promise.
Ok, thank you. I appreciate any help you can give me and I appreciate all the help you've already given on your blog! I just found you so I'm still looking at all the great posts!
Tania
Post a Comment
Thanks for taking the time to comment.
Please don't leave link in your comment. Thank you.