> ## Documentation Index > Fetch the complete documentation index at: https://autorender.io/docs/llms.txt > Use this file to discover all available pages before exploring further. # Platforms > Where the Autorender Native script tag goes in Shopify, WordPress, Webflow, Google Tag Manager, and plain HTML — and when to use a platform integration instead. Autorender Native is one ` ``` ### Shopify Add the tag to `layout/theme.liquid`, just before ``, under **Online Store → Themes → Edit code**. If you want to optimize the store images you already upload to Shopify, use the [Shopify integration](/docs/integrations/shopify) instead — it rewrites your theme's image URLs server-side and needs no client script. Reach for Native only when you are placing images from an Autorender workspace into the theme yourself. ### WordPress Add the tag to your theme's `header.php` before ``, or through a header-snippet plugin so a theme update never removes it. To optimize the media in your WordPress library automatically, use the [WordPress plugin](/docs/integrations/wordpress) instead — it rewrites `src` and `srcset` on the front end and adds an Autorender media picker. Use Native when you are hand-placing workspace images in templates. ### Webflow Open **Site settings → Custom code → Head code**, paste the tag, and publish. For a single page instead of the whole site, use the page's **Custom code → Inside head tag** field. Webflow images set through the Designer keep their own URLs, so mark the elements you want Autorender to size with `data-ar-src` in an embed or via custom attributes. ### Google Tag Manager Create a **Custom HTML** tag, paste the script, and set the trigger to **Initialization – All Pages** so it loads as early as GTM allows. Because GTM injects the tag after the initial parse, use the [hero pattern](/docs/native/hero) for your Largest Contentful Paint image rather than relying on the runtime. ### Plain HTML or a static site Add the tag to the `` of your template or layout. That is the whole install: ```html {2} wrap theme={null} ``` ## Native or a platform integration? Both deliver optimized images; they differ in what they optimize and how. | | Native (script tag) | Platform integration | | ----------------- | ------------------------------------------------------ | -------------------------------------------------------------- | | Runs | In the browser | Server-side URL rewrite | | Optimizes | Elements you mark with `data-ar-src` | The platform's existing media, in place | | Image source | Your Autorender workspace (or a remote `https://` URL) | The store or site's own media URLs | | Client JavaScript | One script tag | None | | Best for | Landing pages, no-build sites, workspace-hosted assets | Optimizing a Shopify or WordPress library you already maintain | Run one approach per site. Using both on the same images means two systems rewriting the same URLs. ## Next steps Add the tag and mark your first image. Preload the largest image, which GTM and late-injected tags can delay. The server-side alternative for optimizing existing Shopify media. The plugin alternative for optimizing an existing WordPress library.