The mobile app is the best way to manage members, so it is important to guide customers to download the app. Shopper App's "App Download Guide" feature allows you to easily enable an online store QR Code download guide or create QR Code images for your online / retail store.
You can add these images to your online store through the slider widgets and pop-ups, or place them in retail stores to encourage app downloads.
This article will cover the following:
- Install the app
- Online store app download guide settings
- Online store QR Code production
- Retail store QR Code production
1. Install the app
Step 1. Go to the settings page
Go to SHOPLINE Admin > [Shopper App Management] > [App Settings], and click "App Download Guide".
Step 2. Install the app
The system will display a popup guiding users to download the Shopper App, view the installation steps, and click Install Now.
*Note: You need to publish the app before accessing this page.
Click Install Now to install the app for free.
Step 3. Active the app script
Go to [Apps] > [My Apps], find the "Shopper App Download Guide" and click App Settings.
Active the "App Script" to complete the settings.
2. Online store app download guide settings
Go to [Shopper App Management] > [App Settings] > [App Download Guide]. Select the Online Store Display Settings tab, and configure the following settings.
*Note: If you enable the script without configuring the online store display settings, the system will automatically display the default content.
Web Version
i. Floating icon position
Select the display location of the floating icon. You can choose between the lower right and the lower left of the webpage.
ii. Online store display settings
If you enable this toggle, the QR Code image will automatically expand and display when customers visit your website. If disabled, only a circular floating icon will remain, and customers will need to click to expand the QR Code image.
*Note: After a customer clicks the X button to close the QR Code image, it will not pop up again for 24 hours.
iii. Guidance text
The guidance text will be displayed at the bottom of the window to guide customers to download the app. You can enter text in English, Simplified Chinese, and Traditional Chinese, up to 200 characters.
*Note: If left blank, the system will display the download gift message. If the download gift is not enabled, the system default text will be displayed.
iv. Color settings
Set the floating icon color, background color, and text color. The text color will be applied to the QR code, app name, and guidance text.
You can click Web Version in the preview area on the right to confirm the settings and click Save.
The storefront displays as follows:
Mobile Version
i. Guidance text
The guidance text will be displayed at the bottom of the window to guide customers to download the app. You can enter text in English, Simplified Chinese, and Traditional Chinese, up to 200 characters.
*Note: If left blank, the system will display the download gift message. If the download gift is not enabled, the system default text will be displayed.
ii. Button text
You can enter text in English, Simplified Chinese, and Traditional Chinese, up to 15 characters.
*Note: If left blank, the button will default to “Open App”.
iii. Color settings
Set the background color, text color, button background, and button text color. The text color will be applied to the app name and guidance text.
You can click Mobile Version in the preview area on the right to confirm the settings and click Save.
The app displays as follows:
2. Online store QR Code production
Step 1. Content Settings
Go to [Shopper App Management] > [App Settings] > [App Download Guide]. Select the Online Store Image Production tab, and configure the following settings.
i. Show app logo
The "Show app logo" feature is enabled by default and can be turned off manually.
*Note: You can go to [App Design] > [Brand Content] to set the app logo.
ii. Promotional title & text
Enter the promotional title and text. The title supports up to 25 characters, and the text supports up to 40 characters.
iii. Show app store image
The "Show App Store Image" feature is enabled by default and can be turned off manually.
*Note: If your store is only published on the App Store or Google Play, only the successfully published app store images will be displayed.
iv. Download gift promotion text
The "Show download gift promotion text" feature is enabled by default and can be turned off manually. You can edit the text, which supports up to 25 characters.
Step 2. Color Settings
i. Background
Select "Solid color background" to choose a background color. You can use the color palette or enter a color code directly.
Select "Custom background" to upload an image. The recommended size is 934*548 px.
ii. Text color
Choose a text color. You can use the color palette or enter a color code directly.
Step 3. Preview picture
You can preview your design in the "Preview" section during the setup process.
The system offers three image ratios, including 9:5 / 3:5 / 2:1. The default size is 9:5.
Step 4. Download picture
After completing the production, click Download the picture to download the image to your device. The image format is PNG.
Step 5. Save design
Click Save to save the design in the Admin. You can remake it anytime.
3. Retail store QR Code production
Step 1. Content Settings
Go to [Shopper App Management] > [App Settings] > [App Download Guide]. Select the Retail Store Image Production tab, and configure the following settings.
i. Show app logo
The "Show app logo" feature is enabled by default and can be turned off manually.
*Note: You can go to [App Design] > [Brand Content] to set the app logo.
ii. Store name
Use the drop-down menu to select a store, or enter the store name to search.
*Note: The store information here is the same as [Shopper App Management] > [App Settings] > [Store Information Settings].
iii. Promotional title & text
Enter the promotional title and text, and set the text color. The title supports up to 25 characters, and the text supports up to 40 characters.
iv. Download gift promotion text
The "Show download gift promotion text" feature is enabled by default and can be turned off manually. You can edit the text, which supports up to 25 characters.
v. Show app store image
The "Show App Store Image" feature is enabled by default and can be turned off manually.
*Note: If your store is only published on the App Store or Google Play, only the successfully published app store images will be displayed.
Step 2. Color Settings
i. Background
Select "Solid color background" to choose a background color. You can use the color palette or enter a color code directly.
Select "Custom background" to upload an image. The recommended size is 317*378 px.
ii. Text color
Choose a text color. You can use the color palette or enter a color code directly.
Step 3. Preview picture
You can preview your design in the "Preview" section during the setup process.
The system offers two image ratios, including 3:5 / 9:5. The default size is 3:5.
Step 4. Download picture
After completing the production, click Download the picture to download the image to your device. The image format is PNG.
Step 5. Save design
Click Save to save the design in the Admin. You can remake it anytime.
Click Production records on the top right to view all saved retail store QR Code pictures. You can click Copy and redo or Download the picture to perform the actions.
Read More
Comments