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.