Content block parts

A Content block is made of parts, shown from top to bottom. Click Add part under Parts to add one, and open a part’s row to change its settings. The arrows move a part up or down; each row can be duplicated or removed.

Text fields marked with Insert value can show live values, such as the cart total. Multi-line text fields also have buttons for bold, strikethrough and links.

Text

A heading and paragraphs.

Setting	What it does
Heading	Optional. Checkout’s own heading: one line, without formatting, color or size, which Shopify’s checkout headings don’t take. Live values work.
Text	Each line is a paragraph, and an empty line adds room. Bold, strikethrough, links and live values work.
Size	Normal or Small
Color	Text color, Subdued, Info, Success, Warning or Critical: checkout’s colors, from your branding
Alignment	Same as the block, Left, Center or Right

For example, under the shipping methods: heading Order by 2 PM, ships today, text Orders placed before 2 PM on weekdays ship the same day., with a Day and time rule.

Banner

Shopify’s colored message box.

Setting	What it does
Title	Optional. One line. Live values work; formatting marks show as typed.
Text	The message. Bold, strikethrough, links and live values work.
Color	Info, Success, Warning or Critical, from your branding
Text opens on a tap	Buyers tap the title to read the text. Needs a title and text. Until then, the text shows.
Buyers can close it	Shows a close button. Once closed, the banner stays closed for the rest of the buyer’s checkout.
Block checkout progress	While the banner shows, buyers can’t continue to the next step or pay. See below.

Block checkout progress

A banner that blocks checkout is a simple checkout rule: its rules describe the problem, and its text tells the buyer how to fix it, such as “We can’t ship alcohol to Utah. Please choose a different address.” When the rules stop passing, the banner goes away and the buyer can continue.

When a buyer tries to continue, checkout tells them why with Message buyers see when they try to continue. Leave it empty to use the banner’s title, or its text. In the editor, the part’s row shows a Blocks checkout badge.

Before you rely on it

• It works only after you turn on Allow app to block checkout for the Content app block in Shopify’s checkout editor, under Checkout behavior. Without it, the banner shows but buyers can continue.
• It doesn’t stop the Apple Pay, Google Pay or Shop Pay buttons.
• Shopify has deprecated blocking from app blocks. It still works, with no removal date yet.

To stop an order for sure, use a Checkout blocker rule. It works in every checkout, express ones included.

Test a blocking banner with a cart that should be stopped and one that shouldn’t: wrong rules can stop every buyer.

Image

One picture.

Setting	What it does
Picture link	The picture’s address. Upload it in Shopify admin under Content → Files and copy its link. A different picture per language goes under Translations.
Description	Read aloud by screen readers. Leave it empty for decorative pictures.
Opens a page when tapped	Optional. The page opens in a new tab, so the buyer keeps their checkout, unless you tick Open in the same tab. A link typed without https:// gets it.
Shape	As is: the picture’s own size, up to the width. Square, Wide (16:9) or Tall (3:4): the picture fills the width in that shape.
Width	Full width, Medium (up to 240px) or Small (up to 120px, like a logo)
Fit	With a shape: Fill the shape, cutting off the edges that don’t fit, or Show the whole picture, which may leave space at the sides or top and bottom
Corners	Square, Rounded or More rounded
Border	A line around the picture

To show a picture on phones or computers only, use Show on in the block’s Look.

Trust badges

Logos and seals that say “this checkout is safe”: payment logos, and your own badge pictures such as a security seal or a guarantee badge. Pictures only: a promise in words, like a lock icon with “Secure checkout”, is a benefit.

Setting	What it does
Badges, in order	The badges shown, left to right. Use the arrows to reorder them.
Add payment logos	Search Shopify’s payment logos, like Visa or Klarna, or pick from the most used. Logos use Shopify’s style.
Add badge picture	Your own seal: a Picture link and a Description
Size	Small, Medium or Large. Sizes your badge pictures and the room between badges. Payment logos keep Shopify’s size.
Alignment	Same as the block, Left, Center or Right

