Support » Plugin: WooCommerce » I can change size to the Price in Product Page

  • Resolved fancypepper

    (@fancypepper)


    Hi all,

    I’m trying to style ALL PRODUCT PAGES by increasing the size of the Price that appears after the user choose the bag size.
    I tried to add different Custom CSS solutions (in Customize view), but none worked; here’s the last one I tried (not working):

    .single-variation-wrap div.woocommerce-variation-price {
    font-size: 200%;
    }

    Can anyone help me with some CSS to increase the size of that price?

    Thanks,
    FP

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
  • Thread Starter fancypepper

    (@fancypepper)

    Sorry, typo in the title: I CAN’T change the size of the Price in Product Page

    .woocs_price_code {
      font-size: 200%;
    }
    Thread Starter fancypepper

    (@fancypepper)

    HI Iorro,

    thanks for replying, I tried that one too but actually it doesn’t work either.
    Any other suggestion?

    Thanks
    FP

    Thread Starter fancypepper

    (@fancypepper)

    Let me specify that I tried all the following, none is working:

    .woocommerce ul.products li.product .price {font-size: 200%;}

    .woocs_price_code {font-size: 200%;}

    .single-variation-wrap div.woocommerce-variation-price {font-size: 200%;}

    span.woocommerce-Price-amount.amount {font-size: 200%;}

    #top .price span {font-size: 200%!important;}

    .woocommerce .price {font-size: 200%!important;}

    .woocommerce div.product .summary .price>.amount,
    .woocommerce div.product .summary .price>ins>.amount {font-size: 200%!important;}

    .single-product .entry-summary .price span {font-size: 200%!important;}

    .single-product .woocommerce-Price-amount.amount .woocommerce-Price-currencySymbol {font-size: 200%!important;}

    .product .woocommerce-Price-amount {font-size: 200%!important;}

    .single-product .dfd-price-rating-wrap > .price-wrap .price .amount {font-size: 200%!important;}

    None of those seems to work in Custom CSS while I’m editing in the Customize view. May it be an issue with the Custom CSS ?
    Anyone can provide support for this?

    Thanks a lot,
    FP

    Please deactivate litespeed cache and leave it off until development is complete. It may be masking the changes you are making.

    Please copy and paste the entire css from the Additional CSS field to here:
    http://validator.w3.org/#validate_by_input
    and make sure it validates.

    Please put my css suggestion back in. If its not working come back so I can debug it.

    Thread Starter fancypepper

    (@fancypepper)

    ok I’ve deactivated litespeed cache, validated all the Custom CSS code (it’s valid) and added this part at the bottom:

    .woocs_price_code {font-size: 200%;}

    Still not working…

    Thank you,
    FP

    There’s no closing bracket on the “Change Archive layout” media query just before the new bit. This means the new bit is included in the media query and so only applies if the viewport is less than 767px. Narrow your viewport below 767px to confirm. It just needs an extra closing bracket before the new bit.

    The custom css is showing as one long line, and this makes reading it difficult. Consider putting the block of custom css through an online beautify to format it nicely with line breaks. Stuff like missing brackets becomes easier to spot.

    Thread Starter fancypepper

    (@fancypepper)

    Hi Iorro,

    finally it’s working! That was exactly the issue, a missing bracket. Thank you very much for your support and suggestions.

    All the best,
    FP

Viewing 8 replies - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.