To customise the appearance and placement of the WhatsApp button on your storefront, you can navigate to 'Online Store' and choose the 'Customise' option for your theme.
One the left of the customiser sits three options, Sections, Theme Settings, and App Embeds. You need to choose the App Embeds option as this app sits on top of your site and not within. See below gif image. Any app that offer app embed extension would show here, including the WhatsApp Button extension. To disable the app from showing on your storefront you can click the toggle button to activate or deactivate the app extension. See below gif image.
Within the app embed you will see a selection of customisable options. These are listed below. Also see the gif image above.
- Background colour
- Show background or not
- Background border radius
- Background padding Y & X axis
- Text colour
- Text size
- Show text or not
- Text content
- Text decoration (underlined or not underlined)
- Font weight (bold or regular)
- Style of the button (horizontal - default, or vertical)
- Size of the WhatsApp icon
- Show a profile picture or not
- Size of the profile picture
- Positioning (top-left, top-right, bottom-left, bottom-right)
- Offset controls (how far from the top,left,right,bottom should the button sit)
- Mobile button (if to show just the WhatsApp icon on mobile, or continue to show the desktop version)
- Mobile offset controls (how far from the top,left,right,bottom should the button sit on mobile)
