Woocommerce Single post view customization

wudza
(@wudza)

13 years, 1 month ago

Hi dear all!
I need to fix an issue with post layout of [add_to_cart id=””] shortcode of Woocommerce
Please see the screen:
– I need delete border
– I need move Add to cart button to right border of the post
– I need to move Price right to Add to cart button
link to image: here
link to post: here

I’m kind of new to coding, can anyone help with code to custom.css file?
Thanks in advance

PS
Firebug manual changing

element.style {
border: 4px solid #CCCCCC;
padding: 12px;

to

element.style {
border: 0px solid #CCCCCC;
padding: 0px;

Hides border but how can I move everything to right boarder of the post ?

Viewing 8 replies - 1 through 8 (of 8 total)

Thread Starter wudza
(@wudza)

13 years, 1 month ago

Updated: this is single post page (not the page product)

michaelphipps
(@michaelphipps)

12 years, 10 months ago

Might be too late for Wudza, but for anyone else who has this problem, add this to the shortcode to remove the style:

[add_to_cart id="XX" style=""]

You can pass your own css style info to format the button like this:

[add_to_cart id="XX" style="padding:10px; background:#e0e0e0"]

I hope it helps.

Thread Starter wudza
(@wudza)

12 years, 9 months ago

Yepp quete a sure shot – thanks Michael!
no annoying’ border around!

sarveshjangid
(@sarveshjangid)

12 years, 7 months ago

Very Thanks michaelphipps
I spent 2 days to remove this border…
Great help 🙂

4Mulator 💫
(@4mulator)

12 years, 6 months ago

Wow thanks! I was also having the same issue.

Any ideas as to how to hide the price and just have the Add to Cart button show?

I’ve tried,

[add_to_cart id=”99″ noprice=””]
[add_to_cart id=”99″ showprice=”no”]

jonnybear83
(@jonnybear83)

12 years, 3 months ago

.product .amount, .woocommerce .from {
display: none;
}

The CSS removes the price from the button but also everyhere else in the site. I’m having the same issue.

Gammangovski
(@gammangovski)

12 years, 3 months ago

Hi, I’ve had the same problem but I’ve just resolved it. Under the text tab create a new div class

<div class=”newclass”></div>

then switch to visual tab and insert your shortcode. Looking back at the text mode you should see something like:

<div class=”newclass”>[add_to_cart id=”XXXX” sku=””]</div>

Now on the css add:

.newclass .amount {display:none;}

Hope this works for you.

4Mulator 💫
(@4mulator)

12 years, 3 months ago

Thanks jonnybear83 and gammangovski,

Gonna try these suggestions and see what works