I want to add an image for a menu, but i need it to be a background image.
When i add an image it pushes the menu items bellow the image.
http://prntscr.com/b8l7f4
Is there a way to make this image a background image so the menu items float above the image.
3 answers
Hi zappautomation,
Is there a way to make this image a background image so the menu items float above the image.
Yes, you can make a addition class CSS and set back-ground attribute with that image.
And then, you add that addition CSS class to menu item you want to have a back-ground image.
Let’s do it and contact me if you need further assistance!
Regards,
Mall.
Thanks, can you tell me what i need to do to make the image a background image?
Hi,
To add style background image, you can try workaround below:
1. Login your admin, go to Content-> Manage menu
-- select menu you wish to edit
-- select tab “Mega settings”, fill in the field “Extra Class” with custom CSS class (example class: “style-background”)
2. Then open the folder: app\design\frontend\(package_name)\(theme_name)\web\images
upload image background (For instance, image name: “bg-menu.png”)
3. Open the file: app\design\frontend\(package_name)\(theme_name)\Ubertheme_UbMegaMenu\web\css\source\_horizontal.less
add the following code:
.ub-mega-menu ul.level0 > li.mega.style-backgroud .child-content .child-content-inner-wrap .child-content-inner{
background: url(“../images/bg-menu.png”) no-repeat center top;
}
Hope that helps.
Regards,
Frank