Edin Theme – CSS Menu Color Customization

  • Unknown's avatar
    carlthought · Member ·

    Hi,

    I need help in color customizations.

    1. I need help in changing the menu background color from the blue to #fce5e5, how can I do it?
    2. Why does home and style menu buttons have background, I want to change them to default #fff background.
    3. I accidentally changed the footer menu buttons color to #fce5e5 but I can’t see anything to change them back to black.
    4. How can I align the footer button to the right?

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    cookgardensew · Member ·

    Hi @carlthought.

    Your site, carlthought.com, appears to be self-hosted at a hosting provider other than WordPress.com.

    This particular forum focuses on helping with sites that are hosted directly at WordPress.com. For help with a self-hosted WordPress site please visit the WordPress.org forums:

    https://wordpress.org/support/

    Or the support forum specific to your theme, Edin:
    https://wordpress.org/support/theme/edin

    That said, to set you off in the right direction:

    The blue color behind your menu is currently set here: 

    @media screen and (min-width: 1020px)
.navigation-classic .primary-navigation ul ul li {
    padding: 12px 24px 0 24px;
    width: 260px;
    background: #1279be;
    text-transform: none;

    and the border below the last sub-menu items here:

    @media screen and (min-width: 1020px)
.navigation-classic .primary-navigation ul ul li:last-of-type {
    border-bottom: 12px solid #1279be;
}

    The blue color behind the navigation when your site is displayed below 1020px is set here:

    .navigation-wrapper {
     background: #1279be;
}

    The background color of the home and style buttons is currently set here. Make sure to change the color attribute (the font color) to something other than white so that it can be seen if you set the background color back to white.

    @media screen and (min-width: 1020px)
.navigation-classic .primary-navigation .menu-primary > ul > li.current-menu-item > a, .navigation-classic .primary-navigation .menu-primary > ul > li.current_page_item > a {
    background: #fce5e5;
    color: #fff;
    font-style: normal;
}

    As for the footer alignment you will want to play with the display property of .footer-navigation.

    Hope that gets you set off in the right direction. Again, if you need further help the Edin theme forum linked above would be a great place to start.

    Have a great day!

  • The topic ‘Edin Theme – CSS Menu Color Customization’ is closed to new replies.