Okay
  Public Ticket #1731611
Price typo size
Closed

Comments

  • believesupplements started the conversation
    October 1, 2018 at 7:32pm

    Hey guys,

    Anyway I can increase WooCommerce Product title size and change font (price also)

    I added this to my css but it doesnt seem to be working since I updated my theme:

    /* Change the Product title */
    .woocommerce .product_title{
        font-family: roboto; /* Change the font */
        font-size: 50px;/* Change the font size */
        line-height: 40.5px;

    /* Change the Product price */
    .woocommerce .price span{
        font-family: roboto; /* Change the font */
        font-size: 24px; /* Change the font size */


  •  8,997
    Tahir replied
    October 1, 2018 at 8:34pm

    Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):

    .single-product div.product h1.product_title {
    font-size: 30px !important;
}
.woocommerce .price span {
    font-family: roboto !important;
    font-size: 24px !important;
}

    Thanks

    ThemeNectar Support Team 

  • Petfar replied
    October 29, 2018 at 2:14pm

    Hello,

    thank you for these fonts changes, I would like to change also the size of :

    - quantity of product

    - size, color and shape of buton add to cart

    Where could I change that ? or which CSS should I use ?

    Thank you in advance

    Kind Regards,

    P.

  • Petfar replied
    October 30, 2018 at 9:56am

    Hello,

    I was able to change a bit the style of Add To Cart button by this CSS :

    .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit, .woocommerce #content input.button, .woocommerce-page a.button, .woocommerce-page button.button, .woocommerce-page input.button, .woocommerce-page #respond input#submit{
        background-color: #fff !important;
        color: #FFFFFF !important;
        border: 2px solid #000 !important;
        font-size: 13px !important;
    }
    But I'am still looking for :

    1/ Button

    changing the shape of the button : round corner, smaller size or padding

    2/ Padding between items : reduce padding between Title, variable attributes, price, quantity, ...

    3/ Reduce de size of the quantity button , I know it is "size" attribute to be change, but in which CSS class?

    Thank you for your help

    Kid Regards,

    P.


  •  8,997
    Tahir replied
    October 30, 2018 at 6:52pm

    Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):

    .woocommerce .single-product-summary .entry-summary p {
    padding-bottom: 10px;
}

    Thanks

    ThemeNectar Support Team 

  • Petfar replied
    October 31, 2018 at 11:42am

    Hello,

    thank you, but it didn't work, do you have another CSS ?

    I tried allready with "

    !important;

    "

    .woocommerce .single-product-summary .entry-summary p {
        padding-bottom: 4px !important;
    }

    and about :

    1/ round the corner of the Ad To Cart button?

    2/ Reduce de size of the quantity button (- 1 +) ?

    thank you a lot in advance

    Kind Regards

    P.

  •  8,997
    Tahir replied
    October 31, 2018 at 12:04pm

    Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):

    .woocommerce-page button[type="submit"].single_add_to_cart_button, body[data-form-submit="regular"].woocommerce-page .container-wrap button[type=submit].single_add_to_cart_button, .ascend.woocommerce-page .container-wrap button[type="submit"].single_add_to_cart_button, body[data-button-style="rounded"].ascend.woocommerce-page .container-wrap button[type="submit"].single_add_to_cart_button {
    border-radius: 5px!important;
    -webkit-border-radius: 5px!important;
    -o-border-radius: 5px!important;
}
html .woocommerce .cart .quantity input.plus, html .woocommerce .cart .quantity input.minus, .nectar-quick-view-box .cart .quantity input.plus, .nectar-quick-view-box .cart .quantity input.minus, .woocommerce div.product div.images .woocommerce-product-gallery__trigger {
    border-radius: 5px!important;
    -webkit-border-radius: 5px!important;
    -o-border-radius: 5px!important;
}

    Thanks

    ThemeNectar Support Team 

  • Petfar replied
    November 7, 2018 at 12:04pm

    Hello,

    there are no red crosses but still it doersn't seems to work :(

    thank you for your assistance

    Kind regards

    P.

  •  8,997
    Tahir replied
    November 7, 2018 at 8:17pm

    Those css work in the Live Browser so its likely not getting added on the Frontend.

    Please clear your cache using this guide: https://themenectar.ticksy.com/article/6226/ and have a look at this Article: http://themenectar.com/docs/salient/updating-salient/#troubleshooting .

    Best.

    ThemeNectar Support Team 

  • Petfar replied
    November 12, 2018 at 5:22pm

    Hello,


    sorry regarding the add to cart button it worked now I've got the round corner arround the button

    thank you

    but I still have lots of empty spaces  between:  title, variable attributes, description ...

    I could I shorten theses empty spaces ?

    thank you 

    P.

  •  8,997
    Tahir replied
    November 13, 2018 at 2:46pm

    Unfortunately that is how its designed . You can try third party plugins to alter it as per your liking. See url or similar: https://wordpress.org/plugins/woocommerce-customizer/ .

    Best

    ThemeNectar Support Team