Let the experts at Shopify Plus agency Autrement show you how to build a checkout with reduced friction that looks and feels like your brand using apps, and the checkout and accounts editor. Watch the video, and ask the team at Autrement any follow up questions you may have in the AMA thread below.
This AMA will be open from July 22nd - 26th. We’ll aim to answer questions within a 24-hour window, though we can’t guarantee that every question will be answered.
Rules of engagement:
We’ll do our best to follow up on every question during the event.
You must be logged into your account on Community to participate.
Assume positive intent with one another and be kind. Some users may be new and learning how to engage with the Community.
Be authentic and honest with your questions and answers.
Do not ask for or share store admin login details or passwords.
Like posts and threads that are of interest or helpful to you.
Be constructive with criticism, not offensive.
Share your experiences and insights whenever you can to support others.
Abuse, harassment, and spam content won’t be tolerated.
Great video. I have some questions for Checkout styling.
Question 1 : Thumbnails
In checkout liquid we have been able to style the order summary thumbnails. There are many stores with non-square product images so we have updated styling to support rectangle images. We have also been able to load higher quality images as the default images are a bit low rez.
Shopify does not display rectangular thumbnails very well by default.
Hey, thanks for watching the video. I hope it answered some of your other questions.
Question 1 : Thumbnails
Regarding the thumbnails, indeed right now there is no way on both the app or even on the API level to choose our own aspect ratio or change it from square to portrait, for example. Have you tried using section styles and removing the borders? Since the image is not square, you have extra background padding showing below the image. To remove it, we can create a section style with the same background color but instead select subdued background. This will generate a background color the same as the padding below the image and give you that portrait aspect ratio. However, the image might be small.
Go to checkout blocks order summary section
Create a styles section, and add some padding and background color of your choice.
Hey, if Checkout Blocks font picker fails, I would recommend using the GraphQL Admin API to do so, I made a guide explainer video here, feel free to ask if you have more questions.
Hi! Many of our product images are not square, and/or have transparent backgrounds. With our existing setup (checkout.liquid), we set our product thumbnails to have a white background. However, I cannot see any method in the GraphiQL Admin API nor the checkout editor which would enable me to set specifically the product thumbnail’s background color. Am I missing something?
One more question: I have several feature requests for the checkoutBrandingUpsert API endpoint, as there are some things we would like to style but have no option for. Is there a good place to post or share those requests/suggestions?
Thank you to all who participated in this AMA for Checkout Extensibility! No new questions will be accepted moving forward.
The Autrement team will continue to respond to questions already asked as they are able, but some questions might not be answered. If your question goes unanswered you’re welcome to post on our Shopify Plus board or our one of our other discussion boards.
Make sure you check out our Checkout Extensibility Upgrade board which has many FAQs and docs to help your business with the August 13th upgrade deadline.
Hey, regarding the product thumbnail question, I already answered above will paste answer here:
Right now there is no way on both the app or even on the API level to choose our own aspect ratio or change it from square to portrait, for example. Have you tried using section styles and removing the borders? Since the image is not square, you have extra background padding showing below the image. To remove it, we can create a section style with the same background color but instead select subdued background. This will generate a background color the same as the padding below the image and give you that portrait aspect ratio. However, the image might be small.
Go to checkout blocks order summary section
Create a styles section, and add some padding and background color of your choice.
