The floating action button does not take up the main homepage space. You can use this element to display hot-selling products and promotions to attract customer clicks.
⚠️ Before you start: For Hong Kong merchants, this feature is available only on the Shopper App Pro plan.
This article will cover the following:
1. Set up the Floating Action Button element
Step 1
Go to SHOPLINE Admin > [Shopper App Management] > [App Design] > [Homepage Design] > [Current Template]. Click Set up to enter the app page editor.
Step 2
Click Floating Action Button in the left panel to set up. You can also enable, disable the Floating Action Button element here.
Step 3
Complete the following settings in the right editing area.
i. Image settings
-
Default Image: Click Select an Image and choose your preferred image from the default library, then click Confirm.
-
Custom Image: Click Add an Image to upload your preferred image. Use PNG, JPEG, JPG, or GIF formats, with a maximum file size of 2MB.
ii. Jump link
You can select from 6 destination pages: Featured Promotion, Promotion, Selected Category, Top Ranking, Store Information, or Custom URL.
*Notes:
- You can only select destination pages with valid content. For example, choose "Featured Promotions" only if your store has an active promotion, or "Store Information" only if store details are available on the storefront.
- If you select "Custom URL", please enter a link starting with "https://" or "http://".
iii. Release schedule (optional)
If you have set a release time, the element will be displayed in the app at the specified time.
Step 4
Click Save to save the changes. And once you finish all editing, click Update and use to publish the changes to your app.
2. App display effect
- The Floating Action Button appears by default in the bottom-right corner of the app. Customers can drag it vertically along the right side.
- Tap the "X" in the top-right corner to close the Floating Action Button for the rest of the day. If the customers reopen the app, the Floating Action Button will appear again.
- The Floating Action Button will automatically hide when customers scroll and will reappear when scrolling stops.

Comments