Displaying WooCommerce product image through shortcode

Support
#1

Hey. I looked up the WooCommerce shortcode for placing a product ID into a page designed with Pro Builder, yet it’s small and doesn’t show the full product image. Would someone please tell me the adjustment that I can do to show the full image (or a thumbnail at least)

Here’s the example, scroll to the bottom --> (right under TAKE THIS COURSE)

https://intothemythica.com/course-deva-yoga/

#2

Hi There,

Please find this custom CSS:

.has-post-thumbnail img.wp-post-image {
    display: none !important;
}

And change to this:

.single-post .has-post-thumbnail img.wp-post-image {
    display: none !important;
}

After that adding this custom CSS:

.x-text .woocommerce li.product {
    width: 100%;
}

Hope it helps :slight_smile:

#3

Mmm… the first bit of code doesn’t exist in my CSS Custom.

The second bit of code erases the post thumbnail, but I don’t need that right now.

The third bit of code (.x-text .woocommerce li.product … etc. ) DOES work, yet for some reason it isn’t showing the proper product relative to the code.

Example –

When I input the product shortcode on my page, it shows a different product. This is the code I put in -->

and this is the display I’m getting. clearly NOT the same product, nor with the same product ID

https://intothemythica.com/author-peter-fae/

also when the product shows the ‘add to cart’ or ‘pre-order now’ green/red button, it cannot be clicked. normally clicking the product does work, though it is not the correct product according to the product ID

???

#4

Hi again,

I see pretty quotes in your shortcode, that might be causing the issue. Please replace your code with the following code:

[product id="18676"]

Let us know how this goes!

#5

that did it. however, the ‘add to cart’ is still not working.

#6

Hi There,

Please change the previous CSS to this:

.single-post .has-post-thumbnail img.wp-post-image {
    display: block !important;
}
.x-text .woocommerce li.product {
    width: 100%;
}

Let us know how it goes!

#7

mmmm I’m noticing that it actually shows up in the cart, it just doesn’t go to the cart page immediately when I click on it. So, I suppose it’s okay.

#8

Glad that we could be of a help :slight_smile:

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.