Nova 2023 series themes apply a default grey text color to product descriptions to create a subtle contrast with headings. However, some merchants may prefer to change the text color to black for improved readability. Follow the steps below to modify the text color.
Note
- This solution applies to Nova 2023 series themes, including Nova2023, Night, Sweet, Morning, Bamboo, Moon, Beautynow, and Elechub.
- If you experience display issues after applying the code, it may be due to theme version incompatibility or conflicts with other custom code. In such cases, remove the added code immediately. If you are unfamiliar with coding, we recommend consulting a developer or someone with coding experience to ensure the modifications do not cause issues with your theme.
Removing the default product description text color
By default, product descriptions in Nova 2023 series themes are displayed in a grey color to create a subtle contrast. If you prefer a stronger contrast with black text for better readability, follow these steps to update the text color.
1. Access the app store: Log into your Shoplazza admin, navigate to Apps, and click on Visit App Store.
2. Find the app: Enter Custom Code in the search box, then click Add app.
3. Install the app: Click the Install app button to complete the app installation. This will allow you to start embedding custom scripts easily.
Adding the custom code
After installing the Custom Code app, you will need to add a script to change the text color. Follow these steps to ensure the modifications apply correctly.
1. Add the custom code: Open the Custom Code app and click + New code.
2. Enter code details: Name your script and copy and paste the following code:
<style>
.product-desc-container .product-desc-item-content {
color: var(--color-body-text) !important;
}
</style>
- Select both PC and Mobile as user-end options.
- Set the Trigger to Product landing pages.
- Choose Top as the Code position.
- Click Save.
Effect after removing the overlay
Once the code is applied, the product description text will change from grey to black. If you wish to revert to the default grey text, simply disable this code.
Before changing the text color
After changing the text color
The default grey text offers a soft contrast, while black text provides a bolder, more readable appearance. Choose the style that best aligns with your brand’s aesthetics and customer experience. This flexibility allows you to adapt your store’s design to match your unique vision.
Comments
Please sign in to leave a comment.