Home Forums WoodMart support forum Sticky header and menus

Sticky header and menus

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #199435

    yurbui
    Participant

    Hello
    I have a couple of questions about editing my site on Woodmart.
    1) How can I make this menu with categories sticky when the page is being scrolled?
    https://imgur.com/a/2pVSGfC
    2) How can I make the “Категории” (categories) sign smaller to make it look equal to the green menu
    3) How can I make the search form narrower
    https://imgur.com/a/CV5UrEH
    4) How can I make the the child menus were on the same line as the parent (I mean, everything looks smooth)
    https://imgur.com/a/w3ltKRz
    5) How can I make the text from child menu were the same format as parents (I mean, with out capital letters)
    6) How can I make it, when you hover over a child menu item, the background on it becomes white
    (something like this)
    https://imgur.com/a/JDzwiR8
    7) How can I make it, when you hover over the parent menu item, the line background becomes more gray and the letters green.

    #199484

    Hello,

    Thank you very much for choosing our theme and for contacting us.

    1. You need to disable clone header https://xtemos.com/docs/woodmart/header-builder/global-header-settings then make the green row sticky https://xtemos.com/docs/woodmart/header-builder/header-rows-columns-configuration/

    2. The category menu cannot be narrower as it would break the rest markup.

    3. You need to add spaces https://xtemos.com/docs/woodmart/header-builder/add-space-elements/
    Best Regards

    4. You can find how to make the mega menu blocks here: https://xtemos.com/docs/woodmart/create-menu-2/

    5.You can change the font by means of Advanced typography option, which allows to choose the item from a drop-down or insert your custom CSS class. Please navigate to the Theme Settings > Typography > Advanced Typography.

    Here is the documentation providing more detailed instructions: https://xtemos.com/docs/woodmart/advanced-typography-settings/

    6. Please provide page URL with the menu, the screen is not clear enough.

    7. Please add this code to the Theme Settings > Custom CSS > Global:

    body .whb-color-dark .navigation-style-default .item-level-0>a:hover{
        color: red;
    }

    Set the color as per your needs.

    Best Regards

    #199604

    yurbui
    Participant

    When I was talking about the 4) How can I make the the child menus were on the same line as the parent (I mean, everything looks smooth)
    https://imgur.com/a/w3ltKRz

    I was talking about this solution: https://imgur.com/a/x1jozs3
    How can I make it?

    #199664

    Hello,

    Please arrange your Category menu as a menu item – sub-menu items and check. You need to remove maga menu blocks.

    Best Regards

    #199761

    yurbui
    Participant

    Can you write a guide for me? Cause I cannot understand what you want to say

    #199788

    Hello,

    Please check the screen what I mean: https://gyazo.com/c8af381c5387dda3ec525cf16f40dbf1

    This is the default WordPress menu. You need to remove mega menu blocks and create menu in this way.

    Best Regards

    #199811

    yurbui
    Participant

    I’ve already done that.

    #199915

    Hello,

    Have you solved the problem?

    Best Regards

    #200225

    yurbui
    Participant

    Hello, I am telling you that, that was already done like you said. Check it https://imgur.com/a/enKFHSw

    I need to do it like this: https://imgur.com/a/x1jozs3
    May be I can do it with CSS?

    #200233

    yurbui
    Participant

    Also, I need to make this without equal to the main line. Without it going over the edge.
    https://imgur.com/a/2dUVESM

    #200287

    Hello,

    Some of the menu items are broken into two-line as they are very long. I can provide custom CSS to make ALMOST but not EXACTLY

    body .woodmart-navigation .menu-mega-dropdown .sub-menu-dropdown .sub-menu > li > a{
       font-weight: 600;
        font-size: 14px;
        line-height: 14px;
    	padding:13px 18px;
    }
    body .menu-mega-dropdown .sub-menu>li {
        margin-bottom: 0px;
        padding-right:0px;
        padding-left: 25px;
    }
    body .menu-item-design-sized .sub-menu-dropdown {
        padding-top: 0;
        padding-right: 0;
        padding-left: 0;
    }

    Best Regards

    #200585

    yurbui
    Participant

    I need it to be exactly like on the photo

    #200661

    Hello,

    You can reach the exact result. You can take the code I have provided and try different values until you reach the exact result.

    As I told you it hardly ever can be done cause the left column has one line, and the right column has two lines heights are not equal.

    Best Regards

Tagged: 

Viewing 13 posts - 1 through 13 (of 13 total)