Archived topic
Add new Global Element Hero to work with extra pages
23 replies · Started by Tim Zurawski on January 26, 2019
Right - hopefully we're closer to what you want. From the top:
1. In the Customizer > Colors > Body - i have set the background color to #f2f2f2 and text color to black. This applies to the entire site. So all other pages and new pages will now be white with black text. So no need to use the pagebuilder fullwidth setting and changing your colors in Elementor.
2. For the 4 dark pages, i have added black backgrounds to sections to replace the white background - i hope i haven't broken anything. But these are 100% edited in Elementor now. Removed any neg margins where they weren't needed.
3. Edited the Home Page Hero and created a new Dark Header Page hero - they both have the following common changes:
3.1 They have an Element Class of dark-header ( come to this in mo)
3.2 Site Header Tab - Set to merged, with an offset of 108px ( the height of the site header) so they are not merged but we need the merged setting to unlock the options for Site Background and Navigation colors.
3.3 You can change the Site Header Background colors and nav colors in these two header elements for just these 4 pages :)
4. In Customizer > Simple CSS i have add this:
.dark-header + #page + .site-footer .site-info {
background-color: #000;
color: #fff;;
}
So when there is a header element with the dark-header class ;) present it changes the site-info colors
let me know
Wow, David, I would have never been able to do this.
I should be able to make drafts of the other pages but need to get rid of the color stripes
Going forward, what would be the best practice if I want to change the background color on these 15 pages?
http://trendstrategics.com/analytics/
I did my best on this page
http://trendstrategics.com/photo/
But this is what I am after
http://trendstrategics.com/photo-2/
In other words, make the entire background the same color
When we get this, I think I can handle the rest of the formatting.
Thank you David!
timz
<><
So the background and text colors is now controlled by the Customizer.
The background is set in Colors > Body and Colors > Content - they are both the same #f2f2f2.
The text color is in Colors > Body
For these pages in Elementor you can leave the text as the default colors which gets it from the Theme. And likewise for Section / Column backgrounds which default to transparent.
David,
Best way I could figure to get it done is to delete the old pages and recreate them using a draft of one you made. Had to go through it page by page, but I think I got it now.
I have lots of typography things to do, but structure is pretty much the way I like it.
There is one thing on the dark pages is that there is a white rectangle over the three links that are not selected. What would be the function to change that?
And thank you so much for your help. I have been struggling for 2 weeks! So after this, I can focus on content.
David,
I just went to a few pages and somehow the top and bottom turned black
http://trendstrategics.com/print/
http://trendstrategics.com/photo/
http://trendstrategics.com/video/
they are all black top and bottom! What did I do?
Really sorry, I thought I had it
Ok - for the dark pages you need to set the Navigation colors in the Header Element > Site Header - check the navigation colors checkbox and you can adjust them. I have made the changes on the Home Page Hero for you, so they match the original Site. Adjust them as you see fit and then make the same changes for the Header Element thats effecting the other dark pages.
In the Dark Header - you have added Pages to the Display Rules. Remove that :) Just leave the specific pages you had before
Thank you David!
You're welcome - glad to be of help :)