WordPress.org

Forums

Fashionistas
[resolved] Arrows in the super fish menu (5 posts)

  1. ochyuo
    Member
    Posted 9 months ago #

    Hello,

    I'm trying to build a web site with Athemes Fashionistas theme. I can't see in my menu the arrows which indicates there are some sub-menu items.

    Could you help me please?

    the link to my web:
    http://santamaca.site88.net/

    Thank you!

  2. Ali-Usman
    Member
    Posted 8 months ago #

    Hello,
    I have looked at the website which you have mentioned for SUPER FISH MENU.It seems that the Fashionistas theme is having NO OPTION for the ARROWS in the SUPER FISH MENU.So here is what you need to do...Just copy the following code and paste it into your CSS.

    .sf-menu li.menu-item-has-children:after {
    display: block !important;
    content: '' !important;
    border: 3px solid transparent;
    border-top: 5px solid black;
    margin-left: -16px;
    margin-top: 22px !important;
    }

    Explanation:
    WP automatically adds CLASS to the li which has the dropdown (CHILD elements).So we can use this CLASS name (menu-item-has-children) to ADD ARROWS to the MENU elements which have dropdowns.

    Again: (I will recommend using custom CSS plugin if you want to ADD Custom CSS to your theme.Just use this PLUGIN:I like My Custom CSS)

    Let me know if you have any questions.Thanks

  3. ochyuo
    Member
    Posted 8 months ago #

    Thank you very much for your help and explanation :) Now I can see the arrows. I customize a little bit your code because the border was a little strange. Here my code:

    .sf-menu li.menu-item-has-children:after {
    display: block !important;
    content: '»' !important;
    border: 0px solid transparent;
    border-top: 0px solid black;
    
    float:right;
    margin-top: -27px !important;
    margin-right: 15px;
    }

    Anyway, now I would know if there is any way to get that the arrows of the main menu (first level items) will disappear.

    Thanks a lot.

  4. Ali-Usman
    Member
    Posted 8 months ago #

    Hi,

    If you want to display the ARROWS with the LI elements of the DROP DOWN, which have the CHILD items(sub menu).You can use this code to display the ARROWS with them.

    .sf-menu li:hover ul li.menu-item-has-children:after, .sf-menu li.sfHover ul li.menu-item-has-children:after {
    display: block !important;
    content: '»' !important;
    border: 0px solid transparent;
    border-top: 0px solid black;
    float: right;
    margin-top: -27px !important;
    margin-right: 15px;
    color: white;
    }

    Please let me know if you have any question.Thanks

  5. ochyuo
    Member
    Posted 8 months ago #

    Hi Ali-Usman,

    thank you very much for your help. The code that you give me doesn't work in my wordpress, anyway it gives me some clues…

    I resolve with this code:

    .sf-menu li li.menu-item-has-children:after {
    display: block !important;
    content: '»' !important;
    border: 0px solid transparent;
    border-top: 0px solid black;
    
    float:right;
    margin-top: -27px !important;
    margin-right: 15px;
    }

    So, like that, I have my arrows in the child elements of the menu and not in the parent.

    Thanks.

Reply

You must log in to post.

About this Theme

About this Topic