Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • November 11, 2014 at 3:35 pm #349400
    kathrynmichaud

    Hi – could you help me out with a couple of display issues please?

    1) The header of the website – I’ve been hunting for the header background colour but can only find the logo background colour? So the colour behind the menu links hasn’t changed.

    2) Also, expanding the logo height seems to have made the drop-down menus go a long way down so that they start at the top of the slider – is that normal?

    3) Finally could you help me with some custom css to centre the top bar text please?

    Thank you!

    Kathryn

    November 11, 2014 at 11:32 pm #349741
    Elliott

    Hey kathrynmichaud!

    1. Try navigating to Dashboard > Enfold > Advanced Styling and create a new style for the main menu links and set their background to transparent or the color of your header.

    2. Yes since your using a full width slider it will butt up against the header.

    3. Try this out.

    #header_meta .phone-info {
    text-align: center !important;
    width: 100% !important;
}

    Cheers!
    Elliott

    • This reply was modified 10 years ago by Elliott.
    November 12, 2014 at 12:13 pm #349972
    kathrynmichaud

    All perfect – thanks! Could you let me know one more thing? How can I change the image that is shown when somebody hovers over an image that is connected to a lightbox? I think it’s a curled arrow at the moment.

    Thanks.

    Kathryn

    November 12, 2014 at 4:26 pm #350061
    kathrynmichaud

    Hi, I also have a website build here: http://www.littlefoxwebdesignbuilds.co.uk/steedmedia – I’d like to re-create a similar layout for the header as you can see on this website: http://www.katapult.co.uk/ – could you tell me how I could move the menu links further along towards the logo and then add a phone number/email next to the social icons on the right-hand side?

    Thanks!

    Kathryn

    November 12, 2014 at 4:27 pm #350063
    Yigit

    Hi!

    Please see – http://kriesi.at/documentation/enfold/change-icon-used-for-standard-theme-elements/
    if you would like to use a custom image, please add following code to Quick CSS in Enfold theme options under General Styling tab

    .image-overlay .image-overlay-inside:before {
content: url(https://kriesi.at/wp-content/themes/kriesi/images/logo.png); 
}

    Regards,
    Yigit

    November 12, 2014 at 4:54 pm #350101
    kathrynmichaud

    Hi – that’s great thank you – could you also help me out with the other query above regarding re-creating a similar layout to that seen on the Katapult website header?

    Thanks!

    Kathryn

    November 12, 2014 at 4:56 pm #350105
    Yigit

    Hey!

    Please go to Enfold theme options > Header > Extra Elements and add phone number and choose to display it on the right side and then let us know

    Cheers!
    Yigit

    November 12, 2014 at 5:12 pm #350125
    kathrynmichaud

    Hi – yes I’ve done that now – that’s added the phone in to the top bar – if possible I’d like to display it actually in the header area. So as at http://www.katapult.co.uk, have the logo to the left, the main menu links just along from the logo and then the phone number and social links across to the right, all within the header area.

    Thanks!

    Kathryn

    November 12, 2014 at 5:20 pm #350131
    Yigit

    Hey!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab and adjust values as needed

    .avia-menu.av-main-nav-wrap.av_menu_icon_beside { position: relative; left: -25%; }
.phone-info { position: relative; top: 59px; font-size: 20px; right: 96px; }
.header-scrolled .phone-info { top: 40px; }

    Regards,
    Yigit

    November 12, 2014 at 5:28 pm #350136
    kathrynmichaud

    Hi – that’s absolutely superb! Thanks so much – any chance I could add css to change the colour of the telephone number?

    Kathryn

    November 12, 2014 at 5:32 pm #350142
    Yigit

    Hey!

    Please add following code to Quick CSS as well

    .phone-info span {
color: white;
}

    Regards,
    Yigit

    November 12, 2014 at 5:39 pm #350148
    kathrynmichaud

    Hi – that’s perfect! Thanks again for all your speedy help.

    Kathryn

    November 12, 2014 at 5:49 pm #350158
    Yigit

    Hi!

    You are welcome Kathryn, we are always glad to help :)

    Best regards,
    Yigit

  • Author
    Posts
Viewing 13 posts - 1 through 13 (of 13 total)
  • The topic ‘Header Background Colour’ is closed to new replies.