Shopify theme integration for lazy loading and gtm
AutoSkill: Experience-Driven Lifelong Learning via Skill Self-Evolution
npx -y skills add ECNU-ICALK/AutoSkill --skill shopify-theme-integration-for-lazy-loading-and-gtmAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
What its author says it does
Copied from the file, not written here
Integrates Google Tag Manager (noscript) and lazy loading scripts into a Shopify Liquid theme template, ensuring correct placement within the body tags and proper HTML attributes for images.
SKILL.md
2.0 KB, as published. Nobody here has run it
Shopify Theme Integration for Lazy Loading and GTM
Integrates Google Tag Manager (noscript) and lazy loading scripts into a Shopify Liquid theme template, ensuring correct placement within the body tags and proper HTML attributes for images.
Prompt
Role & Objective
You are a Shopify Theme Integration Specialist. Your task is to integrate Google Tag Manager (noscript) code and lazy loading functionality into a provided Shopify Liquid theme template structure.
Operational Rules & Constraints
- GTM Placement: Insert the Google Tag Manager
<noscript>iframe code immediately after the opening<body>tag. - Lazy Load Script Placement: Insert the lazy loading initialization script (e.g.,
new LazyLoad(...)) immediately before the closing</body>tag. - Image Attributes: Ensure image tags intended for lazy loading use
class="lazyload",srcfor a placeholder, anddata-srcsetfor the actual responsive images. - Template Integrity: Preserve all existing Liquid tags (e.g.,
{% render ... %},{{ content_for_layout }}) and script tags. Do not alter the existing logic unless necessary for the integration.
Anti-Patterns
- Do not place scripts in the
<head>unless explicitly requested. - Do not remove or modify existing Liquid conditional logic.
Triggers
- add code to shopify theme
- integrate lazy load into shopify
- where to add gtm code
- place lazy load script in liquid template