WordPress.org

Support

Support » Themes and Templates » Questions about icons menu and submenus

Questions about icons menu and submenus

  • Hi there,

    First I have to say that the virtue theme is well designed, well planned and well built.

    I need help with a few issues customizing it, you provide great support and I would really appreciate the help:
    1. How to set static height for icons-menu items?
    2. How to change font sizes and types for headline in icon item, and for the description? How to change the spacing between lines and headings (headline and description as well)?
    3. How to center 1st level sub menus under main menu items?
    4. How to change sub menus levels to open to the left instead of right?

    Thank you:)

Viewing 15 replies - 1 through 15 (of 20 total)
  • Theme Author Kadence Themes

    @britner

    1. You can set a height with css, something like :

    .home-iconmenu a {
    height: 160px;
    }

    2. a. Font size for title is h4 tag but you can edit specifically with:

    .home-iconmenu h4 {
    font-size:18px;
    }

    for description:

    .home-iconmenu p {
    font-size:12px;
    }

    b. .home-iconmenu h4 {padding-bottom:20px;}

    3.

    .sf-menu > ul li {
    text-align: center;
    }

    4.

    .sf-menu li:hover ul, .sf-menu li.sfHover ul, .sf-menu ul  {
    right:0;
    left:auto;
    }

    Kadence Themes

    I started with 3 and 4 and it doesn’t seem to have any effect.

    BTW I meant that I want the submenu containers to be centered under the main menu links.
    This is the code I currently have in the advanced custom css box:

    .sf-menu > ul li {
    text-align: center;
    }
    .sf-menu li:hover ul, .sf-menu li.sfHover ul, .sf-menu ul  {
    right:0;
    left:auto;
    }
    .sf-menu ul li a {
    font-size: 1.5em !important;
    color: #006EAE !important;
    text-align: right !important;
    }
    .sf-menu ul li a:hover {
        color: #FD8204 !important;
        }    
    
    .home-iconmenu a {
    background: #006EAE;
    }
    
    .captiontitle, .captiontext {
    background: #006EAE;
    }
    
    .flex-caption {
    color: #ffffff;
    }
    
    //.captiontitle, .captiontext {
    background: transparent;
    font-weight: 400;
    text-shadow: none;
    }opacity: 0.8;
    
    //.sf-menu {
        float: right;
    }
    
    //.sf-menu li {
        float: left;
    }

    Thank you:)

    Theme Author Kadence Themes

    @britner

    Well start with removeing all of this:

    //.captiontitle, .captiontext {
    background: transparent;
    font-weight: 400;
    text-shadow: none;
    }opacity: 0.8;

    //.sf-menu {
    float: right;
    }

    //.sf-menu li {
    float: left;
    }

    That will cause problems which will make the rest of your css not work.

    Kadence Themes

    Theme Author Kadence Themes

    @britner

    The submenu can’t really be centered because it’s a responsive theme, you can add this:

    .sf-menu li:hover ul, .sf-menu li.sfHover ul, .sf-menu ul {
    right: -50%;
    left: auto;
    }

    But it’s not going to be perfect since it’s getting is position based on the right side of the menu item. You can adjust more with margins but you would then need to add media
    queries for smaller screens.

    Kadence themes

    I understand.

    How can I make the submenu levels open to the right instead of the left?

    Sorry, I meant open to the left instead of to the right.

    Theme Author Kadence Themes

    @britner

    ul.sf-menu li li:hover ul,
    ul.sf-menu li li.sfHover ul {
    right: 100%;
    top:0;
    left:auto;
    }

    Kadence Themes

    You are amazing!:)

    The first submenu level does open to the left, but the next level opens to the right again.

    How do I make all submenu levels open to the left?

    Theme Author Kadence Themes

    @britner

    Add this:

    ul.sf-menu li li li:hover ul,
    ul.sf-menu li li li.sfHover ul {
    right: 100%;
    top:0;
    left:auto;
    }

    Outstanding:)

    If I understand correctly I would just have to add another ‘li’ for any extra subcategory level.

    I also wanted to ask about the icons menu, how to centralize it under the slider? it seems too far left right now.

    Thank you

    Theme Author Kadence Themes

    @britner

    Can you post a link?

    Kadence Themes

    I am currently developing on my local machine so I took a screenshot:

    [IMG]http://i61.tinypic.com/2he8pqq.png[/IMG]

    I also wanted to ask about content pages, how to make their headline (&sub-headline)and content’s text all alligned to the right?

    I need those modifications since the site is in Hebrew (a right to left language).

    Thank you for all your great assistance:)

    Theme Author Kadence Themes

    @britner

    It looks like you set your icons to have four columns.. use three columns for three items.
    You would need to add css to set up a rtl site. Use the inspect tool in chrome or firefox to find your classes and add “text-align:right” to each class in your custom css box.

    Kadence Themes

    I do have 3 columns selected… its still not center aligned.

    Regarding the classes, for example in a simple text page I need to alight to the right the h1 class, and the p class=subtitle.
    How can I do that?

    The text itself is aligned to the right but its stuck to the left leaving a wide space empty to the right. Also the period at the end of the sentences appears at the start of the lines instead of left.

    Thank you.

Viewing 15 replies - 1 through 15 (of 20 total)
  • The topic ‘Questions about icons menu and submenus’ is closed to new replies.