Tagged: 

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #218928

    Hi there,

    I recently bought the theme and I must say this has to be one of the best themes!

    I have created an entirely static menu style that I like and would like to use it now within the theme, example of what I have done is here: http://www.steroidim.com.

    I would like to integrate this into the theme so I have more control over style, hovering image change, full colour drop downs, etc. but I am confused as to should I edit the theme files?

    #219007

    Hey erhabi!

    Unfortunately there is no way we could walk you through adding that in so you would be able to use the WordPress menus manager to edit everything. It would need to be done by a freelance developer which you can find from somewhere like Microlancer or Codeable.

    You could instead re-style the theme menu and mega menu output using your browsers dev tools, inspecting the elements and then adding the custom css to the css>custom.css file of the theme.

    Cheers!
    Devin

    #224559

    That’s alright, Devin. I understand. I am, however, now restyling the mega menu using a child theme to create a somewhat closer effect of what has been displayed in my example.

    I have run into a problem though, the height of the logo seems to influnce the .avia_menu height, and no matter what you do, the whole layout breaks. I have tried a lot of workarounds to this, but it seems there are too many interlinking css references that makes it hard, haha!

    Anyway, my code now is:

    .social_header #header_main .container, .social_header .main_menu ul:first-child > li a {
        height: 70px;
        line-height: 90px;
    }
    
    <strong>using this to restrict the height of the main menu and make the sub menus appear as closer to the main as possible.</strong>
    
    #avia-menu a: {
    margin-top: 10px;
    height: 30px !important;
    }
    
    <strong>re-trying here to set the height but the logo height in the header keeps interfering</strong>
    
    #avia-menu a:hover {
    background-color: #ffffff !important;
    color: #70b115 !important;
    }

    any possible help to this would be highly appreciated!

    here’s my enfold work in progress so far: http://steroidim.com/wpdemo/

    #224766

    Hi!

    You can add this on Quick CSS or custom.css to fix the logo:

    .logo, .logo img {
    max-width: 236px !important;
    width: 236px !important;
    height: 99px;
    }

    Regards,
    Ismael

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Custom (Totally Custom!) Menus’ is closed to new replies.