Online Store Page Settings in Mobile Editor
To access Online Store Page Settings:
- In the Mobile Editor, click Pages in the bottom toolbar:
- Find Store in the opened menu, click the Settings icon on the right, and switch between the Page, Layout, View, and Design tabs:
Connect/Disconnect Store
- Use the toggle at the top of the Store page settings to connect/disconnect the Online Store:
Please Note: Upon disconnecting, the Store page will be hidden from the Navigation Menu and inaccessible on the live site. All product/catalog widgets will also be removed from the pages.
Page Tab
Page Settings allow you to configure basic information about your store page, including:
- Page Name: The internal name of the page.
- URL: The page's address.
SEO Tab
SEO Settings allow you to optimize your store page for search engines. You can manage:
- Title: The title will be displayed in the browser tab.
- Description: A summary of the page's content.
- Social Share Image:
- Show Page in Search Results: Control whether the page is visible on the website and in search engines.
Layout Tab
Layout Settings determine the overall appearance of your store page. You can choose from different layout formats and customize their appearance.
- Layout Format Options: Choose between Grid, List, and Masonry.
- Total Rows: Set the number of rows displayed on the page.
- Products Per Row: Specify the number of products in each row (Grid layout only).
- Margin: Set the margin around the product catalog.
- Product Spacing: Adjust the spacing between product cards.
- Compact: Change the card appearance for a more compact look (List layout only).
- Line: Add or modify a line between product cards (List layout only).
- Categories: Enable a dropdown menu to filter products by category.
- Sort: Enable a dropdown menu to sort products by various criteria (newest, oldest, price, featured, name).
View Tab
View Settings control the appearance of individual product cards. You can customize which information is displayed and the card's visual style.
- Image Aspect Ratio: Set the image aspect ratio (not available for Masonry layout).
- Switches: Determine which product information is displayed on the card (Badges, Product Name, SKU, Price, Excerpt).
Badges. The toggle enables the On Sale, Sold Out, and Few Left badges for your Online Store.
Please Note: The Few Left badge automatically shows when less than ten items are in stock.
- Button Settings: Turn on the toggle to display the button and configure its appearance and behavior (Text, Width, On-Click action).
Design Tab
Design Settings allow you to customize your store page's color scheme and visual style. You can manage:
- Catalog Background: Set the background color of the product catalog.
- Catalog Border: Adjust the color and size of the catalog border.
- Card Background: Set the background color of product cards.
- Card Border: Adjust the color and size of the card border.
- Hover Effects: Configure visual effects when hovering over product cards (Show Additional Images, Highlight Border, Highlight Background, Highlight Shadow).
Please Note: No effects are applied if the toggle is turned off.