Hi @gdaytaiwan – This should do it:
.category-gallery .widget-area {
display: none;
}
hi Kathryn
Thanks for that but the css but it didn’t work.
Hmm – I don’t see the CSS I gave you in your custom CSS stylesheet:
https://www.gdaytaiwan.com/?custom-css=023dc8f974
The PHP code below needs to be removed from the custom CSS stylesheet.
function sketch_content_width() {
global $content_width;
if ( is_page_template( 'fullwidth-page.php' ) || is_single() || ! is_active_sidebar( 'sidebar-1' ) ) {
$content_width = 1091;
}
}
Whoa – good catch, @gary-barrett, thanks! I hadn’t looked closely enough!
Thanks all it works!!! I’ve since also added this code, which has taken away the empty space of the sidebar:
@media screen and (min-width: 50em) {
.category-gallery .site-main {
margin: 0;
}
}
How do I change the width of the featured image to match the rest as well?
sacredpath
(@sacredpath)
Automattic Happiness Engineer
@gdaytaiwan, add this to your custom CSS to make the featured image full width on that page.
.category-gallery img {
width: 100%;
}
works like a charm. Thank you very much to you both!
Ooops. Just realised that the code has now made my fixed header too fat and it cuts into the post titles, but only for the page assigned to the category Gallery.
Could you help me fix this too? https://www.gdaytaiwan.com/category/gallery/
sacredpath
(@sacredpath)
Automattic Happiness Engineer
Ah, that is weird. Even when I remove the CSS we added in my web inspector, it still is partially obscured. I took a quick look through your custom CSS and don’t see anything that would cause this, but we can correct it with the following.
@media screen and (min-width: 1281px) {
.category-gallery .entry-title {
margin-top: 70px;
}
}
Thanks @sacredpath
That fixes the obscuring, but I have noticed that the padding or white space below the menu and website icon on the header is bigger (and only for this Gallery page). Not sure why that is. Any chance I can fix that instead, rather than push down the content margin?
sacredpath
(@sacredpath)
Automattic Happiness Engineer
You can try this and see what you think. There are a number of changes that happen to the header area margins and paddings it seems depending on screen/window width, and also based on page type.
.category-gallery header#masthead {
background: transparent;
}
@media screen and (min-width: 1281px) {
.category-gallery .entry-title {
margin-top: 30px;
}
}
@media screen and (max-width: 1280px) {
.category-gallery .entry-title {
margin-top: 0;
}
.category-gallery header#masthead #masthead {
padding-bottom: 0;
margin-bottom: 0;
}
.category-gallery header#masthead .site-branding {
margin-bottom: 0;
}
}
Hi there @sacredpath
I’ve played around and added the following codes:
@media screen and (min-width: 1281px) {
.category-gallery .entry-title {
margin-top: 30px;
}
}
@media screen and (max-width: 1280px) {
.category-gallery .entry-title {
margin-top: 0;
}
.category-gallery header#masthead #masthead {
padding-bottom: 0;
margin-bottom: 0;
}
.category-gallery header#masthead .site-branding {
margin-bottom: 0;
}
}
Still the same issue for just that category page. However i’m not too bothered by it if there’s no other solution. Thanks for your help
sacredpath
(@sacredpath)
Automattic Happiness Engineer
Hmmm, I’m not sure what is causing that. I can’t see anything that is causing the image and title to be down further.
