New Dynamic Checkout feature.

Shopify Staff
Shopify Staff
469 36 92

Update 18/04/2018: Thanks for all the questions and comments, I will pass them along to the Checkout team!

Hey All,

On April 3rd 2018, we are releasing a new Dynamic Checkout feature.  This feature will be available to all merchants when they upgrade to the latest version of their theme.

Dynamic Checkout adds a liquid filter to the product form tag to render a payment button on the storefront. Once the page loads, a JavaScript library hooks onto the button to show an appropriate branded (ApplePay, PayPal, etc.) or unbranded button to the buyer.

What this means for you:

Dynamic Checkout can conflict with apps that modify the cart.  Here are some app use-cases that may be affected:

  • Any app that uses a third party checkout, such as subscription apps, will not be compatible.

  • Apps that modify the user flow during the checkout, such as currency converters, may not be active on the Dynamic Checkout and can therefore provide an inconsistent shopping experience.

  • Any other non-standard buying flow.

We recommend adding documentation for your apps to inform merchants about this feature, or code defensively around it.

Here is some additional (merchant facing) documentation on Dynamic Checkout:

How to add dynamic checkout buttons to your online store

Updating the product form to support dynamic checkout buttons

Feel free to post comments and concerns in the thread below.

 

Best Regards,

Shopify Checkout Team

Developer Experience @ Shopify
0 Likes
Shopify Expert
537 24 100

If I understand this feature correctly, this enables customers to skip the cart page and go directly to the first checkout page, meaning they would skip any terms and conditions checkbox that might be present on the cart page.

Some themes come with this (optional) feature and EU stores are typically required to get consent or at least clearly inform customers of terms and conditions before the purchase. Since regular, non-Plus stores can't put the terms and conditions info or checkbox in the checkout, it's typically placed on the cart page. If this feature is enabled, the terms and conditions checkbox could be circumvented.

Fortunately, this is an optional feature that needs to be explicitly enabled by the merchant. I would nevertheless suggest adding some info to the help page, preferrably by ammending the section "Compatibility with apps" and maybe calling it "Compatibility with apps and theme settings".

★ ThemeUp: Nifty Upgrades for your Shopify Store ★ https://themeup.net
0 Likes
Shopify Staff (Retired)
Shopify Staff (Retired)
3 0 1

Hey Thomas, thanks for your feedback! Yes, this feature will essentially allow customers to skip the cart to checkout directly via Shopify or an accelerated checkout method. We currently have a "Compatability with apps" section in the help doc and will update it to address other cart functions like the T&C checkbox. 

0 Likes
Shopify Expert
3939 16 328

How can I render this button and have it work for a specific variant? 

In a theme wanting to use this new feature, when rendering a form of product variants, each variant comes with a special Add to Cart button. 

 

So out of 12 variants, only one is eligible for this new Dynamic Checkout button. Can I render it AND pin it to a variant?

Custom Shopify Apps built just for you! hunkybill@gmail.com http://www.resistorsoftware.com
0 Likes
Shopify Expert
3939 16 328

I rendered two forms on a product page with this new feature.. one for the specific variant and one for the rest. The specific variant gets the fancy Buy with Paypal button now.

The new problems are:

  • how can one customize the words on the button? Possible?
  • When going to Paypal, the Dynamic Checkout button fails to tell Paypal what the product is. That sucks! What is the technique to ensure the actual product is described to Paypal for example?

 

Custom Shopify Apps built just for you! hunkybill@gmail.com http://www.resistorsoftware.com
1 Like
Shopify Partner
3 0 0

is there any easy way to initialize the shopify dynamic checkout via javascript call?

 

my shopify sites all load pages using ajax

it sucks having to refresh the page to see the dynamic checkout buttons 

i saw the script was coming from 

https://cdn.shopify.com/s/assets/storefront/express_buttons-1b182ec25e6d5098820106a1c2ce58b14672748f...

i looked in there and found 

Shopify.StorefrontExpressButtons.ExpressCheckout.initialize();

tried adding the script into the header of my theme to preload it...and using the initialize call above for after i load the product page...but to no avail.....maybe theres something i overlooked?

0 Likes
Shopify Partner
4 0 0

I have implemeted the dynamic checkout option in my shopify portal. 

I am facing below issues:

1. For a product page shows with branded payment buttons and in some browsers and mobile devices the same product page displays unbranded buttons (Buy now) only. You previously informed it depends on the devices & browsers, can we resolve this?

2. Below add to cart button PayPal button & Mor payment options showing. when I click on the other payment options it opens a popup where shows paypal,ApplePay buttons. Is it possible to list other branded payment buttons under the Add to cart button & I don't want the popup in the page?

Thanks.

0 Likes
Excursionist
67 0 13

Some themes come with this (optional) feature and EU stores are typically required to get consent or at least clearly inform customers of terms and conditions before the purchase. Since regular, non-Plus stores can't put the terms and conditions info or checkbox in the checkout, it's typically placed on the cart page. If this feature is enabled, the terms and conditions checkbox could be circumvented.

I'd amplify this.  I think it's really unfortunate that explicit consent to terms and conditions - which is a regulatory requirement for many stores, and will be all the more important post-GDPR - conflicts with the new feature.  Since this checkbox is currently an "unsupported customization," I think it's time for it to become supported.  Introducing a new feature that breaks regulatory compliance for many stores, and only does so because of Shopify's policy decision not to allow editing the checkout page, creates a responsibility for Shopify to resolve the conflict.  And that goes further than just putting a note in the documentation that the new feature "may conflict with apps."

0 Likes
Trailblazer
193 0 87

Since April 3rd, a large amount of my sales (25%) are now being attributed to  /checkout/contact_information?refresh_count=1

This has completed ruined my ability to track important marketing campaigns for the month of April and Shopify support has not been helpful in finding out why this is happening.

Could this be caused by the result of this change?

 

See screenshot:

0 Likes
Shopify Staff (Retired)
Shopify Staff (Retired)
3 0 1

Hey Anbu, 

1. The button that is shown is highly dependent on the browser + device combination. An unbranded button will be shown if the customer has not previously used an accelerated payment method on that combination.

2. Dynamic Checkout is a personalized experience so it will only show one button on the product page. The "More payment options" popup will currently be a part of the feature to support alternative methods, in a way that adds minimal noise to the product page. 

Hope this helps!

1 Like