Menubar › Move Menu Bar to Top of Page
-
Post
-
Hi Andrea,
Great plugin. Very easy to use.
One question though. How can I move the menu bar to the top of the page.
At the moment it is displayed just below the header, at the top of the body.
I really need it above the header or at least at the top of it.Thanks for your help.
TonyHi Tony,
The placement of the menubar depends on the placement of the line:
<?php do_action('wp_menubar','Your menu name'); ?>inside your theme, typically inside your header.php file.
You can move that line around in header.php until you find the placement that better suits your needs.
Please let me know if that works for you, or if you need additional information.
Thanks Andrea,
That works! Great.
Just one more thing. My header background color is black. Just above and under the menubar (Suckerfish blue) there are little white lines. How can i remove those white lines? (Is white the background color for the menubar?)Hope to hear from you.
TonyHi Tony,
Probably the white lines you see are the CSS borders, and you can change their colors editing the Suckerfish blue CSS file in:
wp-content/plugins/menubar/templates/Suckerfish_45/sf-blue.css
Okay Andrea,
I will try that and will let you know if it works.Found it!!!
One last question. The first menu item starts immediately at the left on the screen. How can i add a margin before first menu item appears.
In the ssf-blue.css code i’m not sure which line to adjust.Hope to hear from you.
Really love this plugin.
TonyYou can change line 13, from:
.sf-blue { clear: both; margin: 10px 0 0 0;to, for instance:
.sf-blue { clear: both; margin: 10px 0 0 20px;OK, I understand and found it in the .sf blue (Suckerfish) you mentioned.
However I am using the Superfish with ssf blue menubar
Where should i edit the code?/*** ESSENTIAL STYLES ***/
.ssf-blue, .ssf-blue * {
margin: 0;
padding: 0;
list-style: none;
}
.ssf-blue {
line-height: 1.0;And is there a way to aligh the search field on the right side of the screen?
Thanks for all your help!!
TonyHi Tony,
For the Superfish CSS, you can adjust the margins for the .ssf-blue-wrap and .ssf-blue-after selectors.
For the search box, edit the menu item and enter the word right in the CSS class field.
Hi Andrea,
A big thank you for your response!!
Adding the word ‘right’ in CSS class field worked. Brilliant. So simple.
Is it also possible to just display a search icon (magnifying glass) instead of a white field?One other thing. I’m using the plugin q-translate-X because the site is in 3 languages. Can I add the little flags to your menubar?
Sorry to bother you again with all these questions.
Hope you can still give me advice.Hi Tony,
You are welcome!
You can add a placeholder text to the search box using the Name field. Other changes require modifications to the template HTML, and I don’t have a solution ready for that.
The Superfish template doesn’t allow icons in the menu items, but the Suckerfish_45 template does. You can give it a try!
Hi Andrea,
I switched to Suckerfish_45 so i can use an icon.
I’ve made an icon of 45px (.png), uploaded it in wordpress and copied the url in the desired Image field.
But it doesn’t work. I still see the white textbox.(even after reloading/clearing cache). What did i do wrong?
Is it the size (45px) or the format (.png).Hope to hear from you again!
Hi Tony,
Sorry I didn’t explain clearly. To recap:
— the icon in the searchbox requires HTML changes, with any template;
— icons, e.g. language flags, in the standard menu items are supported by the Suckerfish_45 template.
Hi Andrea,
Okay. I’m not sure where in which .html page your menubar is mentioned. I can only find the .css and som .php files.
The HTML for the Suckerfish template is inside the file:
wp-content/plugins/menubar/templates/Suckerfish_45/wpm3.php
It’s not very easy to modify, otherwise I would have already suggested you a way 🙂
Ok Andrea.
Thanks for your help.
