Style Settings for Mobile Menu app

Style Settings for Mobile Menu app


Head to Display settings tab, you'll find options to style your mobile menu in Custom Style:

Custom Style



Menu box text alignment
Align all content on menu, including section title, links list, social icons...
For title in each product or image, there's alignment option inside each.

Menu horizontal spacing
Adjust the space on the left and right of the menu content.

Font family
Our app supports Google Fonts. Type a font name in "Font family" to search for a font that fits your theme.
Leave the font family blank if you want to use theme's default font.

Color
Adjust the colors of text to fit your store. These adjustments apply globally to all sections.
Note: there's no hover event on mobile, so there's no hover color.
Leave all color options blank if you want to use your theme's default colors.

Background color
If you use the "Replace theme menu" method, the background color bases on your theme's default mobile menu. You'll need to modify code to change it (contact us for help).
If you use the "Add an extra mobile menu", you'll have an option to change background color.


Hamburger Button Style

*Only available if using "Add an extra mobile menu with floating button".



Position
Set the position of hamburger button. Please remind if your store is having any other buttons showing up in the selected position.

Style
Our app allows 3 shapes of the hamburger button: squared, rounded and circled.

Size
Adjust the size of the button.

Show shadow
Recommend to enable this option, it makes the button easier to be seen.


*Only available if using "Add an extra mobile menu with floating button".



Position
Set the position where the menu box slide in: Left (slide from Left to right) or Right (slide from Right to left).

Animation
Set the animation when opening submenu.
Remember to turn on the "Enable animation" in the Menu section settings.

Skin
Skin is pre-defined colors for your menu. To apply Skin, you need to clear color hex in all color options below it.

Width
Adjust the wideness of the menu box.
Note: if you set it too wide (eg. > 320px), menu might be cut off on smaller screens (eg. iphone 5).

Padding
Adjust the space from the menu content to the edge of menu box.

Background
Set the background color of your menu box. Then you can change the text color in Custom Style below.