Support » Plugin: WooCommerce » Customize return on woocommerce?

  • Resolved baristol

    (@baristol)


    Hello there!
    So my question is simple but i have no idea how to achieve it.
    I just want to create a custom function (or maybe it can be fixed with just css) in order to get a different return when I use the [products] shortcode. The thing is that when you use this shortcode it passes the whole product info, and I just want to display the name, the price and the add to cart button, WITHOUT IMAGE, this is the main issue for me, cant find where to do that.

    In the end, it will be used like this:
    Section with other stuff/
    [products tag=”mytag” columns=”1″]
    /section

    Right now the outcome is this:
    Section with other stuff/
    Product_1_image (that covers the whole page)
    Product_1_name product_1_price product_1_addtocartbutton
    Product_2_image (that covers the whole page)
    Product_2_name product_2_price product_2_addtocartbutton
    and so on
    /section

    And the outcome should be like this:
    Section with other stuff/
    Product_1_name product_1_price product_1_addtocartbutton
    Product_2_name product_2_price product_2_addtocartbutton
    and so on
    /section
    The point is to integrate a set of rows with different products inside other content. If it is important im using elementor at the moment to build the page.
    Please help, I have literally no idea how to do this.

Viewing 7 replies - 1 through 7 (of 7 total)
  • Hi there! One way to do this would be to use the add-to-cart shortcode instead, which outputs the price and button only. Then you could just add in the product name manually.

    For example:

    Product Name
    [add-to-cart id="123"]

    Related docs: https://docs.woocommerce.com/document/woocommerce-shortcodes/#section-15

    Thread Starter baristol

    (@baristol)

    I thought of that, but I wanted to set it up automatically since the page will be updating products constantly and the person in charge has little to no idea how to do it 😅

    OK, in that case, you’ll likely want to use CSS to hide the images. I did a quick test, and there’s no default class that wraps the output of the [products] shortcode, but if you know the id if the page, you could do it pretty easily for that specific page.

    For example, for page ID 123, you could go to Appearance > customize > additional CSS and add this:

    .page-id-123 .product img { display:none; }

    Thread Starter baristol

    (@baristol)

    It’s nor working for me… Should I import something to the child theme from wc?

    Can you link me to the page, so I can make sure we are targeting the right thing?

    Thread Starter baristol

    (@baristol)

    Nevermind, solved it, just had to add the css inside the coll-o-matic plug in since Im wrapping that section with that. Thanks so much!!

    Great! I’ll close this out, since we got it solved. Have a great day.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Customize return on woocommerce?’ is closed to new replies.