Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #383412

    Hi,
    I looking for above combination and could not find a solution.

    Finally the header area should be:
    1. small bar for secondary menu (above main bar): background glassy, so that the visiter can see the picture background from first following color section

    2. main menu bar: backround color whithe and a reduced height from current 70px? to 50px?
    reasons for a less height is my smaller logo. The standard height before shrinking looks to big!
    After scrolling, only the main menu bar should be shrinked and remaining white.

    Do you have a solution?

    Thanks really if you could help for that.

    Best regards

    http://mmt-maschinen.de/wordpress1/downloads

    #383682

    Hey leftm!

    Thank you for using Enfold.

    If you don’t mind, please provide a screenshot on how you want the header to look like. Remove the top bar with this on Quick CSS:

    div#header_meta {
    display: none;
    }

    Set the height of the header on Enfold > Header > Header Size. Set it to custom pixel value.

    Best regards,
    Ismael

    #383731

    Hello Ismael,
    thanks for your kind support.
    The header height I could reduce, best!

    But the top small bar should be there, With a glassy character. I tried:
    >>>> div#header_meta {BACKGROUND-COLOR: none;}
    Nothing changed to glassy, it seems to be wrong my idea. Do you have a trick for that?

    mmt-maschinen.de/wordpress1/wp-content/uploads/2015/01/glassy-small-bar-header.jpg

    The attached link shows the area, above the red line which should be glassy and the first following picture from the color section should be seen…
    here the black/white backround.

    Best regards
    Jens

    #384317

    Hi!

    Actually, the top header is already transparent but the page is not set to transparent header. Edit the page then look for Layout > Header visibility and transparency. Set it to Transparent or Glassy Header. You can use this on Quick CSS:

    .header_color .header_bg {
    background: rgba(255,255,255,.2);
    }

    Cheers!
    Ismael

    #384327

    Hi,
    :) thanks, but that is not really what I would like.

    The main bar for the main menu should be allways white.
    The small bar for the secondary menu should be allways glassy.

    Regards Jens

    Ismael, i send you my quick css codes for your information:
    ———————————————————————————————————-
    /*GLASSY small Header*/
    div#header_meta {
    background-color: transparent!important;
    }
    .header_color .header_bg {
    background: rgba(255,255,255,.2);
    }
    ———————————————————————–
    I edit on page the trancerancy mode.

    How ist the main bar for the main menu to set allways White?

    Regards

    • This reply was modified 9 years, 9 months ago by leftm.
    #385535

    Hi Kriesi Team,

    can anyone help for this “problem” please?

    The main bar for the main menu should be allways white.
    The above small bar for the secondary menu should be allways glassy.

    Regards

    #385764

    Hi Kriesi Team,

    Last days I tried to find a solution without succes. It seems that it is not possible with the current version of Enfold.

    Today the backround color for the header includes the area of main bar and small bar above. Therefore it is not possible to put
    >the main bar White
    >and the small bar glassy.
    The adjustment at advanced styling for the small bar doesn’t help, it overwrites only the primary color, so there will be allways a color, never glassy!

    Is there a chance to have the next update with a separete defined background color only for the header main bar?

    Regards

    #386021

    Hey!

    Sorry for the delay. We asked for a screenshot but you didn’t provide any. The links are not working. It’s useless to set the transparency of the top header if you don’t enable the Transparent Header option for the page because the background of the html wrapper is also white. Please provide a mock up or layout of the header.

    Best regards,
    Ismael

    #386511

    Hi Ismael,
    excuse me, that is the right link:

    http://mmt-maschinen.de/wordpress/glassy-small-bar/
    with 2 pictures:
    1. main and small bar: glassy
    2. main and small bar: White

    I set the page to “Transparent Header”.
    Then I tried to set only the main bar to White, allways White,
    White before shrinking and also after shrinking.

    And the small bar should allways glassy, glassy before shrinkig the main bar and also after shrinking the main bar.

    Could you arrange that?

    Ciao

    #387549

    Hey!

    Try adding this code to the Quick CSS:

    #top #header_main {
        background: white;
    }
    
    #top .header_bg, #top #header_meta{
        background: rgba(255,255,255,0.2) !important; 
    }

    Cheers! 
    Josue

    #387640

    Hi Josue,

    that is exactly what it should be! And so easy. :) I spend so much time….

    Thanks for help indeed.

    Best regards.

    #387645

    You are welcome, glad to help :)

    Regards,
    Josue

Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘header: glassy small bar combined with no trancparency main bar + height’ is closed to new replies.