Add to Basket Buttons in Crafty

[OZLIGHT]

Hello Themeco team.

The Add to Basket buttons on shop and archive pages have been hidden in the Crafty Theme. I’ve unhidden mine - I want to see them. Just wondering if someone could help me get them back into a regular position - like below the price? (Or below the product title)

They are currently sitting in the middle of my product images which isn’t great. I’m sure it’s probably quite a simple CSS task - I’m just a bit lost.

Help Appreciated.
Dave

[prakash_s]

Hello @OZLIGHT,

Thanks for writing to us.

To move the Add to Cart button down after the price you need to use this custom CSS code under Theme Options—>CSS

.woocommerce.woocommerce-page li.product .entry-header a.button {
position: relative;
top: auto;
left: 0;
right: 0;
margin: 0;
display: block;
opacity: 1;
}

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.In case if you have no idea about coding you can subscribe to One where customization questions are answered.

Hope it helps.
Thanks

[OZLIGHT]

Hello @prakash_s,
Thank you for your reply. Sadly, that didn’t work. I’m wondering if it’s being overwritten somewhere else? I also tried adding !important after each, still no joy.
Dave

TPCLtd Shop • London • Cake Mixers • Kitchen Appliances • Bakeware • Cookware

[ruenel]

Hello @OZLIGHT,

You have applied the code incorrectly. When properly placed in the correct CSS section, it should look like this:

Be advised that any custom coding, you should maintain and always make sure that you have added the code correctly and that it does not create issues with theme styles and/or conflict in your site.

You can provide us access to the site so we can double check your coding. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
- Confirmation that we can access and make changes to your site
​

To know how to create a secure note, please check this out: How The Forum Works

Best Regards.

[OZLIGHT]

Hello @ruenel,
I’ve applied the code as given (without the opacity line because I prefer the button to appear on mouse over - as it does).
It does work on the shop & archive pages. However it doesn’t work anywhere i’ve added a Woocommerce Product shortcode - Homepage (and many others) for example.
As a matter of security, i’m not in the habit of giving out my admin details.

[prakash_s]

Hello @OZLIGHT,

I would suggest you replace the code with the given code, it would work on all the other pages as well.

[class*=woocommerce] li.product .entry-header .button {
position: relative;
top: auto;
left: 0;
right: 0;
margin: 0;
padding: 0.45em 0.5em 0.575em;
display: block;
font-size: 14px;
opacity: 1;
}

I checked your site it seems that you are using the WP-Rocket cache plugin, I would suggest you please purge all the cache and clear your browser cache then check it again.

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.In case if you have no idea about coding you can subscribe to One where customization questions are answered.

Hope it helps.
Thanks

[OZLIGHT]

Thank You @prakash_s - That was exactly what I was after.

[tristup]

Hi @OZLIGHT,

Glad that we are able to help you.

Thanks