Change size button – Products page

[LLoomParticipant Purchased]

Hi,

I need to to reduce the size of the “add cart” button in the product page.

How can I do it?

Thanks,

LL

[SeaThemeKeymaster PurchasedSupported]

Hi,

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 – Facebook

[LLoomParticipant Purchased]

hi,

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

[SeaThemeKeymaster PurchasedSupported]

Please use the custom CSS to remove “Description”, “Additional information” and category/sku:

.tab-content > .tab-pane > h2,
.product-single .product_meta {
    display: none;
}

[LLoomParticipant Purchased]

This reply has been marked as private.

[SeaThemeKeymaster PurchasedSupported]

It shows 502 Bad Gateway when I clicked Enter with the password

[LLoomParticipant Purchased]

This reply has been marked as private.

[SeaThemeKeymaster PurchasedSupported]

1. 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 9 months, 1 week ago by  SeaTheme.

[LLoomParticipant Purchased]

Hi,

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

[SeaThemeKeymaster PurchasedSupported]

Welcome.
You could add text in CSS like:
#tab-additional_information:after{content:'xxxx';}
It will show on all products.

[LLoomParticipant Purchased]

Hi

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

[SeaThemeKeymaster PurchasedSupported]

Hi, 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~

[LLoomParticipant Purchased]

This reply has been marked as private.

[Author]

Posts