Home › Forums › Support › Different Header and Footer on Different Pages This topic has 13 replies, 2 voices, and was last updated 3 years, 7 months ago by Leo. Viewing 14 posts - 1 through 14 (of 14 total) Author Posts August 27, 2020 at 12:14 pm #1420920 John Hi, I’d like the logged-out header and footer on the pages of a membership site to be one color, and the logged-in header and footer of other pages to be another color. How can I do this? Thanks! August 27, 2020 at 1:07 pm #1420976 LeoStaff Customer Support Hi there, I wonder if we can just use some CSS. The link to your site isn’t working for me. Can you double check? August 27, 2020 at 1:27 pm #1420996 John Sorry about that. https://www.leylatorresstudio.com/ August 27, 2020 at 1:43 pm #1421012 LeoStaff Customer Support Any chance you can give a test username/password so I can login to see if there are any classes added to the logged in page? August 27, 2020 at 2:02 pm #1421033 John Do you need administrative access? August 27, 2020 at 2:05 pm #1421036 LeoStaff Customer Support Nope – just a login I can use on this page: https://www.leylatorresstudio.com/member-login/ August 27, 2020 at 2:34 pm #1421059 John REMOVED August 27, 2020 at 2:41 pm #1421069 LeoStaff Customer Support Thanks! Try this to change the logged in color: body.logged-in .site-header, body.logged-in .site-info { background-color: #000 } August 27, 2020 at 2:55 pm #1421079 John That took care of the Header, but not the footer. The background color for header navigation also has to be changed. August 27, 2020 at 3:55 pm #1421112 LeoStaff Customer Support Edited the CSS above: https://generatepress.com/forums/topic/different-header-and-footer-on-different-pages/#post-1421069 As for navigation colors, all the CSS is here: https://docs.generatepress.com/article/changing-navigation-colors/ You just need to add body.logged-in in front of it to target the logged in condition. For example, .main-navigation .main-nav ul li a, .main-navigation .menu-toggle { color: #FFFFFF; } becomes: body.logged-in .main-navigation .main-nav ul li a, body.logged-in .main-navigation .menu-toggle { color: #FFFFFF; } August 27, 2020 at 6:28 pm #1421199 John I’m not 100% sure this is right but the main nav had to edited to: body.logged-in .main-navigation, .main-navigation ul ul, body.logged-in .main-navigation .menu-toggle{ background-color: #DDDDDD; } And this took care of keeping the hover color the same #DDDDDD body.logged-in .main-navigation .main-nav ul li a { background-color: #DDDDDD; } August 27, 2020 at 6:35 pm #1421201 LeoStaff Customer Support Awesome ๐ August 27, 2020 at 6:56 pm #1421210 John You’re a good and patient teacher, Leo. Thank you. August 28, 2020 at 8:30 am #1422006 LeoStaff Customer Support No problem ๐ Author Posts Viewing 14 posts - 1 through 14 (of 14 total) You must be logged in to reply to this topic. Log In Username: Password: Keep me signed in Log In