Have your say in Community Polls: What was/is your greatest motivation to start your own business?
Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

GraphQL Storefront API CheckOut and Abandoncart

Solved

GraphQL Storefront API CheckOut and Abandoncart

adamjw3
Excursionist
26 0 7

New to shopify and the graphql api.

 

I've got my products displaying and now just building the cart, any documentation on building the cart to have all the functionality of a liquid built template with abandon cart functionality? Does this require the user to be logged in to an account?

Accepted Solution (1)
KarlOffenberger
Shopify Partner
1873 184 903

This is an accepted solution.

I think anything is possible but you will have to fill in the gaps.

 

You mention abandoned carts. Well, to begin with, carts aren't abandoned. Checkouts are and only if you already provided contact info such as email. Now, if like in most Storefront API examples you decide to have your cart be the checkout object, then you create the checkout object as soon as items are added to the cart.

 

The checkout object does not require an email so if that's all you have so far and the visitor leaves - you do not have an abandoned checkout (or cart) though you could track the visitor and cart token via cookies or otherwise to repopulate their checkout if they return and haven't cleared their cookies. But okay, that's not really pertinent to the Storefront API itself.

 

Say your visitor has a few items in the cart (I am still assuming you will be using the checkout object for that) and in between they decide to register i.e. you create a customer account. You can immediately associate the customer with the checkout now - checkoutCustomerAssociateV2. Or let's say your visitor signs up for a newsletter, thereby providing their email. While not a customer, you can use that email (careful with GDPR if that applies to you) to update their checkout - checkoutEmailUpdateV2. In both cases, you'd now get abandoned checkouts if the checkout isn't completed. And thus the standard abandoned checkout notifications apply.

 

Hope this helps!

View solution in original post

Replies 9 (9)

KarlOffenberger
Shopify Partner
1873 184 903

any documentation on building the cart to have all the functionality of a liquid built template with abandon cart functionality?


Very little. It also depends on how you're implementing it - i.e. language, framework etc. Shopify do have a few quick samples over on github, but that's about it. You will note, that the simpler samples assume the checkout object as a cart which isn't exactly the best way if you want to have full control over the cart. For that, however, you'd need to build out an entire cart frontend and backend as the Storefront API doesn't have any cart specific endpoints.

 


Does this require the user to be logged in to an account?


No.

adamjw3
Excursionist
26 0 7

Thanks.

 

I'm using nextjs on the frontend and yoga-server backend.

 

Any live examples of sites built using the storefront graphql api?

KarlOffenberger
Shopify Partner
1873 184 903

Live examples as in actual stores that are in production and only use Storefront API? Possibly there are some, but I wouldn't know of any.

 

Examples using next.js and graphql-yoga specifically aren't available AFAIK, but next.js being mostly prescriptive React app with SSR and their weird router, graphql-yoga being mostly prescriptive apollo-server with sugar tools and config to get up and running fast, the React + Apollo Client sample from the github repo I linked previously should be closest as examples go.

 

I see this type of question pop up more frequently. It's great to see momentum picking up and more people showing serious interest around Storefront API and leaving the Liquid theme ecosystem behind. I've only done quick throw away POCs around the Storefront API to get acquainted, but IMO, it's not ready for prime time without a lot of effort to patch up the missing and inconvenient bits on top of lack of support and information on how to make anything with it apart from "Look ma, I got XYZ framework working with Storefront API". That said, people like you, willing to go down that road and build real stuff with it is exactly what Shopify needs!

adamjw3
Excursionist
26 0 7

I agree

 

I have a POC storefront working but now want to add in features that are simple in liquid such as abandon cart emails, 

Seems every example is a simple list of products, single product, add to cart, send that off to the shopify standard checkout.

 

Yeah just wanted to look at some real word examples of sites that are live using this.

 

Anyone from shopify want to jump on this and fill us in with whats possible?

KarlOffenberger
Shopify Partner
1873 184 903

This is an accepted solution.

I think anything is possible but you will have to fill in the gaps.

 

You mention abandoned carts. Well, to begin with, carts aren't abandoned. Checkouts are and only if you already provided contact info such as email. Now, if like in most Storefront API examples you decide to have your cart be the checkout object, then you create the checkout object as soon as items are added to the cart.

 

The checkout object does not require an email so if that's all you have so far and the visitor leaves - you do not have an abandoned checkout (or cart) though you could track the visitor and cart token via cookies or otherwise to repopulate their checkout if they return and haven't cleared their cookies. But okay, that's not really pertinent to the Storefront API itself.

 

Say your visitor has a few items in the cart (I am still assuming you will be using the checkout object for that) and in between they decide to register i.e. you create a customer account. You can immediately associate the customer with the checkout now - checkoutCustomerAssociateV2. Or let's say your visitor signs up for a newsletter, thereby providing their email. While not a customer, you can use that email (careful with GDPR if that applies to you) to update their checkout - checkoutEmailUpdateV2. In both cases, you'd now get abandoned checkouts if the checkout isn't completed. And thus the standard abandoned checkout notifications apply.

 

Hope this helps!

adamjw3
Excursionist
26 0 7

cool thanks

 

Got it working but want to add more features to the admin area to enable users to add banner, sliders etc. 

Josh68
Excursionist
21 2 10

In both cases, you'd now get abandoned checkouts if the checkout isn't completed. And thus the standard abandoned checkout notifications apply.

Hi, Karl.

For a store we're working on, we're using the Storefront API to create and modify checkouts, and although abandoned checkouts show up in the Shopify admin, the Online Store channel appears to schedule abandoned checkout emails (when emails are associated with said checkouts), but then won't send them. They appear to be queued but then dropped and never sent.

From what Shopify has told us in the past several months, it isn't permitted for the Online Store to work with custom checkouts, or vice-versa. Is there a way you know of to allow the Online Store to manage these emails or, alternatively, a way to use the Storefront API to implement the same feature of scheduling and sending abandoned checkout emails?

As you say, the documentation isn't so helpful in this regard. Thanks for any advice you may have.

Josh68
Excursionist
21 2 10

@KarlOffenberger, I forgot to mention you in my question above, if you have a moment. Thanks.

fff_www
Shopify Partner
16 0 8

Hello,

This is over a year old.

But I just hit this topic with one Shop.
So, its not possible to automatically send the Abandoned Checkout e-mails from a Storefront API checkout?

Let me know!

Best,
F