How to manually trigger add to cart function?

  • Posts: 19
  • Thank you received: 3
1 year 2 months ago #355882

-- HikaShop version -- : 4.7.5
-- Joomla version -- : 4.3.4
-- PHP version -- : 8.0.27
-- Browser(s) name and version -- : Chrome

Hi,

we have a small number of products and we're using SP Page Builder to design richly formatted product pages that our marketing team can easily maintain.

For this purpose, we would like to trigger add to cart function manually when the user clicks "Add to Cart" button on this page, as we are no longer relying on native HikaShop product pages.

Is there a JavaScript API that would allow us to do this? For example, we would like to call a function that would contain a product id, quantity and any custom fields the user selected.


Thank you!

Please Log in or Create an account to join the conversation.

  • Posts: 83007
  • Thank you received: 13400
  • MODERATOR
1 year 2 months ago #355891

Hi,

What I would recommend is to use a content tag to let HikaShop display the add to cart button where you want it:
www.hikashop.com/support/documentation/1...-product-insert.html

HikaShop has an addToCart javascript function.
However, the parameters is has are not the ones you're expecting.
It's the function window.hikashop.addToCart in the file media/com_hikashop/js/hikashop.js
The first parametre of that function needs to be an element of the DOM (this usually is the add to cart button itself) with an attribute href with the add to cart URL, a data-addToCart attribute with the id of the product. You can leave the second and third parameters empty (null), and set the fourth one to a string of HTTP parameters like so: 'quantity=1&xxx=yyy&aaa=bbb'

Please Log in or Create an account to join the conversation.

  • Posts: 19
  • Thank you received: 3
1 year 2 months ago #355904

Thanks a lot, I will review and get back to you if I have any questions.

The following user(s) said Thank You: Philip

Please Log in or Create an account to join the conversation.

  • Posts: 19
  • Thank you received: 3
1 year 2 months ago #355974

Hi, I was looking at this in more detail.

Ideally, I would use the product tag feature, but it seems it renders a "Choose Options" button in case the product has variants.

For example, here is the product page I have: prnt.sc/CIixiGLqgedR

I want to be able to create an "Add to Cart" tag that specifies the value of the "CSWS Date" upfront, so the customer can pick the desired variant straight from the Add to cart button. Imagine having two buttons that say:

1. Add to Cart (Nov 13 & 17)
2. Add to Cart (Nov 20 & 24)

...each of which adds a specific variant to the cart.

Is this possible via tags? If not, what would be the advised approach for doing this via Javascript?

Thanks a lot for your help and support.

Please Log in or Create an account to join the conversation.

  • Posts: 83007
  • Thank you received: 13400
  • MODERATOR
1 year 2 months ago #355978

Hi,

I don't see a problem with doing this with content tags.
However, of course, you need to provide the id of the variant, not the id of the product in your tag.
If you provide the id of the product with variants, the system will display a "choose options" button since it doesn't for which variant you're creating the button.

Please Log in or Create an account to join the conversation.

Time to create page: 0.062 seconds
Powered by Kunena Forum