Superfish Questions & Answers
Q #1: How do I change the overall width of the Superfish Menubar template?
A: You have to edit the Superfish CSS file you are using. For instance if you are using ssf-green.css, open that file, locate the following rule and change the margin property as shown:
.ssf-green-wrap {
margin: 10px 0 0 0;
margin: 10px 10px 0 10px;
...
}
Then locate the following rule and change the margin property again:
.ssf-green-after {
...
margin: 0;
margin: 0 10px 0 10px;
...
}
Save your CSS file, ssf-green.css in this case, and reload your page to see the change in the menubar width.
Q #2: How do I change the width of the Superfish sub-menus?
A: You have to edit the Superfish CSS file you are using. For instance if you are using ssf-green.css, open that file, locate the following rule and change the width property as shown:
.ssf-green ul {
...
width: 10em; /* left offset of submenus need to match (see below) */
width: 15em; /* left offset of submenus need to match (see below) */
}
Then locate the following two rules and change the left property in both of them:
ul.ssf-green li li.wpm-hover ul {
left: 10em; /* match ul width */
left: 15em; /* match ul width */
...
}
ul.ssf-green li li li.wpm-hover ul {
left: 10em; /* match ul width */
left: 15em; /* match ul width */
...
}
Save your CSS file, ssf-green.css in this case, and reload your page to see the change in the sub-menus width.
hi,
i think i have the same question that igor had back on October 2.
i have the following code:
.sf-blue li.selected,
.sf-blue li.current-cat,
.sf-blue li.current-cat-parent,
.sf-blue li.current_page_item,
.sf-blue li.current_page_parent,
.sf-blue li.current_page_ancestor {
background: white;
color: black;
}
the background works fine; but i can’t gain any control over the font color. “color:black”, as it is above, doesn’t work.
any chance you can help me figure out the solution?
here’s a link to the site: http://dev.wearebinary.com/about/
thanks much!
How do i change the order of submenu?
Hello Eikoku,
I think you are interested in the page submenus or category submenus, since they are generated automatically. The pages can be reordered changing their menu order in the WordPress admin, while the categories are always alphabetically ordered.
@andrea
Thanks! can you use “order by slug”? I like to re-order the categories by slug.
@eikoku
Sure! Simply edit the function wpm_get_cats in wpm-db.php, replacing ‘ORDER BY t.name’ with ‘ORDER BY t.slug’.
This is great! Thank you!
I have the same question as Sergi.
It seems the color controlled by the main .css file for the site. How can that be overwritten for the menu without changing the content fonts?
was this an oversight in the main code? how can the function of changing fonts be moved to the in use sf-menu.css?
Thanks for the menu .. it’s helped me a lot!
if (!IsPostBack)
{
SooperFish spoorfishMenu = new SooperFish();
Literal1.Text = spoorfishMenu.ExecuteXSLTransformation();
}
where should i include this??????
@bhargav
Hi Bhargav,
I’m afraid you’re asking in the wrong place …
Hi
I have a question (yeah…again !). I ‘ve created sevral CSS class to organize my menubar.
At the end of the bar, I created 2 flags (english and spanish) using “backgroud: url(….)”. These “flags menu” also have sub-menus.
My probleme is: when you select the Spanish Flag (at the end of the bar) it shows the sub-menu, but when you drag your mouse on the right of the box, the hover is still active and you make the sub menu appear.
It seems like the box is too much wide, but I tried reducing the margin and the padding, but nothing works.
Can you tell me how to reduce the selection zone
THX
Tom
cannot find the superfish menu CSS .. am using wordpress w/ platform pro … any idea where it is .. have looked though requisite plugins, etc.
On a standard WordPress installation, the Superfish CSS is in the wp-content/plugins/menubar-templates/Superfish folder. I guess you can find it there as well.