display product variations selector on non-woocommerce page

Resolved aguapanelacc
(@aguapanelacc)

3 years, 10 months ago

Hello,

I have created custom single product pages with elementor instead of using the standard woocommerce shop single product page, and have used the [add_to_cart] shortcode for visitors to buy the product.

But I have several products that would first need to display the variation (color/size) selector before being able to press the add to cart button. How can I add these variations (dropdown) select inside the header before the [add_to_cart] shortcode?

see the current page: https://culto.pro/silca-pista/

and Ideally it would look like this: https://www.bigcommerce.com/blog/wp-content/uploads/2018/02/Ecommerce-Product-Pages-Examples-8-1.jpg

searched for shortcodes, plugins and other work arounds but can’t find the answer. Any help is much appreciated!

The page I need help with: [log in to see the link]

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

Plugin Support Tseten a11n
(@tibetanitech)

3 years, 10 months ago

Hi @aguapanelacc!

I recommend checking Variation Swatches and Photos to display your variations look like the link that you’ve shared.

Here is a link to the demo page for this extension: https://elementstark.com/woocommerce-extension-demos/product/color-swatches-attribute-combinations-copy/

I’m not sure how this will be applied in shortcode though. If you want to try any of our products, please note we have a 30-day refund policy. If the product doesn’t work the way you need or you think another product would work better, we are more than happy to offer a full refund. You can read more about our refund policy on our website here: http://woocommerce.com/refund-policy/

Thanks!

Thread Starter aguapanelacc
(@aguapanelacc)

3 years, 10 months ago

Hello Tseten D,

thanks for your reply, but this is just a plugin inside the woocommerce single product page, correct? My question is, how can I display these swatches on a landingpage so visitors can directly select their size or color and add that item to their cart without visiting the woocommerce standard single product pages.

Plugin Support Tseten a11n
(@tibetanitech)

3 years, 10 months ago

Yes, Variation Swatches and Photos displays the variations in the product page, I was not able to find a plugin that might work for you. I recommend customizing WooCommerce to achieve your goal.

You can learn more about WooCommerce Hooks here:

https://docs.woocommerce.com/document/introduction-to-hooks-actions-and-filters/

and Template structure & Overriding templates via a theme:

https://docs.woocommerce.com/document/template-structure/

If you’re looking for custom code help, you might be able to find someone willing to volunteer their time and knowledge in the free PHP support forum at PHP Builder or within the Advanced WooCommerce group on Facebook.

For assistance with customization or development with your site, we recommend reaching out to someone on our customizations page.

AJ a11n
(@amandasjackson)

3 years, 9 months ago

We haven’t heard back from you in a while, so I’m going to mark this as resolved – if you have any further questions, you can start a new thread.

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

The topic ‘display product variations selector on non-woocommerce page’ is closed to new replies.

Tags