Home › Forums › Art WordPress Theme › Change size button – Products page
This topic contains 12 replies, has 2 voices, and was last updated by LLoom 1 day, 7 hours ago.
-
AuthorPosts
-
February 8, 2019 at 12:56 pm #17754
Hi,
I need to to reduce the size of the “add cart” button in the product page.
How can I do it?
Thanks,
LL
February 9, 2019 at 5:13 am #17756Hi,
Do you talk about the single product page?
Please paste the custom css code to “Appearance > Customize : Additional CSS”
.woocommerce button.button.single_add_to_cart_button { font-size: 12px; height: 30px; line-height: 30px; padding: 0 10px; } .woocommerce #content .quantity input.qty, .woocommerce .quantity input.qty, .woocommerce-page #content .quantity input.qty, .woocommerce-page .quantity input.qty { font-size: 12px; width: 30px; line-height: 30px; height: 30px; }
Regards!<br>
Bwsm – uiueux.com – Twitter – FacebookFebruary 10, 2019 at 3:22 pm #17765hi,
Thanks. It works pefect.
Is it possible to remove the title of the “Description” and “additional information” under the picture in the single product page?
Also to remove the information about “Category”, “Sku”
Regards,
LL
February 11, 2019 at 7:30 am #17769Please use the custom CSS to remove “Description”, “Additional information” and category/sku:
.tab-content > .tab-pane > h2, .product-single .product_meta { display: none; }
February 11, 2019 at 4:23 pm #17774This reply has been marked as private.February 12, 2019 at 5:20 am #17775It shows 502 Bad Gateway when I clicked Enter with the password
February 12, 2019 at 10:29 am #17781This reply has been marked as private.February 13, 2019 at 4:43 am #177841. Please use the custom CSS to remove table:
.tab-pane .shop_attributes { display: none; }
It’s not possible to add more text as I know.
2. To reduce font size:
.cart-collaterals .cross-sells h2, .entry .cart_totals h2, .woocommerce.woocommerce-cart table.shop_table thead, .woocommerce-page.woocommerce-cart table.shop_table thead, .entry .lined-heading, .entry .cart-summary h3, h3#order_review_heading, .entry #ship-to-different-address > label, .cart-empty, .entry h3#login-form-modal { font-size: 11px; }
To reduce button size, it should affect other buttons of Woo:
.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, .woocommerce-page #content input.button { height: 30px; line-height: 30px; padding: 0 12px; font-size: 12px; }
3. The border width has been 2px and 1px now, The current CSS is:
You could change the vaule as what you want.woocommerce table.shop_table thead th, .woocommerce-page table.shop_table thead th, .woocommerce.woocommerce-cart table.shop_table, .woocommerce-page.woocommerce-cart table.shop_table { border-bottom-width: 2px; } .woocommerce.woocommerce-cart .cart_totals table.shop_table, .woocommerce-page.woocommerce-cart .cart_totals table.shop_table { border-top-width: 2px; } .woocommerce-page table.shop_table tbody td, .woocommerce-page table.shop_table tbody th { border-bottom-width: 1px }
To reduce the table text, use custom CSS:
.woocommerce.woocommerce-cart table.shop_table, .woocommerce-page.woocommerce-cart table.shop_table,.woocommerce input { font-size: 11px; }
4. To align, use the custom CSS:
.product-single .variations label { padding: 0; } .woocommerce button.button.single_add_to_cart_button { margin-left: 0; }
Font size:
.woocommerce-variation > div { font-size: 14px; } .woocommerce .nav-tabs > li > a, .tab-content>.tab-pane { font-size: 11px; }
-
This reply was modified 1 week ago by
BWSM.
February 13, 2019 at 4:49 pm #17791Hi,
First of all, sorry for the incovenience and thanks for the support.
It will be possible to add in the css text in the “aditional information” if this text will be the same for all the products?
Thanks,+
LL
February 14, 2019 at 1:34 am #17793Welcome.
You could add text in CSS like:
#tab-additional_information:after{content:'xxxx';}
It will show on all products.February 14, 2019 at 10:24 am #17794Hi
Thanks, it works perfect.
One more thing, when the product is variable and I apply an image to each variation then the images are not show in the website when you click in the different variations, do you know the reason?
Thanks.
LL
February 14, 2019 at 10:26 am #17795Hi, welcome.
It needs to recover the Woo function, please refer to this post: https://www.uiueux.com/forums/topic/woocommerces-variable-product-and-product-gallery-display/#post-15480
Regards~
February 19, 2019 at 9:59 pm #17862This reply has been marked as private. -
This reply was modified 1 week ago by
-
AuthorPosts
You must be logged in to reply to this topic.