Return to previous page

Add to cart button alignment - by SBB - on WordPress WooCommerce support

This topic has 12 replies, 3 voices, and was last updated 5 years, 2 months ago ago by Rose Tyler

SBB

Participant

February 13, 2019 at 02:49

Hello,

Any easy way how to align Add to cart button in shop if you have different variable and simple products? I know there exists plugins(like woo align buttons) to do this but prefer not to use one if not needed for x-store theme.

Example in private area.

thanks,
tomas

Please, contact administrator
for this information.

#209080 Copied Theme version: 5.1.6 WooCommerce version: 3.5.4

11 Answers

John Holden

Support staff

February 13, 2019 at 05:27

Hi,

That caused by the length of product title. You can use this option to limit characters http://prntscr.com/mkd5hw

Regards,

#209087 Copied

SBB

Participant

February 13, 2019 at 08:54

Hi Hung,

Already tried that, it looks that it does nothing and in addition I don’t think that product title length is only issue. As you can see on picture some products have variables like SIZE and COLOR or other, while some of them don’t. Obviously that cause a difference as well.

thanks,
t.

Please contact administrator
for this information.

#209107 Copied
Rose Tyler

Support staff

February 13, 2019 at 09:12
Hello,

Please add this code in Theme Options > Custom css > Global custom css:
```
.content-product .st-swatch-in-loop {
    margin-top: 20px;
    min-height: 65px;
}
.content-product .product_type_simple.add_to_cart_button {
    margin-top: 99px !important;
}
.content-product .product-title a {
    min-height: 45px;
}
```
Let me know the result.

Regards
#209109 Copied
SBB

Participant

February 13, 2019 at 11:40

Hello Rose,

Doesn’t seems to help. I have tried two different browsers and cache cleared.

I share login details in private area in case you want to check if I put css code right(I believe I did).

Thanks,
Tomas

Please contact administrator
for this information.

#209134 Copied

Rose Tyler

Support staff

February 13, 2019 at 11:45

Hello,

Here what I can see on your site after clearing the cache https://prnt.sc/mkhi9d

Regards

#209135 Copied

SBB

Participant

February 13, 2019 at 12:57

Hello Rose,

Cool, just came back from lunch and can see also change… I also cleared browser page before but could not see difference, not sure why. Anyway looks this works now, thank you.

This option to limit length of product title which shown me your colleague Hung = https://prnt.sc/mkd5hw

I have set it to 100 char limits but looks it don’t cut the title.

Should not limit those titles? https://prnt.sc/mkim9v

We will make shorter titles but might be good if in case we go above some limit it is cut automatically.

Thanks,
Tomas

#209139 Copied

Rose Tyler

Support staff

February 13, 2019 at 13:15

Hello,

Likely you don’t have titles with length 100 and more symbols. Try to set Product title chars limit – 10. Then clear cache and check.

Regards

#209144 Copied

SBB

Participant

February 13, 2019 at 13:52

Hi Rose,

Gosh, I am dummy. My apologize for wasting your time. Thanks 🙂

Hopefully last question. Can i change those pictures which overlay pictures when they are “out of stock” or “stock available on backorder” ?

Thank you,
Tomas

#209148 Copied
Rose Tyler

Support staff

February 13, 2019 at 14:05
Hello,

“Out of stock” label can be disabled in Theme Options > Shop elements > Sale & Out of Stock.
If you want to change the style of the label, add code like this http://prntscr.com/mkjrwf in Theme Options > Custom css:
```
.content-product .stock, .content-product .available-on-backorder {
    color:  white;
    background-color: red;
}
```
Regards
#209149 Copied
SBB

Participant

February 13, 2019 at 14:48

Thank you very much.

#209155 Copied

Rose Tyler

Support staff

February 13, 2019 at 14:53

You’re welcome!

Regards

#209156 Copied
Viewing 12 results - 1 through 12 (of 12 total)