Announcement

Collapse
No announcement yet.

How to change the Font Color in Featured Product box on Store Front Page

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • How to change the Font Color in Featured Product box on Store Front Page

    How would I change the color of the font in the Featured Products box on the Store Front Page. We have a dark Royal Blue for the Box Color and would like a Golden yellow font. I have attached the code where I believe it should be changed but can't figure it out. This code is from the featured products in the Product List tag of the Levels Ready Theme. I was thinking It would be a html color code and wants to insert #FFD733

    <div class="row product-carousel">
    <div class="column whole hide medium-show medium-two-fifths large-one-fourth">
    <div class="well carrot-right featured-products-descrip" id="js-featured-products-height">
    <h3 class="nm">Rustic Home Decor</h3>
    <div class="sky">&bull;&bull;&bull;&bull;&bull;</div>
    <p><mvt:item name="readytheme" param="contentsection( 'home_featured_products' )" /></p>
    <a href="&mvt:urls:PLST:auto;" class="button button-hollow align-center uppercase featured-products-view-all">View All</a>
    </div>

  • Rodney
    replied
    Thank You!!

    Leave a comment:


  • Matt Zimmermann
    replied
    If you edit the class I mentioned, it will only affect that particular H3.

    Leave a comment:


  • Rodney
    replied
    Am I changing that within the theme.css file or the code in the featured Products? Below is the code in the theme.css file. If I can the h3 there to a golden yellow won't it change the for anything else on the site as a whole that might also be using the h3? Just wanting to make sure I change the font color in the box on the SF page for featured products only.
    bg-3,
    .bg-grey,
    .bg-gray {
    background-color: #a2afbc;
    }
    .color-3,
    .grey,
    .gray {
    color: #a2afbc;
    }
    .bg-4,
    .bg-light-blue,
    .bg-sky,
    .bg-aqua,
    .bg-teal {
    background-color: #4a9dcf;

    Leave a comment:


  • Matt Zimmermann
    replied
    To change the color of the H3, you would add:
    Code:
    color: #fc0;
    Of course, change the value to whatever you want to use.

    Leave a comment:


  • Rodney
    replied
    Ok so I have found this code and just not quite sure what to change. I believe its the h3 which is the grey and the sky is the light blue. But do I insert a html color code there and replace the H3 and Sky. I see in the theme.css file that the h2 in a lime green, Even that would work. I did change the h3 to h2 but it did not change the font color in the box.

    Leave a comment:


  • Matt Zimmermann
    replied
    In your theme.css file, you can add or modify the colors used on the site. For this section, find the class .featured-products-descrip > h3

    Leave a comment:

Working...
X

This website uses cookies to identify visitors, track visitors to our website, store login session information and to remember your user preferences. By continuing to use this site you agree to our use of cookies. Learn More.

This website uses cookies. By continuing to use this site you agree to our use of cookies. Learn More.

Accept