Docs

[mariogarcia1]

Hi Support,

I have a small issue with header and footer colouring on a new site i am creating https://www.pttc-e-learning.co.uk/. I cant seem to alter the social icons colour in the footer, nor can i change the header colour to a suitable colour to be able to show the mobile menu button suitably. I would ideally like the to be white and the icons & mobile menu button in the blue rgb(0, 168, 219) that i have been using if i can.

The demo content / template i used to create this is the agency, and the header and footer colour seem to be a bit different to the church demo that i normally use.

Also can you tell me how i can get the social icons to show above the Footer Content Code that i add in the footer section of customize?

I would like to find out how i add a sign up box and an image to content dock, and also can you advise me what is the best way on your opinion to add cookie warning display box to an xtheme site is there a widget i can use? As i dont what to install any plugin that could disagree with the theme.

Thank you in advance for your help.

Kind Regards

Mario

[Nico]

Hi There,

Thanks for writing in.

Would you mind sharing us a screenshot of which part you want to change colors or changes so we could easily identify and locate the customization.

Thank you so much.

[mariogarcia1]

Hi Support,

Thanks for getting back to me.

I have attached 3 screen shots of the areas inc mobile view where i would like to change colours, hope this helps.

Also out of interest, can i ask does cornerstone sometime have issues with saving. As on 3 sites i have had the very same issues, some times it takes ages to save, and sometime it doesnt save at all. Any ideas or advice would be really helpful.

Many thanks

Mario

[Paul R]

Hi,

You can add this under Custom > Edit Global CSS in the Customizer.

@media (max-width: 979px) {
    /* mobile button color */
    body .x-btn-navbar {
         color:red !important;
    }

    /* footer social icons color */
    .x-colophon.bottom .x-social-global a {
         color: red;
    }

    /* logo area background color */
    body .x-logobar {
         background-color: hsl(101,64%,57%);
    }

    /* navbar background color */
    body .x-navbar {
         background-color: hsl(101,64%,57%);
    }

    /* footer background color */
    body .x-colophon.bottom {
         background-color: rgb(0,168,219);
    }

   /* reposition footer content */
    .x-colophon.bottom .x-colophon-content {
       width: 88%;
       position: absolute;
       bottom: 0;    
       text-align: center;
       display: block;
    }
}

Please change the colors to achieve your desired result.

Hope that helps

[mariogarcia1]

Hi Support,

Thanks for that, but some of it doesnt seem to work.

This in particular:

/* logo area background color */
body .x-logobar {
background-color: hsl(101,64%,57%);
}

/* navbar background color */
body .x-navbar {
background-color: hsl(101,64%,57%);
}

Can you take a look please?

Also what do i need to do to change the footer text colour as this his now white other than the icons, so what do i need to do to change the font colour.

Many thanks once again.

Kind Regards

Mario

[mariogarcia1]

Hi Support,

Also just noticed it hasnt changed the colour in pc view, although it has in mobile view.

I have cleared the cookies, and cached pages but still it has made no difference.

Kind Regards

Mario

[Joao]

Hi Mario,

Please try using this code instead of the code above provided. It is the same code, but it is not wraped in a media query so now it should affect all devices.

Let us know how it goes.

Thanks,

Joao

    /* mobile button color */
    body .x-btn-navbar {
         color:red !important;
    }

    /* footer social icons color */
    .x-colophon.bottom .x-social-global a {
         color: red;
    }

    /* logo area background color */
    body .x-logobar {
         background-color: hsl(101,64%,57%);
    }

    /* navbar background color */
    body .x-navbar {
         background-color: hsl(101,64%,57%);
    }

    /* footer background color */
    body .x-colophon.bottom {
         background-color: rgb(0,168,219);
    }

   /* reposition footer content */
    .x-colophon.bottom .x-colophon-content {
       width: 88%;
       position: absolute;
       bottom: 0;    
       text-align: center;
       display: block;
    }

[mariogarcia1]

Hi Joao,

Thanks for that, but i still cant see the text in the footer. Is this code driven or a setting in the appearance section as i cant find it.

Thanks again for your assistance.

Kind Regards

Mario

[Joao]

Hi Mario,

The code above provide should be used to replace the code provided by Paul at your Appereance / Customizer / Custom / CSS

Try adding this code:

.x-colophon.bottom .x-nav li a {

color: red !important;

}

.x-colophon.bottom .x-colophon-content {

color: red !important;

}

.x-colophon.bottom .x-colophon-content a {

color: red !important;

}

Switch red for the desired color you can use also colors like #ffffff

In case you are still experiencing difficulties, would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Hope that helps,

Joao

[mariogarcia1]

Hi Joao,

Spot on. The only thing that doesnt seem to have worked is the centring of the bottom line of text on a pc. I will check the code that is in there later, but for now thanks ever so much for your help.

Kind Regards

Mario

[Joao]

Hi Mario

Please add the following code:

@media (max-width: 979px) {

.x-colophon.bottom .x-colophon-content {

width: 88%;

} }

And on the code that you have already placed on your customizer:

/* reposition footer content */
    .x-colophon.bottom .x-colophon-content {
       width: 88%;
       position: absolute;
       bottom: 0;    
       text-align: center;
       display: block;
    }

change the value from 88% to 75%

Hope that helps,

Joao

[Author]

Posts