Navigation
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • #1374490

    VolunteerinCambodia
    Participant

    Hello Support,

    http://www.volunteerincambodia.org
    Wordpress 4.7.2
    X Version: 4.6.4
    Cornerstone : 1.3.3

    I am taking over from a previous member concerning the website management, so I am trying to find ways to personalize it thanks to X and cornerstone.

    I’m actually having some difficulties with those:

    1. I’m trying to change the header and/or navigation bar background with an easy way (without the CSS if it does exist) I think I can use the CSS copy paste solution I found but it didn’t work. That was that one :
    2. .x-navbar { background-color: #202020; }
      .site { background-color: #202020; }
      .x-topbar { background-color: #202020; }

    3. I would like to be able to personalize easily through cornerstone or X the design of the navigation bar, but for example I was not able to modify the header background’s color through X customization
    4. I couldn’t find the reset button, which was supposed to be in Available Tools from what I read.

    Thank you by advance for your support

    #1374725

    Rue Nel
    Moderator

    Hello There,

    Thanks for writing in!

    #1] The code should have work. Regretfully there is another custom css that is changing the background color. Please replace the code in the customizer and make use of this code instead:

    .x-navbar-inner {
        background-color: #202020;
        border-bottom: 1px solid #202020;
    }

    #2] That is because of the custom css. Please check out the customizer and make the most of it change the settings for the header. Simply go to Appearance > Customize > Header. For more details, please check this out: https://community.theme.co/kb/customizer-introduction/, https://community.theme.co/kb/customizer-icon/, https://community.theme.co/kb/customizer-header/

    #3] Which part you are trying to reset?

    Hope this helps. Kindly let us know.

    #1379203

    VolunteerinCambodia
    Participant

    Thank you so much for your fast answer.

    #1) So for the customizer I followed the path : appearance>customize>custom>custom CSS. Was that the right path ? As I checked inside there are few CSS personalized code in it:

    (beginning of custom CSS)
    .x-navbar-inner {
    background-color: #202020;
    border-bottom: 1px solid #202020;
    }
    […]
    .h-feature-headline i {
    color:#00A7E7;
    }
    (end of custom CSS)

    You asked me to copy the code over the CSS customed, did you mean over the whole customed code or only the “x-navbar-inner” part ?

    #2) If I understood it well, once I resolve the problem #1 the #2 should not be a problem anymore, is that right ?

    #3)I wanted to reset personalized modifications that were blocking me from modifying the many background colors, the website menu or other elements. But I guess if the problem #1 is resolved and does not block me anymore then I won’t need to reset.

    #1379395

    Christopher
    Moderator

    Hi there,

    CSS should be added under Customize/Custom/Global CSS.

    To change navbar background color, add this code :

    .x-navbar{
    background-color: #202020;
    border-bottom: 1px solid #202020;
    }

    Hope it helps.

    #1379438

    VolunteerinCambodia
    Participant

    Hello Christopher,

    No the code you gave me does not work. Your colleague Rue Nel said that because of my custom CSS I was not able to change the header’s background.

    So my question is – he asked me to add the following code:
    .x-navbar-inner {
    background-color: #202020;
    border-bottom: 1px solid #202020;
    }

    But as it was not clear it his message, do I have to replace all the custom CSS ? I tried replacing only x-navbar-inner part but it did not work, I just want to be sure that deleting all of my custom CSS won’t cause any problem to my website.

    Thanks a lot for your help !

    #1379582

    Paul R
    Moderator

    Hi,

    You only need to replace the code that reads (not all codes in custom css)

    
    .x-navbar-inner {
       background-color: #202020;
       border-bottom: 1px solid #202020;
    }
    

    with this

    
    .x-navbar{
       background-color: #202020;
       border-bottom: 1px solid #202020;
    }
    

    Thanks

    #1380936

    VolunteerinCambodia
    Participant

    It does not work !

    Actually I noticed the main problem : only my home page has a “locked color” for the header. The personalized CSS only work on all the other pages except the home page. So I would like it to be editable like any other page after adding CSS code.

    #1381069

    VolunteerinCambodia
    Participant

    Ok in the end, I just tested with making a entirely new home page and the problem disappeared. As we have to update and re-do the website I will entirely change the new home page so any code will actually impact it.

    Thank you very much for your support.

    #1381116

    Paul R
    Moderator

    You’re welcome! 🙂