# Web Storefront Design
Storeberry has prepared a variety of simple yet stylish UI templates for you. With absolutely no coding skills required, you can go to Storeberry Admin Panel 「Online Store」 「My Template」 and pick the desired style and theme for your website, then upload your brand logo and related information to complete the interface design of your online store!
Want to make further modifications? You can simply tap Edit on the selected UI template to edit the layout, color and others to create a unique and outstanding online store.*All Storeberry designs adopt responsive web design (RWD) which can automatically optimize the website layout, regardless of whether you are using mobile phone, tablet, or desktop computer to browse our website.
Storeberry Storefront Design Tips：
1）How do I update the store name and logo?
- 1. Go to Storeberry Admin Panel 「Online Store」 「My Template」 「Edit (Template)」 to get into the interface setting.
- 2. Go to “Shop logo” and tap the small “edit” icon on the right hand side and update the store name and logo.
- 3. Click “Save” to confirm the updates.
2）How do I edit the top menu bar?
After establishing your product categories, you can feel free to edit the top menu bar of your website.
- 1. Enter the interface setting at Storeberry Admin Panel 「Online Store」 「My Template」 「Edit (Template)」
- 2. Tap the small “edit” icon next to the top menu bar
- 3. Click +Add to add new product categories, pages and links and adjust the order of items by drag and drop.
- 4. Tap “Save” to confirm the updates.
3）How do I create new website pages?
- 1. Go to Storeberry Admin Panel 「Online Store」 「My Template」 「Edit (Template)」 to get into the interface setting.
- 3. To create a new page, you can click the “+” icon next to “Pages” to add a page and get the URL under Page Title. Enter the following details and tap “Save”.
# Display Language Setting
In order to assist brands to expand their business into new markets, Storeberry now supports 5 display language options for merchants to further serve the needs of individual customers.
Display languages can be set for your online store in Storeberry Admin Panel 「Online Store」 「Language」 . More new display languages are coming up!
# Payment Gateway and Invoice Setting
There is nothing more important than payment security. Storeberry works with multiple third-party payment service providers to offer safe and smart payment options* and ensure secure and smooth transactions between buyers and sellers.
Whether you prefer credit card payment, mobile payment, or other custom payment methods (E.g. bank transfer or cash on delivery), you can simply set up the payment options under Storeberry Admin Panel 「Online Store」 「Payment」 in a few steps.
For Payment Gateway Setup, please refer to the Storeberry Payment Gateway Integration Guide below.
* Online payment methods include: Visa, Mastercard, PayPal, FPS, Alipay Hong Kong, WeChat Pay HK, PayMe For Business, etc.
Storeberry Payment Gateway Integration Guide
How to set up PayPal:
If you are using PayPal for the first time, please register a PayPal Business Account in PayPal Developers Website and follow the steps below to get your Paypal Client ID and Client Secret:
1）Log in to your PayPal Business Account, go to the top right corner and tap your account name > “Dashboard”. Click “My Apps & Credentials” on the side menu bar and select “Live”. Then scroll down and click “Create App”.
2）Click “Create App” after entering the “App Name”, then copy the Client ID and Secret. Go to Storeberry Admin Panel 「Online Store」 「Payment」 and paste on the PayPal column. Click “On” to connect to the payment gateway.
How to Set Up Stripe:
If you are using Stripe for the first time, please register a Stripe Account in Stripe and follow the steps below to get your Stripe Publishable Key & Secret Key:
1）Open the email from Stripe and click “Verify email address” and enter Stripe’s website.
2）Go to the side menu bar and click your account name > “+New account”. Enter your store name and location on the pop up window, then click on the “Create Account” button.
3）Click「Activate your account」to update your account details.
4）After registering, click “Developers” on the side menu bar and choose “API Keys”.
5）Please make sure the “View test data” mode has been turned off, then copy the Publishable Key and Secret Key on the website. Go to Storeberry Admin Panel 「Online Store」 「Payment」 and paste on the Stripe column. Click “On” to connect to the payment gateway.
How to Set Up PayMe for Business?
PayMe for Business is designed for HSBC Business Internet Banking customers. If you want to use PayMe for Business as a payment method, you can first go to the PayMe for Business and complete the account registration based on the following situations:
1.1）If you're an HSBC Business Internet Banking customer: You can download the PayMe for Business app and start using PayMe for Business straight away. （ App Store ｜ Google Play ）。
1.2）If you’re not an HSBC Business Internet Banking customer:
Please click on the Apply Online” button or contact HSBC (2748-8288) to apply for HSBC Business Internet Banking Account. Download the PayMe for Business app （ App Store ｜ Google Play ） when your account is ready to use.
1.3）If you’re an HSBC Commercial Banking customer but haven’t signed up for Internet Banking
Please go to http://www.business.hsbc.com.hk/bib or call HSBC Hotline (2748-8288, and press 1＃-5-1-4) to sign up for Internet Banking Service. Download the PayMe for Business app ( App Store ｜ Google Play ）when your Internet Banking is ready to use.
After successfully opening the bank account, you can register a PayMe for Business account and get your Client ID, Client Secret, Signing Key ID, Signing Key by following the steps below:
2) Open the PayMe for Business app, complete the registration process according to the PayMe for Business Starter Guide.
3）Please tap the Profile Icon to add your store profile picture after registration.
4）Go to the main page and tap “Help Centre” > “Send us an enquiry”. Please select “Online Payment” as the topic and enter the following message: “I am a Storeberry customer and interested in using PayMe to collect payments online. My Storeberry identification code is: (enter your Storeberry online store URL here, E.g. https://company-name.mystoreberry.com)”. And reply with “Confirm” for submission.
5）Once you have confirmed the terms, you will receive:
（i）an email attached with an encrypted file for your API credentials; and
（ii）a message with password for decrypting the PDF file on your PayMe for Business app.
After decrypting the file, you will get your Client ID, Client Secret, Signing Key ID and Signing Key for the payment gateway integration with your online store. Please copy those API credentials and paste on the Stripe column under Storeberry Admin Panel 「Online Store」 「Payment」 . Click On to connect to the payment gateway.
How to Set Up QFPay?
1） If you are using QFPay for the first time, please leave your contact details on QFPay and submit with the following message: “I am a Storeberry customer and interested in using QFPay to collect payments online. My Storeberry identification code is: (enter your Storeberry online store URL here, E.g. https://company-name.mystoreberry.com)”
2）You will receive the App Code and App Key from the QFPay Team after submission. Please copy the API credentials and paste on the QFPay column under Storeberry Admin Panel 「Online Store」 「Payment」 . Select your accepted payment methods and click “On” to connect to the payment gateway.
You can go to the Storeberry Admin Panel 「Online Store」 「Invoice Setting」 to fill in the details. Click “Save” to confirm the updates.
# Logistics Setting
A smooth and efficient delivery process can bring customers an enjoyable shopping experience and greatly enhance customer satisfaction!
Merchants can set up your local and international delivery and other logistics options under Storeberry Admin Panel 「Online Store」 「Shipping」 by simply entering the delivery fee, the name of the shipping method and the details.
You can also set up exclusive free shipping conditions here (E.g. spending a certain amount, purchasing a specified product, etc.) to attract customers to purchase additional products!
# Domain Setting
Storeberry provides a free built-in domain for all users. To shorten the timeline for launching an online store, the built-in domain will be automatically connected to your online store.
If you prefer to use your own domain name, you can go to Storeberry Admin Panel 「Online Store」 「Domain」 and click Connect a domain under the Use your own domain column to set up your existing domain.
How do I set up my existing domain in Storeberry?
If you are using an existing domain, you can change its setting to point it to your Storeberry store. Please follow the steps below to connect your existing domain to Storeberry:
1）First, enter your existing domain in the box under the “Use your own domain" column, then click “Submit”.
2）Go to your domain provider and log in your account you have with your domain provider. Click “DNS” and edit the following DNS settings:
3）Delete all A & CNAME records and follow the below steps.
4）Update your A and CNAME records and click “Save”:
Map your A record to Storeberry’s IP address: @ | 188.8.131.52 | 1/2hour (*Please ensure that you've mapped with one IP address only)
Map your CNAME record to Storeberry’s IP address: www ｜ eshop1.mystoreberry.com ｜ 1/2小時
5）After mapping, it may take around 48 hours for your existing domain to point to your Storeberry store. Please reach out to your domain provider if you face any problems setting up.
How do I connect a subdomain to Storeberry?
1）Go to your domain provider and log in your account you have with your domain provid. Click “DNS” and edit the following DNS settings.
2） Find your CNAME record in your DNS setting, change your subdomain CNAME record to map to eshop1.mystoreberry.com. Then click “Save” to update your CNAME record.
E.g. If you want your subdomain “shop.simple-fashion.com” to point to your Storeberry online store, you can change your store’s CNAME record to map to: “eshop1.mystoreberry.com”
3）Go to Storeberry Admin Panel 「Online Store」 「Domain」 and click “Connect a domain” under the “Use your own domain" column, enter your subdomain (eg. shop.simple-fashion.com) in the box and click “Submit”.
4）After mapping, it may take around 48 hours for your subdomain to point to your Storeberry store. Please reach out to your domain provider if you face any problems setting up.
Note on adding your custom domain to Storeberry:
After you've added your domain to Storeberry, you need to choose your primary domain -- the domain name that customers will see in the address bar while they browse your online store.
# Product Import
Fascinating product photos and compelling product descriptions are definitely the key to winning customers! Go to the Storeberry Admin Panel 「Products」 and click 「Add product」 , you can simply add the products to your online store by entering the following details:
Upload the product images and fill in the “Name”, “Short Description”, “Description” and “Keywords”.
Want to adjust image color and tone? Storeberry provides a built-in image editing tool to make it more simple & user-friendly.
Select the product category from the drop-down menu on the “Category” column, then continue to enter the product details (E.g. Tag, Weight, Original Price, Final Price, SKU No., etc.) and set the free shipping and discount conditions.
If you want to add a new category, you can click “Manage Categories” in the upper right corner of the “Category” column, and enter the information of the new category on the pop-up page.
Click “+ Edit option” to set the product-related options, (E.g. Color, Size, Material, etc.), and enter the product options details, including: SKU No., Barcode No., Weight, Original price, Special price, Cost, etc.
Enter the inventory details if needed, such as the stock quantity, expiry date, etc.
Through the “Status”, “Online”, “Retail” buttons, you can decide to launch or hide the product, and whether the product can be purchased on the online store or physical store with just one click. Tap "Save" to launch the product at once.
Want to bulk import products into your online store? Storberry provides CSV import function, which allows users to import up to 500 items from a spreadsheet at one time, helping you to set up the online store in a more efficient way.
# Product Categorization
A smooth online shop browsing experience can greatly improve customer satisfaction! Storeberry provides the two-tier product classification function (Parent category + Sub-category), which is convenient for you to easily manage your products and maintain the cleanliness of the product display on the website. You can manage and classify products under Storeberry Admin Panel 「Product Categories」
How to Add New Category:
1）Click “Add Category” in the upper right corner of the “Categories” page, and then fill in the details of the new product category.
2.1）Create “Parent Category” : Please leave the “Parent Category” box blank, and then continue to enter the remaining info and click “Save” to complete the setting.
2.2）Create a “Sub-category”: First you can create a “Parent Category” of the product. Then when creating a “Sub-category” , select its parent category from the drop-down list of the “Parent Category” box. Continue to enter the remaining details and click “Save”.
# Email Configuration
Go to Storeberry Admin Panel 「Online Store」 and select 「Email Configuration」 at the side toolbar. You can choose whether to use Storeberry or SMTP as your email server here.
You only need to enter your sender name (E.g. your store name), the prefix of the sender email address (E.g. no-reply), and signature in the “Email Content Setting” column, and continue to enter the “Notification Email” (i.e. Order confirmation) below and upload the email logo to complete the setting.
If you chose “SMTP*” as your mail server:
（*Attention: This setting only applies to the personal version of Gmail, and personal Gmail SMTP is limited to 100 emails per day.）
1. Please log in to your Google account, click your account icon, and select “Manage your Google account”.
2. Tap “Security” from the side toolbar of Google, and click to turn on “Two-Step Verification” to increase the level of security. Please follow the instructions to select your verification method and complete the verification process.
3. Then tap “Security” from the side toolbar again, and click “App passwords” to connect it to our SMTP service.
4. Select “Other (Custom name)” as the app and device for which you want to generate the app password, and name it “Business Email”. Click “Generate” and keep the app password for future use.
5. Go back to the Storeberry Admin Panel 「Online Store」 and tap 「Email Configuration」 at the side toolbar. Select “SMTP” in the Email Server column, and continue to enter the following information as below:
- Host: smtp.gmail.com
- Port: 587
- Username: (Please enter your personal Gmail email address)
- Password: (Please enter the "App Password" generated in Gmail)
- Encryption: TLS
6. Click “Save” to update the changes. Then you can enter the email address for testing on the pop-up window of “SMTP Connection Test”, and click “Test & Save” to send the test email. Your SMTP setup will be finished once you received the confirmation message and the test email.
7. Finally, please go back to the Storeberry Admin Panel 「Online Store」 「Email Configuration」 , and continue to enter the email content settings, notification email and upload the email logo to complete the email settings.
# Email Message Template Setup
The complicated steps of opening a store making you feel annoyed? Let Storeberry simplify the online store setup process for you! We provide up to 5 preset email templates, including: Member Welcome Email, Order Confirmation, Booking Reminder, Delivery Note and Forgot Password, etc. to speed up your store setup process.
Want to make further changes? You can update the content of each email template through Storeberry Admin Panel 「Online Store」 「Email Design」
# Legal Notice
If you sell products related to tobacco and alcohol, you must follow the guidelines from the Tobacco and Alcohol Control Office of the Department of Health, and display the prescribed notice in a reasonably legible manner.
You can fill in the legal notices and rejection messages through Storeberry Admin Panel 「Online Store」 「Legal Notice」 to prevent customers who refuse to accept the declaration from entering the website.
# Data Tracking and SEO Setting
While creating an online store at Storeberry, you can set up the website analysis and SEO tools to boost your marketing efficiency!
Want to create a successful online store? Improve the SEO of your online store is definitely one of the powerful keys! What you need is to fill in the following details under the Storeberry Admin Panel 「Online Store」 「SEO」 , and you can simply complete the SEO settings of your online store in one step!
Storeberry supports Google Tag Manager (GTM), Google Analytics and Facebook Pixel ad tracking tools to help you master the data of ads recorded by conversion tracking and website content.
You can go to Storeberry Admin Panel 「Online Store」 「Analytics」 to fill in the tracking ID, and connect to the tracking tools you want to use at once!
Storeberry Data Tracking Tool:
How to Set Up Facebook Pixel:
If this is your first time to set up Facebook Pixel, you can log in to your Facebook account on the Facebook Events Manager page, and then follow the steps below to get your Merchant ID:
1） Click “Connect a data source”, then select “Web” and "Facebook pixel” , and then enter your pixel name and the URL of your online store.
2）After successfully creating your Pixel account, please tap “Install Code Manually" and copy the code, and you will find your Merchant ID (16-digit number) from the code.
3）Go to the Storeberry Admin Panel 「Online Store」 「Analytics」 and tap the “Enable” button of the Facebook Pixel column. Then continue to enter your Merchant ID to connect it to your website.
How to Set Up Google Analytics:
If this is your first time to set up Google Analytics, please log in to your Google account on the Google Analytics page , and then follow the steps below to get your Google Analytics tracking ID:
1）Register a GA account: Fill in the information according to the instructions on the Google Analytics page, including account name and resource name.
2）After registering, please select “Data Stream” from the side toolbar, and click “Add Stream” > “Internet” in the upper right corner of the page to set up data streaming.
3）Enter the “URL” and “Stream Name” and click “Create Stream”. Your Tracking ID will be displayed on the page.
4）Go to the Storeberry Admin Panel 「Online Store」 「Analytics」 tap the “Enable” button of the Google Analytics column. Then continue to enter your Tracking ID to connect it to your website.
Was this article helpful?
Can’t find the answers you’re looking for?