How To Customize The Button Section
The default MPA template includes a Contact Button section with the two most popular contact buttons, one to contact you via email and the other to contact you by phone. You should have already added your contact information when you first set up your brand and every time you create a new app this will be automatically added.
You can update this at any time by clicking on the Quick Set Up Icon and saving the changes, which will then apply to the current and all NEW apps you create.
Alternatively, you can change the contact details for an individual App in the Contact Buttons settings:
1. In the layout sections area, click on the settings cog next to Contact buttons section to open the button settings dialog.
2. Click on the Contact button you want to update to open the individual edit button menu and enter the new contact details you want to use for this particular App and click save. This is also where you can add a button label or set a custom color just for that button that will override the default color for the Section or App. It is also where you can delete a button you don't want in the section.
3. Click Save to update the button and return to the main menu.
4. Make any other changes you want to the button color, size etc and click Save to return to the builder.
How To Add A New Button To The Contact Button Section
It's easy to add additional buttons to your App for other means of contact, for example, a button so people can text a message to you or both landline and mobile phone buttons in a few easy steps. here is how to add another standard button Icon:
1. Click the settings cog to open the button settings menu.
2. Click on add standard button to open the Select Icon.
There are over 500 buttons. You can type in a keyword in the filter box to search for the icon you are looking for to see if it is included or scroll through and choose an icon for your button. Let's add a mobile phone button, searching for 'phone' should bring up some suitable choices. When you have found the icon you want, click on it to return to the button settings menu.
3. You will see the new button icon on the right of the row of buttons.
Click on the new button icon you just added to edit the button settings, the button type will automatically be set to Link. Enter the syntax for the new contact you are adding, in this case, a button to call a mobile phone so the syntax is tel:xxx xxxx xxxx where the x's are the mobile phone number you want them to call.
4. Click save in the lower right to save your button changes. See below for some popular examples.
5. You can change the order of buttons using drag and drop:
- Click on the button you want to move and drag it over the top of the other buttons
- Drop the button on top of the button you wish to place it to the left of
- Your button will now be positioned to the left of the button you dropped it on
6. Click Save again to close the button settings and return to the builder and you should see your new button in the visual design.
7. Next, publish your App and test out your new button.
Here is the syntax for some contact button options you might like to add:
SMS Text message: sms:xxx-xxx-xxxx Replace x's with your mobile number
mobile phone: tel:xxx-xxx-xxx Replace x's with your mobile number
Facebook page: https://www.facebook.com/YourFacebookID
Facebook page messenger: https://www.facebook.com/messages/t/yourFacebookID
NOTE: SMS text buttons will not work on a computer so you will need to check out the App on a mobile device.
Save Your New Contact Button Section
If you want to save your updated contact button section to use in selected Apps in the future right click on the updated Contact Button section and choose Save As Custom Section, enter a name for the custom section and click Save. Your new custom section will now appear in the add section menu next time you open it ready for you to add to any App you want.
If you want the newly updated button section to be included in all of your future apps, you will need to update your current default template. Click on the save as template icon and choose Save As Default template and the builder will use the current Apps layout for all future apps.
TIP: If your current app isn't one you want to use as a default layout just create a new app using the default template, delete the contact buttons section and copy the updated contact button section from this app to the new app and save this one as the default template.
Check out these KB articles for more information on customizing Button sections: