Shopify themes, liquid, logos, and UX
How can i change the Text color like in this picture in the slideshow ?
thanks in advance
Hi @Martin299 ,
To achieve the text styling as shown in the image for your slideshow, where specific words are highlighted with a different color, you can use a combination of HTML and CSS.
For Example:
html:
<div class="slideshow-text">
From Our <span class="highlight">Hive</span> to Your <span class="highlight">Kitchen</span>
</div>
css:
.slideshow-text {
font-size: 2em; /* Adjust size as needed */
color: white; /* Default text color */
}
.slideshow-text .highlight {
color: #f8981d; /* Highlight color, similar to the one in the image */
}
Refer to this code and modify the text as needed to match the image.
I hope this helps! If not, please provide url and password of website.
If it does, please like it and mark it as a solution!
If you need further assistance, feel free to reach out!
Regards,
Sweans
where are i have to put these two words ?
Hi @Martin299 ,
Please provide the URL and password of your store so I can assist you further
Regards,
Sweans
Hi @Martin299 ,
Follow these steps:
1.Go to your Shopify admin panel.
2.Navigate to Online Store > Themes.
3.Find your theme and click on Customize.
4.Click Actions > Edit code.
5.In the left sidebar, under the layout directory, click on image-banner.liquid.
6.Search for the following code:
<h2
class="banner__heading inline-richtext {{ block.settings.heading_size }}"
{{ block.shopify_attributes }}
>
{{ block.settings.heading }}
</h2>
7.Replace it with the code below:
<div class="slideshow-text">
<h2>
Goûtez Le Vrai <span class="highlight">Miel et</span> Découvrez Avec Nous Les Secrets <span class="highlight">Des Abeilles</span>
</h2>
</div>
*You can adjust the <span> tags according to your design.
8. Add the following code to your base.css file:
.slideshow-text .highlight {
color: #f8981d; /* Highlight color, similar to the one in the image */
}
I hope this helps! If it does, please like it and mark it as a solution!
If you need further assistance, feel free to reach out!
Regards,
Sweans
Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024In today’s interview, we sat down with @BSS-TekLabs to discuss practical strategies for...
By JasonH Nov 13, 2024The year-end shopping spree is around the corner! Is your online store ready for the ...
By JasonH Nov 10, 2024