# Weaverse

- [Welcome to Weaverse](https://weaverse.io/docs/index.md): Universal visual page builder with AI integration for headless Shopify storefronts using React Router and Hydrogen
- [5-Minute Quickstart](https://weaverse.io/docs/intro/quickstart.md): Get a Weaverse Hydrogen storefront running locally in just 5 minutes
- [Installation](https://weaverse.io/docs/getting-started/installation.md): Install Weaverse for your Shopify Hydrogen project using our app-based workflow or manual methods.
- [Why Weaverse for Hydrogen](https://weaverse.io/docs/intro/why-weaverse-for-hydrogen.md): Technical advantages of using Weaverse as your visual page builder for Shopify Hydrogen storefronts.
- [How Weaverse Works](https://weaverse.io/docs/intro/how-it-works.md): Understand the architecture and workflow of Weaverse's visual page builder integrated with Shopify Hydrogen.
- [Project Structure](https://weaverse.io/docs/intro/project-structure.md): Essential guide to Weaverse Hydrogen theme structure
- [Navigating Weaverse Studio](https://weaverse.io/docs/studio-guide/interface-tour.md): Understand the main areas of Weaverse Studio so you can edit pages, preview storefront changes, and manage project settings efficiently.
- [Environment Variables](https://weaverse.io/docs/development-guide/environment-setup.md): Set up Shopify, Hydrogen, and Weaverse environment variables for local development and production.
- [Studio vs. Live Environment](https://weaverse.io/docs/development-guide/design-mode.md): Learn how to detect whether your Hydrogen storefront is running inside Weaverse Studio (design mode) or in the live production environment.
- [Creating Components](https://weaverse.io/docs/development-guide/creating-components.md): Learn how to build Weaverse components with proper schemas, TypeScript support, and modern React 19 patterns.
- [Component Schema](https://weaverse.io/docs/development-guide/component-schema.md): The blueprint of a Weaverse component.
- [Input Settings](https://weaverse.io/docs/development-guide/input-settings.md): Input settings to allow section components customizable via Weaverse Theme Customizer.
- [Weaverse Hydrogen Component](https://weaverse.io/docs/development-guide/weaverse-component.md): Learn how to build powerful, customizable components for your Weaverse Hydrogen theme.
- [Styling & Theming](https://weaverse.io/docs/development-guide/styling-theming.md): Apply consistent styling with Tailwind CSS, global theme settings, and modern design patterns in Weaverse components.
- [Section Data Fetching](https://weaverse.io/docs/development-guide/data-fetching.md): Learn how to fetch and manage data efficiently in Weaverse section components using loaders.
- [Data Connectors](https://weaverse.io/docs/development-guide/data-connectors.md): Bind dynamic data to your components without writing code - just like Shopify's theme customizer dynamic sources.
- [Global Sections](https://weaverse.io/docs/features/global-sections.md): Learn how to create, reuse, publish, and manage global sections across your Weaverse Hydrogen storefront.
- [Navigation Configuration](https://weaverse.io/docs/features/navigation-menus.md): Learn how to configure and optimize navigation menus in your Weaverse Hydrogen storefront using Shopify's Content > Menus.
- [Third-party Integration](https://weaverse.io/docs/features/third-party-integrations.md): Extend the functionality of your Weaverse Hydrogen theme by integrating third-party applications and services.
- [Installable Mobile App (PWA)](https://weaverse.io/docs/features/mobile-app-pwa.md): Turn your Weaverse Hydrogen storefront into an installable home-screen app on iOS and Android — no app store, no extra codebase, configured entirely from theme settings.
- [Markets and Localization](https://weaverse.io/docs/features/markets-localization.md): Configure Shopify Markets and Weaverse localization from one verified market definition.
- [Translation Feature Guide](https://weaverse.io/docs/features/translation-feature-guide.md): Use Translation Manager to AI-translate your storefront once and roll it out to every market and language, with a human review step.
- [i18next Integration](https://weaverse.io/docs/features/i18next-integration.md): Learn how to set up i18next for advanced localization and pluralization support in Weaverse.
- [Content Security Policy](https://weaverse.io/docs/features/content-security.md): How Content Security Policy is dynamically configured and enforced in Weaverse Hydrogen projects, with guidance for customization and best practices.
- [Cookie Consent Banner](https://weaverse.io/docs/features/cookie-consent-banner.md): How to properly configure Shopify's cookie consent banner in Weaverse Hydrogen storefronts, including setup, troubleshooting, and GDPR/privacy compliance.
- [Analytics & Conversion Tracking](https://weaverse.io/docs/features/analytics-tracking.md): How to set up GA4, Google Tag Manager, and third-party conversion tracking across your Hydrogen storefront and Shopify checkout.
- [Custom Pages](https://weaverse.io/docs/features/custom-pages.md): Create Hydrogen custom pages with Weaverse.
- [Page SEO](https://weaverse.io/docs/features/page-seo.md): Wire Weaverse Studio's per-page SEO editor into your Hydrogen storefront.
- [Custom Templates](https://weaverse.io/docs/features/custom-templates.md): Create and assign unique templates for products, collections, pages, and blogs in your Hydrogen storefront using Weaverse.
- [Custom Routing](https://weaverse.io/docs/features/custom-routing.md): Learn how to create custom URL structures for your Hydrogen storefront with Weaverse, mapping them to specific content types.
- [Rendering Weaverse Pages](https://weaverse.io/docs/guides/rendering-page.md): Complete guide to rendering different page types in Weaverse with loadPage() and WeaverseContent components.
- [Advanced Localization Guide](https://weaverse.io/docs/guides/localization-advanced.md): Implement exact market routing, localized commerce continuity, SEO, and translation precedence in a Weaverse Hydrogen storefront.
- [Multi-Project Architecture](https://weaverse.io/docs/guides/multi-project-architecture.md): Comprehensive guide to using multiple Weaverse projects for multi-market storefronts, A/B testing, and multi-brand experiences.
- [Customer Account API Local Development](https://weaverse.io/docs/development-guide/customer-account-local-dev.md): How to set up and test Shopify Customer Account API locally in your Weaverse Hydrogen storefront — for both paid stores and development stores.
- [Multipass in Hydrogen](https://weaverse.io/docs/development-guide/multipass-in-hydrogen.md): Implement Shopify Multipass SSO in a Hydrogen storefront using the legacy customer account flow and Storefront API customer access tokens.
- [Deployment](https://weaverse.io/docs/guides/deployment/index.md): Deploy your Weaverse Hydrogen storefront to Shopify Oxygen, Docker, Cloudflare Workers, and other platforms.
- [Deploy to Shopify Oxygen](https://weaverse.io/docs/guides/deployment/oxygen.md): Step-by-step guide to securely deploying your Weaverse Hydrogen Project on Shopify Oxygen, with best practices and troubleshooting.
- [Custom Domain & DNS Setup](https://weaverse.io/docs/guides/deployment/custom-domain-and-dns.md): Connect your custom domain to a Shopify Hydrogen storefront with proper DNS configuration.
- [Deploy with Docker](https://weaverse.io/docs/guides/deployment/docker.md): Containerize your Weaverse theme and deploy it to any cloud provider, with a worked Fly.io example
- [Deploy to Cloudflare Workers](https://weaverse.io/docs/guides/deployment/workers.md): Migrate a Weaverse Hydrogen theme from Oxygen to Cloudflare Workers, step by step
- [Introduction](https://weaverse.io/docs/api-reference/introduction.md): Learn about the Weaverse SDK API reference for building Shopify Hydrogen storefronts.
- [useWeaverse](https://weaverse.io/docs/api-reference/use-weaverse.md): Hook for accessing the active Weaverse runtime in Hydrogen components.
- [useItemInstance](https://weaverse.io/docs/api-reference/use-item-instance.md): Hook for accessing component instances in Weaverse Hydrogen components.
- [useParentInstance](https://weaverse.io/docs/api-reference/use-parent-instance.md): Hook for accessing the parent component instance in Weaverse Hydrogen components.
- [useChildInstances](https://weaverse.io/docs/api-reference/use-child-instances.md): Hook for accessing child component instances in Weaverse Hydrogen components.
- [useThemeSettings](https://weaverse.io/docs/api-reference/use-theme-settings.md): The useThemeSettings hook provides a simple way for Weaverse Hydrogen components to retrieve and utilize the global theme settings.
- [WeaverseHydrogenRoot](https://weaverse.io/docs/api-reference/weaverse-root.md): Render Weaverse page data in a Shopify Hydrogen route.
- [WeaverseClient](https://weaverse.io/docs/api-reference/weaverse-client.md): Server-side client for loading Weaverse content in Shopify Hydrogen.
- [withWeaverse](https://weaverse.io/docs/api-reference/with-weaverse.md): Wrap a React Router root Layout with Weaverse theme, translation, and Studio integration.
- [getSelectedProductOptions](https://weaverse.io/docs/api-reference/get-selected-product-options.md): Parse selected Shopify product options from request query parameters.
- [IMAGES_PLACEHOLDERS](https://weaverse.io/docs/api-reference/images-placeholders.md): Placeholder image URLs exported by the Weaverse Hydrogen SDK.
- [Types](https://weaverse.io/docs/api-reference/types.md): TypeScript interfaces and types for Weaverse Hydrogen development.
- [Content API](https://weaverse.io/docs/content-api/overview.md): REST API for reading and updating Weaverse page content, theme settings, and project data from external applications
- [List Projects](https://weaverse.io/docs/content-api/list-projects.md): Retrieve all Weaverse projects belonging to your shop
- [Update Project](https://weaverse.io/docs/content-api/update-project.md): Update a Weaverse project's display name through the Content API
- [List Pages](https://weaverse.io/docs/content-api/list-pages.md): Retrieve page assignments for a project, with optional type and locale filtering
- [List Public Custom Pages](https://weaverse.io/docs/content-api/public-custom-pages.md): Retrieve custom-page route metadata for sitemap and crawler integrations without authentication
- [Create Page](https://weaverse.io/docs/content-api/create-page.md): Create a custom page or a resource-backed template override through the Content API, optionally cloning an existing layout
- [Assign Template Resources](https://weaverse.io/docs/content-api/assign-template-resources.md): Assign many Shopify resources to one shared template page (shared-template model), without creating page copies
- [Get Page](https://weaverse.io/docs/content-api/get-page.md): Retrieve full page content with component items for a specific page type and handle
- [Update Page](https://weaverse.io/docs/content-api/update-page.md): Update component items on an existing page — merge data, create items, and relink children
- [Delete Pages](https://weaverse.io/docs/content-api/delete-pages.md): Delete multiple Weaverse page assignments by ID or by handle through the Content API
- [Get Theme Settings](https://weaverse.io/docs/content-api/get-theme-settings.md): Retrieve theme configuration and static translations for a project
- [Update Theme Settings](https://weaverse.io/docs/content-api/update-theme-settings.md): Merge global theme settings into a Weaverse project through the Content API
- [List Languages](https://weaverse.io/docs/content-api/list-languages.md): List all languages configured for a project
- [Weaverse Ecosystem](https://weaverse.io/docs/ecosystem/index.md): Explore the full suite of Weaverse developer tools — SDKs, CLI, MCP server, Content API, themes, and deployment options
- [Weaverse CLI](https://weaverse.io/docs/developer-tools/weaverse-cli.md): The Weaverse CLI facilitates tasks such as project setup, theme scaffolding, and other common developer operations.
- [Weaverse SDKs](https://weaverse.io/docs/developer-tools/weaverse-sdks.md): Weaverse SDKs bundle essential packages, streamlining the development and management of Weaverse Hydrogen themes.
- [Weaverse MCP](https://weaverse.io/docs/developer-tools/weaverse-mcp.md): Connect AI agents to Weaverse — search the docs and work with your own projects over the Content API — using the Model Context Protocol
- [Shopify Hydrogen Skills](https://weaverse.io/docs/developer-tools/shopify-hydrogen-skills.md): Agent skills for building, maintaining, and upgrading Shopify Hydrogen storefronts with Weaverse — works with Claude Code, Cursor, Copilot, and more
- [API Access](https://weaverse.io/docs/features/api-access.md): Overview of Weaverse's two APIs — Content API for page data and Admin API Proxy for Shopify GraphQL
- [Shopify Admin API Proxy](https://weaverse.io/docs/features/admin-api-proxy.md): Call Shopify Admin GraphQL through Weaverse with shop-scoped keys, installed app scopes, rate limits, and safe mutation checks.
- [Themes & Templates](https://weaverse.io/docs/hydrogen-themes/index.md): Learn about Weaverse themes, explore the Pilot template, and discover how to create your own themes.
- [Pilot - Shopify Hydrogen Starter Theme](https://weaverse.io/docs/hydrogen-themes/pilot-theme-overview.md): Elevate your Shopify Headless storefront with Pilot, the robust and versatile starter theme by Weaverse.
- [How to Change the Font in Your Weaverse Theme](https://weaverse.io/docs/hydrogen-themes/pilot-theme-customization.md): Learn how to update, extend, or customize fonts in your Weaverse Hydrogen storefront using Fontsource, Google Fonts, or custom uploads.
- [Theme “Pilot” Sections](https://weaverse.io/docs/hydrogen-themes/pilot-theme-sections.md)
- [Contact Form with Klaviyo](https://weaverse.io/docs/hydrogen-integrations/contact-form-klaviyo.md): Build a Weaverse contact form section that delivers submissions to your inbox through a Klaviyo API-based transactional email flow.
- [Integrate Judge.me Reviews with Shopify Hydrogen](https://weaverse.io/docs/hydrogen-integrations/judgeme-reviews.md): Build a Judge.me product reviews integration for a Shopify Hydrogen storefront with server-side API access, ratings, pagination, and optional review submission.
- [Integrate Shopify Inbox with Shopify Hydrogen](https://weaverse.io/docs/hydrogen-integrations/shopify-inbox.md): Add Shopify Inbox online-store chat to a Shopify Hydrogen storefront with safe client-side loading, CSP configuration, and SPA verification.
- [Integrate HubSpot Forms with Shopify Hydrogen](https://weaverse.io/docs/hydrogen-integrations/hubspot-forms.md): Submit Shopify Hydrogen contact and lead forms to HubSpot through a validated server route with consent, bot protection, and safe error handling.
- [Integrate Yotpo Reviews with Shopify Hydrogen](https://weaverse.io/docs/hydrogen-integrations/yotpo-reviews.md): Add Yotpo rating and review widgets to Shopify Hydrogen product pages with correct product IDs, SPA reinitialization, CSP, and Weaverse settings.
- [Integrate Trustpilot Product Reviews with Shopify Hydrogen](https://weaverse.io/docs/hydrogen-integrations/trustpilot-reviews.md): Add Trustpilot product-review widgets and server-rendered rating summaries to Shopify Hydrogen with SKU mapping, caching, CSP, and structured data.
- [Integrate an Instagram Feed with Shopify Hydrogen](https://weaverse.io/docs/hydrogen-integrations/instagram-feed.md): Build a secure Instagram Graph API feed for Shopify Hydrogen with server-only tokens, media mapping, short caching, token refresh, and Weaverse controls.
- [Migration & Advanced](https://weaverse.io/docs/migration-advanced/index.md): Advanced topics including v5 migration, custom routing, templates, and integrating Weaverse into existing projects.
- [Weaverse v5 & React Router v7 Migration Guide](https://weaverse.io/docs/migration-advanced/v5-migration.md): Comprehensive guide to Weaverse v5, including the migration from Remix to React Router v7, new features, and upgrade instructions.
- [Integrating Weaverse into an Existing Hydrogen Project](https://weaverse.io/docs/migration-advanced/existing-hydrogen-integration.md): Enhance your existing Hydrogen project by integrating the Weaverse SDK for visual page building and theme customization.
- [Resources](https://weaverse.io/docs/resources/index.md): Additional resources including examples, tutorials, FAQ, troubleshooting guides, and community links.
- [Frequently Asked Questions](https://weaverse.io/docs/resources/faq.md): Comprehensive answers to common questions about Weaverse development, deployment, and usage.
- [Weaverse Tutorial - Build Your First Hydrogen Store](https://weaverse.io/docs/resources/tutorial.md): A complete guide to setting up, customizing, and deploying a Shopify Hydrogen storefront with Weaverse.
- [Example Weaverse Components](https://weaverse.io/docs/resources/example-components.md): Explore real-world examples of Weaverse components with detailed implementation guides.
- [Glossary](https://weaverse.io/docs/resources/glossary.md): Definitions of the Weaverse and Shopify Hydrogen terminology used throughout these docs.
- [Preview Connection Errors](https://weaverse.io/docs/troubleshooting/preview-errors.md): Troubleshooting guide for Weaverse Studio preview connection issues
- [Component Not Selectable](https://weaverse.io/docs/troubleshooting/component-not-selectable.md): Fix components that appear in preview but cannot be selected or edited in Weaverse Studio.
- [Community](https://weaverse.io/docs/community/community.md): Join the Weaverse community for support, collaboration, and sharing best practices.
- [Changelog](https://weaverse.io/docs/changelog/index.md): Latest updates, features, and improvements to Weaverse SDK, Studio, and themes.
- [Weaverse v5 Release](https://weaverse.io/docs/changelog/weaverse-v5-release.md): Major release featuring React Router v7, enhanced AI integration, and improved developer experience

## Optional

- [Home](https://weaverse.io)
- [Studio](https://studio.weaverse.io/dashboard)
- [GitHub](https://github.com/weaverse)
- [Community](https://wvse.cc/weaverse-slack)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.