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


    No matter what plugin I try to use in the sidebar to create a vertical dropdown menu, the abundance theme styling overrides it. Either the dropdown won’t funtion properly, part of the menu gets cut off, or I can’t tell it what colors or font etc to use. I’ve tried about 8 different plugins now…jquery, flash, CSS only and nothing is working right with this theme. Disabling all plugins didn’t help and when I test them on Twenty Eleven and other themes, they all worked fine.

    What code causes Abundance to take over styling of sidebar that makes other plugins not work? Can it be fixed to not override and how? Would greatly appreciate help with this. Been trying different things for a few weeks now.

    P.S. Here is the dropdown menu I’m currently trying to use with this theme if you want to test it as a vertical menu in the sidebar.




    Can you post a link to your site(that has those plugins in the sidebar)? so we can inspect further.




    Here is the site link, please remove after testing please

    Right now I’m using this and have it set to a blue gradient theme. Whatever theme style I pick doesn’t work and as you can see, the menu is getting cut off in certain places and not displaying correctly.

    Another plugin I wanted to use was jQuery Vertical Accordion Menu. That menu styles ok but won’t expand or collapse.


    Any ideas?



    Try to locate the stylesheet/stylesheets/css use on each plugin. Open the file then copy everything on your custom.css. Custom.css will override any stylesheets that theme have.

    You need to be careful because this may break the layout of the theme.




    I did exactly what you recommended but it still does not work. the plugin i am using is jquery accordion menu. please advise.


    Hi aliciachong,

    I tried to check your site but it keeps on redirecting me to this page:




    I checked my websites on 2 different computer with different IP addresses in separate locations – it did not re-direct me to another page. Can you try again?


    Hi aliciachong,

    I can check it now. Kindly replace the plugin css code that you added in custom.css and replace it with this code:

    .dcjq-accordion{font: bold 14px Arial, sans-serif; border-top: 1px solid #ccc; border-right: 1px solid #ccc; border-left: 1px solid #ccc;}
    .dcjq-accordion ul, .dcjq-accordion ul li {margin: 0; padding: 0; border: none; list-style: none;}
    .dcjq-accordion ul a {padding: 10px 10px 10px 50px; background: #ececec; text-decoration:none; display: block; color: #333; border-bottom: 1px solid #ccc; border-top: 1px solid #fff; position: relative; text-shadow: 1px 1px 1px #fff;}
    .dcjq-accordion ul a.dcjq-parent, .dcjq-accordion ul a.dcjq-parent:hover {background: #D7D4D4 url('') repeat-x 0 -1px;}
    .dcjq-accordion ul a .dcjq-icon {position: absolute; top: 50%; left: 14px; width: 34px; margin-top: -17px; height: 34px; background: url('') no-repeat 0 center;}
    .dcjq-accordion ul .dcjq-icon {background: url('') no-repeat 0 center;}
    .dcjq-accordion ul a:hover {background: #fff; color: #990000;}




    Hi Ismael,

    I copied and pasted the codes but nothing happen again.


    Hi aliciachong,

    It looks like the mega menu code is taking over whatever the plugin attempts to output. I’ll tag the topic for the head of support as I’m not sure what the best way (or if possible) to prevent that from happening.




    Thanks looking forward to it – for the meantime, would disabling the mega menu help?


    Afaik you can easily remove the mega menu class from the sidebar menu. Afterwards the mega menu js and css code won’t affect the menu widget anymore. Open up abundance/js/avia.js and replace following code (at the very top):



    jQuery('.sidebar .widget .dcjq-accordion .avia_mega').removeClass('avia_mega');

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

The topic ‘Sidebar Menu – issues with plugins and Abundance overiding styling’ is closed to new replies.