CSS Code to Remove Side Bar From Individual Posts

lifestylesky · Member · Oct 9, 2015 at 2:02 am
Copy link

Add topic to favorites
Hello,

I know how to remove the right sidebar everywhere. However, what I want is to have it for the homepage, archives, etc.—but not for the individual posts.

So remove sidebar from individual post so that my images/post are at full width.

I am looking for the CSS code.

http://www.lifestylesky.com

Thank you so much!

Masha

The blog I need help with is: (visible only to logged in users)
ehtis · Staff · Oct 9, 2015 at 2:25 pm
Copy link
Hi Masha,

This should do it. The .single class will apply this selector to individual posts only:
```
.single #main #primary {
	width: 100%;
}
```
lifestylesky · Member · Oct 9, 2015 at 5:54 pm
Copy link
Hello,

Thank you!

When I used that code my sidebar went on the bottom and to the left.

Is there another code I can try?

Thank you!
thesacredpath · Member · Oct 9, 2015 at 6:48 pm
Copy link
Hi @lifestylesky, I think @ehtis was assuming you would add back in the code to hide the sidebar and then use his code to widen the content area. Here is the complete code.
```
.single #tertiary {
    display: none;
}
.single #main #primary {
    width: 100%;
}
```
ehtis · Staff · Oct 10, 2015 at 12:37 am
Copy link
Ah, so sorry! I actually forgot to give the code that hides the sidebar. (Had even tested it!)

Thanks for chiming in, @thesacredpath. Good to see you back! :)
thesacredpath · Member · Oct 10, 2015 at 1:26 am
Copy link
@ehtis, no worries, and thanks.
tivolifoto · Member · Oct 10, 2015 at 10:05 am
Copy link
Hello, is this also possible only for one post? With pages i can choose the Template full width.
ehtis · Staff · Oct 10, 2015 at 7:07 pm
Copy link
@tivolifoto, it’s possible, but this thread is specifically about The Able theme and @lifestylesky’s blog.

Can you please open a separate thread and also link to your blog? Codes are often different between themes.
thesacredpath · Member · Oct 10, 2015 at 7:11 pm
Copy link
@tivolifoto, yes it is possible to change only a single post. Since you did not give us a link to the site, or post, where you are wanting to do this, and since CSS is theme specific, I can’t be more specific. If the site you are talking about is not using the Able theme, which is discussed in this thread, could you create a new thread in the CSS Forum? Many thanks in advance.
lifestylesky · Member · Oct 10, 2015 at 9:56 pm
Copy link
Thank you both!

It worked..the only thing..my image/media is still same size. I want it same size as the text below the image.

http://lifestylesky.com/2015/10/08/top-5-fall-trends/

My “Pages” expand my media really well (example) http://lifestylesky.com/about/

Thank you so much!!!!

Masha
ehtis · Staff · Oct 10, 2015 at 10:04 pm
Copy link
Here you go:
```
.single .aligncenter {
    width: 100%;
}
```
lifestylesky · Member · Oct 10, 2015 at 10:28 pm
Copy link
Thank you so much! It worked.

Last question.. The media now is a little blurry. I re-uploaded the picture in full size and it’s still blurry. I would like it to be crisp and clear.

http://lifestylesky.com/2015/10/08/top-5-fall-trends/

The same image is in my “Fall Trend” and it’s crystal clear.
http://lifestylesky.com/trends/

Any thoughts on why that is?

Thank you!
ehtis · Staff · Oct 10, 2015 at 11:03 pm
Copy link
The images are being resized and then inserted in posts. Check the attachments, do you restrict their width/height in the media library when inserting?

The ones on pages are being fetched with width set to 1176px and height 2526px. Those on posts are resized to 869px width.

Also a possibility this theme automatically resizes them, if that’s the case, don’t think we’ll be able to change that. But please check your attachments first and verify their sizes.
lifestylesky · Member · Oct 11, 2015 at 6:06 am
Copy link
Thank you so much!

Thank you both for all your help!!

Masha

No items found.