content_for_header

Definition

content_for_header is the Liquid object every theme must output in the head. Shopify replaces it with the scripts and tags the platform and the installed apps require, including analytics, checkout, app embeds and preview tooling. Its contents aren't editable, and they change whenever apps change, so a theme's own head markup has to work around it.

Documented at shopify.dev, content_for_header.

How We've Used It

Head order is a budget, and this object is the part of it we don't control. So we build around it. Preconnects go before the title tag, the two render-critical stylesheets are preloaded, everything else loads through the print-media swap with its own fallback, brand faces are preloaded as woff2, and session-recording tools are bound to the first interaction instead of to load. What we don't do is fight the tag Shopify injects. The app scripts inside it appear and disappear with installs, so a layout that depends on their order is a layout that breaks without anyone touching it.

Builds Using It

One gated build uses it; its page follows.

Related Entities

• Deferred CSS loading — the rest of the head budget.
• dataLayer — what the tags in that head read from.
• Intersection Observer API — how the deferred work is triggered.