How/where do I change the colour of the darkgrey in the footer

hi!

  1. How do I remove the lightgrey area above the darkgrey footerarea (and what is the name for that? :))

  2. How/where do I change the colour of the darkgrey in the footer.

website url: www.wonderacademie.nl
and this is printscreen from the area i mean. lightgrey is barely visible, but it takes up space :slight_smile:

  1. can you direct me to a tutorial on what the names are for the different areas (header, footer, masthead etc. I am still a bit confused about the terms and where they go and where to find how to edit them)

Hi There,

Thanks for writing in! You can add the following CSS rules into your Theme Options > Global CSS area to set those colors.

.x-colophon.top {
    background-color: #f9f9f9;
}
.x-colophon.bottom {
    background-color: #2c3e50;
}

Hope that helps.

yes, that works wonderful. Now I can make it blue :), much nicer.
BUT: the space above the footer is still there, even though it is white now in stead of lightbeige. How do i remove that? The space, i mean. I checked the forum but the one thing i found and copied in css didnt work for me.

txs!

Hi There,

You can simply disable that area by head over to X -> Theme Options -> Footer -> Footer Widget Area section.

Thanks!

ah cool! that was easy.

next questions (or should i make a new topic next time?):

  1. where do i change the colour of the colour of the social icons?
    now they are in almost the same colour as the footer itself. i would like to give it a more contrasting colour.

  2. i would like to make three coloms in the footer, so i put a link to the privacystatement and more of those documents on the left of the social icons and on the right of the icons links to special pages and a link to subscribing to newsletter.

txs!

Hello @wonderacademie,

Thanks for updating the thread. :slight_smile:

  1. You can add following CSS under X > Theme Options > CSS to change social icon color:
.x-colophon.bottom a, .x-colophon.bottom .x-social-global a {
    color: #423131;
    background-color: #fff;
}

2.Best and probably most easiest option would be to activate Footer Widget area and let the column layout be three. Because making three column in footer will require changes in theme template files which falls outside the scope of support we can offer. After creating the 3 column layout, to display subscription box will require further customisation in code. I can tell you the file name and the path that you can take a look to make the necessary changes.

File name: wp-footer.php
Path: Under /wp-content/themes/x/framework/legacy/cranium/footers/views/renew/

Before making any core changes, please install and setup child theme. I am sharing relevant resources that you can use to download and install child theme.

https://theme.co/apex/child-themes

Thanks.

oepsie, that sounds a bit more complicated than i had hoped :).
I have installed a child theme last year as far as I am aware.
for now, i am just finishing up things that are a bit more easy and then i’ll come back to this topic.
thank you so much for your quick replies.

You’re very much welcome.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.