...
To access the catalog banner configuration, follow these steps:
Navigate to Manage Apps in the sidebar.
Select Shoppie from the list of apps.
Go to Configuration.
Click on Catalog Configuration.
Open the Catalog Design tab.
In the Catalog Design tab, you will find options to edit and preview the catalog banner.
| Info |
|---|
If no catalog banner design is configured the default catalog banner will be displayed. |
Editing
...
Edit Banner
Button:
Edit BannerFunction: Opens a modal with two tabs for editing the banner layout and content.
Preview on JSM
Button:
Preview on JSMFunction: Provides a preview of the configured banner in the JSM portal.
Banner Preview
A simple preview of the configured banner is displayed below the buttons.
Banner Editing Modal
The modal that appears upon clicking Edit Banner contains two tabs: Layout and Content.
...
Layout Tab
catalog banner
...
In the Layout tab, you can edit customize the banner's layout of the banner, customize the image, and modify the text.
Background Fill
Options:
...
Solid Color: Includes a color picker for choosing a solid background color.
...
text. For the background fill, you have the option to choose a solid color using a color picker or to select an image as the background.
...
Choosing an Image
Button:
Choose ImageOptions:
Unsplash: Select an image from Unsplash.
Upload Image from URL: Upload your own image from an URL.
Product Cards
Toggle: Default is set to
ON.Options:
Category: Toggle ON/OFF.
Description: Toggle ON/OFF.
Price: Toggle ON/OFF.
The banner is split into a static banner and a section with product cards. The banner is used to access the catalog in the JSM portal.
| Info |
|---|
By default 3 random products will be taken from the catalog and displayed in the product cards section. |
Content Tab
When choosing an image, you can either select one from Unsplash or upload your own image via URL.
In the Content tab, you can edit the title, text, and select which products to display in the banner.
Editing Options
...
You can edit the title of the static banner
...
and modify the text that appears on
...
it. Additionally, you can choose which products to display in the product cards section.
...
Product Management
...
For product management, you have the option to rearrange products in the list to control the order in which they appear.
...