[Resolved] woocommerce shop page

[Jusung]

Hello.

On this page, I am trying to put the view product button next to the price. but It doesn’t work.

.woocommerce-loop-product__title {
text-align: left;
}
.woocommerce-product-details__short-description {
text-align: left;
}
.price {
float: left;
}
.addtocartbutton {
float: right;
}

This is my trying. I use php code to add view product.

[David]

Hi there,

its not really possible, as the Product is wrapped inside an <a> link, and you would have to add your <a> inside that. Which would be invalid HTML, and your link would not do anything…

[Jusung]

Hello.

Now, I wrapped the View button by div
and I wrapped the total purchase and total review by div.

Can I align total purchase and total review on the left side and put the view button on the right side?

If can’t, how I have to make those 3 elements./?

[Fernando]

Hi Jusung,

This is what I see: https://share.getcloudapp.com/Qwu8vzEv

They appear to be aligned the way you want them to be. Would you still need assistance regarding this?

[Jusung]

Yeah I am trying to fix it on my own in real time.
and it seems working.. I am not sure if this do being done in the right way..

One problem is that there seems to be margin on the view button.
I want to meed the end of view button and review..

[Fernando]

Can you re-phrase or explain this a bit more?: “I want to meed the end of view button and review”

[Jusung]

I mean the end of the number of review and the button should be the same.

but right now, it is not the same. The button should be more upsided.

[Fernando]

Try adding this through Appearance > Customize > Additional CSS:

.page-id-201 ul.products li.product .button.addtocartbutton {
    margin-top: 0;
}

[Jusung]

Thank you!!

[Fernando]

You’re welcome, Jusung!

[Author]

Posts