it is still going to use the css from the main template
So apply new CSS via your child theme’s stylesheet.
Thanks Esmi
Yes I understand how to change the css in the child theme. But if the layout needs to be completely different on the blog page to the main static pages then surely you need to use two templates.
For instance the css for the the static pages:
.site {
margin: 0 auto;
max-width: 80%;
overflow: hidden;
}
Blog page:
.site {
margin: 0 auto;
max-width: 980px;
overflow: hidden;
}
Also the layout of the sidebar and widths of the content all need to be different as well as the top navigation.
This lead me to the conclusion that having two installations of WP would be easier but there may well be a better way.
But if the layout needs to be completely different on the blog page to the main static pages then surely you need to use two templates.
WordPress already does. The blog (main posts page) uses index.php whilst static pages use page.php. All you have to do is amend the CSS for your blog page via your child theme.
Thanks Esmi
I can see how you would change the width of the main content of the blog by changing the class in the index.php file then amending the css in the child. Then I could add a different sidebar and tell it to float right instead of left etc.
But how can I have a different page width on the blog to the static pages. The page width is controlled by .site and the index.php file doesn’t refer to it.
Thanks again
Have you tried looking at the classes generated on the opening <body> tag?
Yes I am using the Twenty Twelve template and the body tag controls background color, fonts margin etc. The width is controlled by .site
The problem being is I cant see how you would change the width of the class .site for just the blog page.
Is there a way of assigning a particular template for a particular page?
I also dont understand how I would have a different top menu on the blog page to the static pages. I get how I would have a different sidebar.
Thanks Esmi I realise this is an odd request.
What classes are being generated on the blog page’s body tag?
Ah yes there is a difference there. Managed to change the width of the blog page by adding some css to the child:
[ Code fixed, you have to end it with a backtick and not a single quote ]
body.blog .site {
margin: 0 auto;
max-width: 900px;
overflow: hidden;
}
Thanks Esmi your a star.
How can I have a different top menu on the blog page. The static pages has the main menu set to the top navigation. I need a different top menu on the blog page and have no idea how to achieve this?
