Hatch theme: hide featured image on post center pages reduce space

sigmapersei · Member · Aug 24, 2015 at 10:06 am
Copy link

Add topic to favorites
Hello!

i have some issues with Hatch as i can’t find the css for:

1. i would like to hide (or remove) the featured image that appear in each post(and leaving the thumbnail/featured image on the main page) , i searched everywhere on the web, on wordpress forum too, and tried all the css code i could find, impossible to remove the featured image :(

2. i would like to center the about and contact page content, instead of the left

3. i would like to reduce the space on the main page between the thumbnails grid and the title/menu bar

4. i would like to have the main menu bar font a little bigger, but without putting the text in posts as the same (keep the text smaller than the menu bar)

thank you!

The blog I need help with is: (visible only to logged in users)
sfarley85 · Member · Aug 24, 2015 at 12:53 pm
Copy link
Hi there,

Try adding this to your CSS:
```
.site-header img, .entry-content img, img.size-full {
display: none;
}

.single-large-thumb {
display: none;
}

body.page.page-id-41.page-template.page-template-page-templates.page-template-about-page.page-template-page-templatesabout-page-php.logged-in.admin-bar.no-customize-support.custom-background.mp6.customizer-styles-applied.highlander-enabled.highlander-light.custom-colors #content {
margin-right: auto;
text-align: center;
}

article#post-8443 {
text-align: center;
}

header#masthead {
height: 135px;
}

.main-navigation ul {
font-size: 120%;
}
```
If any of that doesn’t work the way you want it to let me know. Also just a note in the future for CSS help try the CSS-specific subforum, as the experts there are more likely to help in an expeditious fashion.

Also for making CSS changes the fastest and easiest way to try things out is to use Chrome’s developer tools (accessed by right clicking on a piece of the site and then selecting inspect element) or Firefox’s extension Firebug. Using these tools you can try out CSS changes on the fly in your browser without altering anything on your site, and once you find the code that works for you add it to your file.

Happy styling!
sigmapersei · Member · Aug 24, 2015 at 5:51 pm
Copy link
Hello,

thank you almost everything worked! the only thing who didn’t work is for centering the about & contact page!

Thanks again
sfarley85 · Member · Aug 25, 2015 at 3:18 am
Copy link
Those were the ones I wasn’t sure about. I think I may have gotten a bit overzealous with what needed to be included for specific page class. The div’s you want to center both have the id content, which of course is displayed on other pages. To just change this div on specific pages, you need to include a body class that is specific to the page. Here is more information from a staff member on that.

So, in your case, it looks like the about page is page-id-41, and the content page is page-id-8443. As such, try this instead:
```
.page-id-8443 #content, .page-id-41 #content {
    text-align: center;
    margin-right: auto;
}
```
You can also delete the above code I suggested of:
```
body.page.page-id-41.page-template.page-template-page-templates.page-template-about-page.page-template-page-templatesabout-page-php.logged-in.admin-bar.no-customize-support.custom-background.mp6.customizer-styles-applied.highlander-enabled.highlander-light.custom-colors #content {
margin-right: auto;
text-align: center;
}

article#post-8443 {
text-align: center;
}
```
Hopefully this works correctly. If it doesn’t try ungrouping the selectors and include two different entries, in case I got that part wrong.
sigmapersei · Member · Aug 25, 2015 at 5:53 am
Copy link
Hello,

i tried your new code, it worked!

thank you so much! :)
sigmapersei · Member · Aug 25, 2015 at 5:58 am
Copy link
Another one, is it possible to disable comments, to hide it, on Pages? for contact & about?

thank you!
sigmapersei · Member · Aug 25, 2015 at 6:03 am
Copy link
nevermind!, i found the solution on the forum :)

thanks for everything!

No items found.