The CS-Cart Before After Banners addon helps you create and display impressive before and after images on the storefront. Customers can easily compare these images using a slider. They can see the benefits of the products. Admins can upload images, set creation dates, and activate banners. It's a simple way to highlight product improvements and engage customers visually.
Feature
Create new banners by uploading before and after images, setting a name, creation date, etc.
Works smoothly with CS-cart multivendor.
Add banners to your homepage by creating a new block in the Design Layouts section.
Adjust the width and height of banners and customize their appearance.
The admin can enter "before" and "after," banner text and set the background and font colors.
Customers can use a slider to compare before and after banner images easily.
Showcase promotional content effectively, helping customers see the benefits of your products.
Click on >> Items for menu link to directly access the addon.
Below page will show you the list of created banners.
Click on >> (+) icon to create new banners.
Banner creation settings explanation
Name: Enter the name of the banner
Before image: Click on local to upload before image.
After image: Click on local to upload After image.
Width and height: Enter the Width and height of the banner.
Before and after text: Enter before and after banner text.
Background and font color: Select the before and after banner text background and font color.
Creation date: Here you can select the banner creation date.
Status: Set the status as Active.
At the end, click on >> Create button.
Go to >> Marketing
Click on >> Before After Banners
Below you can see the created banner.
Creating the layout of this banner
Go to >> Design menu.
Select >> Layouts.
Then, Click on >> Layouts.
Switch to the >> Homepage
On the same page, below you find (+) icon. Click on that icon to add a new block.
Now Switch to >> Create New block
Click on >> Before After Banners
In the General Tab, Enter the name of the block.
Switch to >> Content tab.
Here, you can set the filling.
Click on >> Add Banners
Tick the checkbox to select the banner.
Then, click on Add banners and close.
After the successful addition of the banner in the block, you can see the notification "The Items were added successfully".
Now, click on >> Create button.
Below the homepage of layouts shows the new block that we have created.
In the storefront, you can see the added "Before and After" images. By moving the slider, you can view and compare both the images. This feature helps showcase impressive product images on the storefront.
At the bottom corners, the boxes show the text before and after with different backgrounds and font colors.