Advice and answers from the Rentech Digital Team

  • Button Widget

    Display buttons in the app to increase customer engagement and conversions.

    Video Tutorial of Button Widget




    • The Button widget helps you to place buttons anywhere on your app’s home screen as a call to action for your customers to click on it and increase app engagement.
    • On your Swipecart dashboard, click on “Designs” in the left menu.

    • Hover over the design where you’d want to add the button widget and click on the pen (Edit) icon.

    • Now, in the design dashboard, click on the “Home” tab on the top navigation bar.

    • Click on the drop-down widget panel on the right section of the home design dashboard.
    • Scroll down in the list and click on “Button Widget”.

    • Different UI variants of the Button widget are displayed below the drop-down box.
    • Drag and drop a variant to position inside the home screen design.

    • Hover over the dropped widget and click on “Add/Edit Content”. A popup opens. You can customize the Button widget here.

    • Radius- Edit this to round off the container edges.

    • Padding- Adjust the outer padding of the widget.

    • Container Padding- Adjust the left, right, top, and bottom padding of the widget container.

    • Button Text- Enter the button text in the text box provided.

    • Font Style- Select the font style to suit the app theme.

    • Font Weight- Adjust to make the font more pronounced.

    • Font Size- Increase or decrease the font size.

    • Letter Spacing- Adjust the spacing between letters in the text.

    • Font Color- Change the font color with the help of the color picker. You can also type in the RGB, HSL, or Hex values.

    • BG Color- Change the button background color with the help of the color picker. You can also type in the RGB, HSL, or Hex values.

    • Border- Increase or decrease the visibility of the button border.

    • Border Color- Change the button border color with the help of the color picker. You can also type in the RGB, HSL, or Hex values.

    • Reset- Clicking on it will delete all the settings and reset the values to default.

    • Button Icon- You can place an icon in the button when you enable this.

    • Icon Position- Keep the icon left or right aligned.
    • Icon Color- Change the icon color.

    • Icon Library- Select an icon from the existing icon library.

    • Upload Custom Icons- By enabling this you can upload custom icons from your system file.

    • Button Link- Link the button to any User-Defined page, System-Defined page, Product, Collection, or External URL.

    • Click on “Save” after you make the changes.

    • Click on “Preview” in the top-right corner of your dashboard to preview the changes you make on the app.

    • These changes can be previewed by downloading the Swipecart mobile app on Android and iOS.
    • Click here for more information on Preview.
    • That’s it. You are done customizing the Button Widget on Swipecart.