Side Menu Settings
Here’s a detailed guide on setting and customizing the side menu to meet your theme and brand requirements.
Krishna Gohil avatar
Written by Krishna Gohil
Updated yesterday

Video Tutorial of Side Menu Settings

  • Start by going to your layout on Swipecart.

  • You’ll find “Side Menu Settings” in the left menu of the “Theme Settings”.

  • Click on it to take you to the default side menu settings screen.

  • The side menu has some default navigations.

  • It has a “Logout” button at the end.

  • You have a drop-down box in the top center. The list contains the display style formats for the side menu-

    • Popup menu

    • Shrink & rotate menu

    • Shrink & slide menu

    • Easy side menu

    • Reside side menu

    • Hidden side menu (new upload box)

  • The preview icon is displayed on the side of each option. Select any display style for your side menu. It is instantly updated on the center screen.

How do you do advanced side menu settings on Swipecart?

  • Now, let’s go to the right section of the Side Menu Settings screen.

  • Here, at the top corner find a "cog icon" next to Side Menu Setting.

  • Click on it to edit some advanced side menu settings.

  • Show Side Menu - Disable this toggle switch if you don’t want a side menu for your app.

  • Show Icon- Disable it, if you want to remove the icons from the side menu list.

  • Login- Click on the edit button. Here, you can change the title and select an icon from the icon library. Enable the “Upload Custom Icons” if you want to upload a customized icon from your system file.

  • The Icon Color and the Font Color options help you to set colors through the color picker for the icon and text font.

  • Logout-You can make changes to it similar to the Login button.

  • Menu Background- Enabling this allows you to upload a background image of your choice. Click on the upload icon to upload the image from your file.

  • The image size specification is 1125*2436 pixels (Max 5MB).

💡 Note: Follow the specifications mentioned while uploading image files.

Social Media Links- Enable this to redirect users to your social media profile from the side menu.

  • Click on Add New Link to start adding social links.

  • Click on Platform and select a social media profile from the dropdown list.

  • Click on the logo or Upload Icon to change the icon.

  • Next, enter the social media URL.

  • Check the Open outside the app box if you want users to be redirected to the link outside of your app.

  • Finally, click Add to complete adding the link to the side menu. Repeat the process to add other social media links.

How to add a new menu item to the side menu on Swipecart?

  • Click on “+ Add A Menu Item”.

  • In the popup that opens, enter the name of the menu item in the Page Name input box. Set the Font Style and Font Weight for the title.

  • Next, select the icon from the icon library.

  • Enable the “Upload Custom Icons” toggle switch to upload custom icons from your file.

  • Next, link the menu item to any page on your app. There are five options.

  1. User Defined

    User-defined pages are additional tabs or pages you have created on the home page.

  2. System Defined

    System-defined pages are provided by default such as Favorites, Collections, My Cart, My Profile, Settings, and so on.

  3. Collections

    Link the menu item to any collections from your store. Select it from the Select Collection dropdown list.

  4. Web URL

    This is to link the menu item to any external website link.

  5. None

    This does not redirect the menu item to any link.

  • Click on “Submit” when you are done adding the new menu item.

How to edit the side menu items on Swipecart?

  • Below the “+ Add A Menu Item”, you have all the side menu items listed. Hover over the menu item you want to edit.

  • Click on the three-drop menu icon (Kebab icon). You have three options.

  1. Add Submenu item- Click on it if you want to add a sub-menu. In the popup, enter the new sub-menu item title and link it to a user-defined page, system-defined page, collection page, or web URL. Click on “Submit” when you are done.

  2. Edit- This option is to edit the side menu item. In the popup that opens you have options to edit the parameters for the side menu.

  3. Delete- If you do not want any menu item on the side menu, click on the “Delete” option.

How to add a submenu item to the side menu on Swipecart?

  • Go to any side menu item where you want to add the submenu item for it. Click on the three-dot icon and then on Add Submenu item.

  • In the popup, enter the title of the submenu in Page Name. Next, link it to any of these pages:

    • User Defined

    • System Defined

    • Collections

    • Web URL

    • None

  • Check any of the above options and select the relevant link from the dropdown. Finally, click Submit to complete creating a new submenu item for the menu item.

How do you change the menu item order on the side menu list?

  • Below the “+ Add A Menu Item”, you have all the side menu items listed. Hover over the menu item you want to change position.

  • Click on the six-drop menu icon just before the menu name. Keeping the mouse pressed, drag it up or down to the desired position.

  • Repeat this process to change the listing order of any side menu item.

  • Click on the save button to save the changes made.

💡 Note: Any changes you make will be updated live in the center screen section.

That’s it. We are done editing and customizing the side menu settings on Swipecart.

With the Swipecart mobile app, you can preview all plugin updates on your mobile device. Learn more about How to preview your app on your mobile device?

For any inquiries about the Side Menu settings, we encourage you to get in touch with our implementation specialist or contact our support team.

To learn about the pricing plans of Swipecart, kindly explore our website. If you are interested in discovering the full range of features and benefits that Swipecart offers, we invite you to book a demo with us. Our team will be more than happy to assist you.

Hurray! 🥳

Did this answer your question?