A new Trust badges part starts with Visa, Mastercard, American Express, PayPal, Apple Pay, Google Pay and Shop Pay. Keep only the ones your store accepts.

For a “Secure checkout” line over the logos, start from the Secure checkout template, or add a Text part above.

Benefits

Short promises, also called USPs: free shipping, easy returns, made locally. Each benefit has an icon or a small picture, a title and a line of text. Benefits replaces the older Icons with text and Feature highlights blocks.

Each benefit has:

Setting	What it does
Shows	An icon, from checkout’s icons, or A picture, which replaces the icon
Icon	One of checkout’s icons
Ready-made picture, Picture link	With A picture: one of the ready-made pictures the older Feature highlights block had, or your own link
Title	One line, such as Free shipping
Text	Optional, such as Tracked delivery on every order. The Compact layout doesn’t show it.
Link	Optional. The title opens it. Without a title, the icon or picture does.

Quick add writes a common benefit in one click: Secure checkout, Fast shipping, Easy returns, Free shipping, Money-back guarantee, Loved by customers, Here to help and Ships worldwide. A new Benefits part starts with Secure checkout only. Only add promises your store keeps. Change the words to match your policies.

For the whole part:

Setting	What it does
Layout	Row: side by side, the icon on top. Stacks where it’s narrow. List: one per line, the icon at the start. Compact: a small icon and the title on one line, without the text. Cards: side by side with a bigger picture on top, like Feature highlights.
Box around each benefit	None, Outline or Shaded
Icon and picture size	Small, Medium or Large
Icon color	Text color, Subdued, Green, Orange or Red: checkout’s colors, from your branding
Alignment	Same as the block, Left or Center. A List always lines up at the start.

FAQ

Questions that open to their answers.

Setting	What it does
Question	One line, such as When will my order arrive?. Live values work.
Answer	Bold, strikethrough, links and live values work.
Open the first question	Its answer shows without a tap. The others open when tapped.

Click Add question for more. The FAQ card adds a Text part above, with the heading “Frequently asked questions”.

Buttons

One or more buttons or links. Each has a Button text and When tapped:

When tapped	Settings
Open a page	Page link. It opens in a new tab, so the buyer keeps their checkout, unless you tick Open in the same tab. A link typed without https:// gets it.
Email	Email address: opens the buyer’s email app, addressed to you
Call	Phone number: phones call it, and computers offer their calling app. Start with + and the country code so buyers abroad can call.
Apply a discount code	Discount code: applied when tapped. Once the code is applied, the button shows Text once applied (Applied if empty) and can’t be tapped again. If Shopify refuses the code, buyers see why under the button. The editor warns you when the code isn’t in your Discounts, has expired or hasn’t started. In checkouts where Shopify doesn’t let buyers change discount codes, such as an invoice for a draft order, the button is hidden.
Copy text	Text to copy, such as a code or an account number. The button says Copied for 2 seconds.
Show more text	Window title (the button’s text if empty) and Text in the window, which opens only when tapped. For a size guide, your terms or a shipping policy.

For all the part’s buttons:

Setting	What it does
Style	Buttons or Links
Emphasis	Buttons only. Primary: filled, like Pay now. Secondary: quieter, so it doesn’t compete with Pay now.
Color	Accent, your checkout’s colors from your branding, Text color, or Red for warnings (buttons only: checkout’s links can’t be red)
Placement	Side by side, or Stacked, which makes buttons full width

The Contact info card starts with Email us and Call us links, and Discount buttons with an Apply code button. The Size guide and Terms and conditions templates use Show more text.

Spacer

Empty room or a line between other blocks.

Setting	What it does
Shows	Space, empty room, or Line, a thin line with room above and below
Size	For a space: Extra small, Small, Medium, Large or Extra large
Room above and below	For a line: None to Extra large

To space a block from the ones around it, you can also use Room above and Room below in its Look.