Use a background image

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

Profile photo of Mall Staff 184060.00 $tone May 27, 2016
Public

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.

#1
Profile photo of Frank 1460.00 $tone May 30, 2016
Public

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

#3

Please login or Register to Submit Answer

Written By

Comments