Wix Mobile Apps: Adding and Managing Buttons in Your Mobile Apps

Buttons are elements in your app that enhance user interaction. Buttons can be linked to various areas within your app, external websites, and more. For example, add a 'Call Us' phone number button to allow your app users to contact you directly through the app.

Ensure your buttons provide clear calls to action to encourage users to explore what your brand offers.

Adding and managing buttons in your mobile apps

Customize your Wix apps (e.g. your own mobile app, Spaces by Wix app) with buttons. You can customize the button layout, size, the action, which devices the buttons will be visible on and more.

Add and edit up to two buttons at a time and choose how you want your buttons to look in your app.

Dashboard

1. Go to Mobile App in your site's dashboard.

2. Select the relevant tab (e.g. Spaces by Wix app, Your own mobile app).

3. Click Edit Mobile App.

4. Click the Screen drop-down at the top and choose the screen you want to edit.

5. Click Elements on the left.

6. Select Button under Basic items.

7. Customize your button using the options below:

   • Layout: Select the number of buttons you want to add (e.g. one or two buttons). Then choose the size, width, and alignment of the button(s).

   • Behavior: Click the Select button action drop-down and choose what you want the button(s) to do. For example, link the button to take app users directly to another screen on your app, chat directly through your app, open an external link and more.

     Note: Different actions may appear depending on the type of apps you have on your site.

   • Design: Choose a button design.

   • Margins: Drag the Margins sliders to adjust the padding for the button(s).

     Note: Click the Edit individually icon

     

     to separately adjust the margins.

   • General Settings: Click General Settings and under Element visibility, choose which devices to show this button on: All, Android, or iOS.

     Note: You can show or hide elements of your site depending on what operating system your app users are using on their mobile devices. Your elements are visible on all operating systems by default, but you can decide what to show on iOS, Android, or both.

8. Click Save & Publish.

Wix app

1. Go to your site in the Wix app.

2. Tap Manage

   

   at the bottom.

3. Tap Mobile App.

4. (If needed) Switch to editing a different mobile app:

   1. Tap the mobile app name at the top.

   2. Tap the relevant mobile app.

      Tip: If you want to edit a different mobile app (e.g. Fit by Wix, Spaces by Wix), choose the app as your preferred mobile app.

5. Tap Edit.

6. Tap the Screen drop-down at the top and choose the screen you want to edit.

7. Tap + Add Element in the relevant location.

8. Tap Button under Basic items.

9. Customize your button using the options below:

   • Layout: Select the number of buttons you want to add (e.g. one or two buttons). Then choose the size, width, and alignment of the button(s).

   • Behavior: Tap the Select button action drop-down and choose what you want the button(s) to do. For example, link the button to take app users directly to another screen on your app, contact you through your app, open an external link and more.

     Note: Different actions may appear depending on the type of apps you have on your site.

   • Design: Choose a button design.

   • Margins: Drag the Margins sliders to adjust the padding for the button(s).

     Note: Tap the Edit individually icon

     

     to separately adjust the margins.

   • General Settings: Choose which screen and device you want this button to appear on:

     • Visibility: Choose which devices to show this button on: All, Android or iOS.

       Note: You can show or hide elements of your site depending on what operating system your app users are using on their mobile devices. Your elements are visible on all operating systems by default, but you can decide what to show on iOS, Android, or both.

     • Location: Select which screen you want the button displayed on.

10. Tap Add. 

Wix Studio app

1. Go to your site in the Wix Studio app.

2. Tap Mobile App.

3. (If needed) Switch to editing a different mobile app:

   1. Tap the mobile app name at the top.

   2. Tap the relevant mobile app.

      Tip: If you want to edit a different mobile app (e.g. Fit by Wix, Spaces by Wix), choose the app as your preferred mobile app.

4. Tap Edit.

5. Tap the Screen drop-down at the top and choose the screen you want to edit.

6. Tap + Add Element in the relevant location.

7. Tap the Button element under Basic items.

8. Customize your button using the options below:

   • Layout: Select the number of buttons you want to add (e.g. one or two buttons). Then choose the size, width, and alignment of the button(s).

   • Behavior: Tap the Select button action drop-down and choose what you want the button(s) to do. For example, link the button to take app users directly to another screen on your app, contact you through your app, open an external link and more.

     Note: Different actions may appear depending on the type of apps you have on your site.

   • Design: Choose a button design.

   • Margins: Drag the Margins sliders to adjust the padding for the button(s).

     Note: Tap the Edit individually icon

     

     to separately adjust the margins.

   • General Settings: Choose which screen and device you want this button to appear on:

     • Visibility: Choose which devices to show this button on: All, Android or iOS.

       Note: You can show or hide elements of your site depending on what operating system your app users are using on their mobile devices. Your elements are visible on all operating systems by default, but you can decide what to show on iOS, Android, or both.

     • Location: Select which screen you want the button displayed on.

9. Tap Add.

FAQs

Click a question below to learn more about adding and managing buttons in your app.

How do I link a button to an external URL?

To link your button to an external URL to bring app users to an external site, follow the steps below.

1. Choose Open URL from the Select button action drop-down.

2. Enter the link in the Button URL section.

3. (Optional) Enter the text you want displayed on your button under Button text.

How do I link a button to direct app users to another screen?

To link a button to another screen on your app, follow the steps below.

1. Choose Open screen from the Select button action drop-down.

2. Select a screen from the Select screen drop-down.

3. (Optional) Enter the text you want to display on the button in the Button text section.