Superfish Menu Setup

If you have downloaded one of our themes that supports Superfish menus you will need to follow this guide on how to set them up - its pretty strait forward, just take one step at a time and follow along closely.

Modules and Stuff

First step is to download and install all the required modules

Upload both these modules to your sites/all/modules folder and enable them on the Modules page of your site.

Next you need to download the actual Superfish JavaScript, you can get it here: http://dl.dropbox.com/u/22795799/superfish-library-for-drupal-v1.zip - unzip it and upload it to your sites/all/libraries folder. If this folder does not exist just create one inside the sites/all folder.

When you are done everything should look like this:

sites/all/modules/superfish (the Superfish module)
sites/all/modules/libraries (the Libraries module)
sites/all/libraries/superfish (the Superfish JavaScript)

Hooray! Now we are ready to configure some Superfish menus.

Basic Configuration

All Superfish menus use the block system - so goto your Blocks config page and scan down the list of disabled blocks. You will notice Superfish has created a bunch of blocks - the first one called "Superfish 1" is automatically setup to use the Main Menu. Click the configure link and set the style and region you want the menu to appear in.

If you are using Pixture Reloaded, Corolla 7.x2.x, Sky 7.x.2.x or one of our commercial themes you can place this block into the Menu Bar region and it will be automatically styled - just be sure to set the style setting to "None". All the commercial themes support most of the Superfish options such as direction (Horizontal, Vertical and Navbar), and you can place menus in sidebars and have them flyout.

# Things to look out for
I have noticed from time to time the auto-arrow options do not work perfectly, so I usually don't use them.

If your links are too long and wrap you can make the drop menu wider - go back to the block configuration and find the "Superfish Plugins" fieldset and inside that there is are options for "Supersubs" - adjust the minimum width from 12 to 15 or more, depending on the length of your menu items.

Any questions just fire a comment in here.

Comments

eastoncat's picture

Headliner submenu

I noticed on the AT Headliner that each menu would have its drop down - but also have a horizontal menu bar underneath based on the primary link. I'm not sure how to configure that part.

Steven L Procopio's picture

Blog Link Issues

When I'm adding menu options I set up a "My Blog" link and want to set that up on an individual user basis. When I do I'm unable to get the user id setup correctly in the menu. It defaults to %25 for some reason.

no name goofus's picture

Doesn't display anywhere

Followed all these directions, no superfish menu no matter what block or theme I placed it in.

D7.9
Block: Superfish 1 (Superfish) (tried Main menu and User menu)
Stuck it in: Sidebar first, Main content, Menu Bar, Header panel
Themes tried: Corolla 7.x-2.2, Bartik 7.9, AT Subtheme 7.x-2.1

Superfish 7.x-1.8
Libraries 7.x-1.0
Superfish (library) Version 1.1, 2011-09-04

There are a bizilion and one settings (which I didn't touch)...

Want to add some more info on how this should actually work?

Thanks

Piet van Ool's picture

No dropdown menu in Pixture Reloaded

I installed Superfish and Pixture Reloaded as described. Only main menu's are shown.
When I Switch to Garland I see the dropdown menu's. What do I have to do to make them available in PR. Please do not point to documentation or so. I searched and read whole evening but still could not get it to work.

Jenny Smith's picture

Thank you!

Just wanted to say that this worked perfectly for me in Drupal 7 (Corolla), after I figured out that I could set the menu that was displaying by using the "configure block" link (gear box icon) at the right hand side of the menu.

Thanks again for a great theme. I was a big fan of Genesis, and I love AT, too!

Superfish

I keep on trying to get superfish with pixture reloaded and nothing works t get a drop down menu. what is the solution?

Pixture Reloaded Solution

I try to follow the tutorial like that
sites/all/modules/superfish (the Superfish module)
sites/all/modules/libraries (the Libraries module)
sites/all/libraries/superfish (the Superfish JavaScript)

Horay that's work for me. Thank you

Add new comment