%2520(1).png%3Falt%3Dmedia%26token%3D6fb48f09-a8eb-423f-8296-83ba614ae5a4)
%2520(1).png%3Falt%3Dmedia%26token%3D6fb48f09-a8eb-423f-8296-83ba614ae5a4)
Product Color
How to add Product Color
The "Product Color" feature lets you customize a product's visual presentation, including title, hover effects, price, sale items, reviews, and badges like "New," "Sale," and "Soldout." Enhance the look, engage users, and maintain brand consistency.
STEP 1:
Log in to your Aasaan desktop admin panel and click on Store Front.
STEP 2:
Click on the content template in which you wish to add Product color. You can also click on Create Template, if you wish to create a new template for your website.
STEP 3:
Click on Themes.
STEP 4:
Click on the dropdown to select Product color.
To change the color of the product title, please follow these steps:
STEP 5:
Click on Product Title Color.
This action will open up the color customization settings specifically for the product title.
STEP 6:
Choose your desired color by either selecting from the provided color palette or entering the exact color code if you have a specific color in mind.
The changes will be reflected on the Product Title. Please refer to fig:Product title color.
fig:Product title color
STEP 7:
To change the color of the product title when it's hovered over by a user, you can follow these steps:
Note: Hover color refers to the change in color of an element (such as a button or link) when a user hovers their cursor over it.
Click on Product Title Hover Color.
STEP 8:
Choose your desired color by either selecting from the provided color palette or entering the exact color code if you have a specific color in mind.
The changes will be reflected on the Product Title when the user hovers the cursor over it. Please refer to fig:Product title hover color.
fig:Product title hover color
STEP 9:
To change the color of the product price, click on Product Price Color.
STEP 10:
Choose your desired color by either selecting from the provided color palette or entering the exact color code.
The changes will be reflected on the MSRP of the product. Please refer to fig:Product Price color.
bdd7.jpg?alt=media&token=d31876ef-db2d-47db-a1eb-62b56bf79a30)
fig:Product Price color
STEP 11:
To change the color of the product price when it's on sale or discounted, click on Product Price Sale Color.
STEP 12:
Choose your desired color by either selecting from the provided color palette or entering the exact color code.
The changes will be reflected on the Sale Price & Savings of the product. Please refer to fig:Product Price Sale Color.
b8f3.jpg?alt=media&token=a1c7f2be-11bf-4eee-ad23-7a4f18cfef3b)
fig:Product Price Sale Color
STEP 13:
To change the color of review or rating text on a product, click on Product Review Color
STEP 14:
Choose your desired color by either selecting from the provided color palette or entering the exact color code
The changes will be reflected on the review or rating symbols of the product. Please refer to fig:Product Review color.
d380.jpg?alt=media&token=1bf7e2ec-67e2-4a9e-90f3-1ca15a5b8043)
fig:Product Review color
STEP 15:
To change the color of empty review or rating symbols, click on Product Review Empty Color.
STEP 16:
You can now either add a new color or change the existing color for the empty review or rating symbols.
Select the desired color from the available color palette or input the specific color code.
c193.jpg?alt=media&token=03fc8335-7e64-4433-bcb8-7746c8a52a5f)
The changes will be reflected on the color of the empty review or rating symbols. Please refer to fig:Product Review Empty color.
b34f.jpg?alt=media&token=cdec100d-9366-48a0-a78c-20aad23fbb47)
fig:Product Review Empty color
STEP 17:
Click on Save.
Click on Publish to apply the changes to your website.
The changes have been published successfully.
Last modified 1mo ago