Superfish extension in 3.0

I installed contao 3.0 and began working up a web site. I was happy to see that jquery can now be easily included, and that the superfish drop down menu system was now available as an extension. But superfish wasn't even close to working right out of the box and it took me a few hours of troubleshooting to get it running. Here's what I had to do:

#1 - The superfish javascipt is neither loaded nor initialized, so you have to do both those things by placing the following code in the Custom JavaScript code box of your layout:

Code:

<script src="/system/modules/superfish/assets/js/superfish.js"></script> <script> $(document).ready(function(){ $("ul.sf-menu").superfish(); }); </script>

#2 - I used superfish in the regular horizontal mode with drop down sub menus. With the stock style sheets that come with the extension there isn't enough height to allow the drop downs to appear on screen. So it's necessary to increase the height of the nav.mod_navigation block, then re-position the article block beneath it so that the content isn't pushed way down on the page. I used this css code in my style sheet:

Code:

nav.mod_navigation { height:300px; } div.mod_article { bottom:250px; position:relative; }

Hopefully this will save others a few hours of their time. I think that a horizontal drop down menu system that is extemely user friendly is a glaring omission in the contao cms and is a deal breaker for many newbie developers. Hopefully this will be strengthened up in the next version of Contao and become an asset and not a deficit.