Archived topic
Adding a wrapper
5 replies · Started by Charalambos on May 8, 2018
Hello,
First of all, thanks for this theme, its by far the best and fastest i have worked with.
I have searched throughout the forum but could find an answer about wrapping your content. I found the link below which talks about wrapping your entire container,
https://docs.generatepress.com/article/adding-a-container-wrapper/
My questions is, how do you apply it on the blog area, in order to wrap the posts with a thin border line. For example i m using a home page with 2 columns and the default sitebar. How do i wrap each post?
Last, I am using the primary navigation as a header, so i found the link below on how to do it in 5 steps.
https://docs.generatepress.com/article/navigation-logo/
1. Set your navigation location to Below Header or Above Header in Customize > Layout > Primary Navigation.
2. Remove your site title/tagline/logo from the header in Customize > Site Identity.
3. Set your Navigation Logo Position to Sticky + Static.
4. Set your Sticky Navigation Transition to None.
5. Then, full remove your header using the CSS below:
However, by removing the site title/tagline, then the site stays without a title which is not good for SEO. I just removed the header logo, hided the site title/tagline and set the header padding to zero. I didn't even used the CSS code. Would that be any problem?
thanks in advance for help
Hi Charalambos, thank you glad your enjoying the theme.
To add a border to the post article just requires some CSS:
.blog .post .inside-article {
border: 1px solid;
}Removing the Site Title is not an issue as this is still kept as the title meta.
Hello David,
Thanks for your quick reply. The code works for the content area in the homepage. May i ask how do i wrap everything? i.e sitebar, all blog areas like categories and tags, primary navigation, footer etc.
As for using the primary navigation area as header, the last step in the link above speaks about adding the css code below to completely remove the header,
.site-header {
display: none;
}
However, I have managed to remove the header by just hiding the title and tagline and set the header padding to zero. Do i still need to add the css code mentioned above?
regards
Hi, you can just add a border to the site content for the blog like so:
.blog .site-content {
border: 1px solid;
}Or if you want greater control then you can apply the container wrapper solution you posted above and then style it for the blog page:
.blog .full-container {
border: 1px solid;
}For the header if your current fix works then that is fine.
David
Ok thanks for the additional info,
I will go through my options once more and see what suits me better.
Your welcome Charalambos - we're here if you need any further assistance
