enigmare/v2-crawler

1{"id":"doc-netlify_documentation_netlify_docs-96fbad12","source":"documentation","title":"Netlify Documentation | Netlify Docs","url":"https://docs.netlify.com/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Netlify Documentation Build & deploy faster with any modern frontend stack or AI agent. Create a new project Start a new project with an AI agent, a Git repository, or drag and drop. Build with AI Build and ship with AI agents, AI models, and curated prompts. Start with a framework Choose from our supported frameworks to get started quickly. Start the deploy wizard Set up domain What's new Latest updates See all updates → Aug 13, 2026 Google Gemini 3.7 Flash now available in AI Gateway and Agent Runners Read the post Aug 12, 2026 Manage your team invitations from your Netlify dashboard Read the post Aug 12, 2026 Pay for Netlify with Apple Pay and Google Pay Read the post Aug 12, 2026 Simplified single sign-on (SSO) process Read the post FeaturesExplore NetlifyAll-in-one platform to build, deploy, manage, and extend modern web apps—powered by agents, AI workflows, Git, CI/CD, extensions, and our serverless architecture.Learn more about primitives Previews Share preview URLs of your in-progress content and code so you can review before launching changes to production. Security Secure your project at any scale—whether you need the security of a banking site with Netlify Advanced Security or simple password protection for a personal portfolio site. Monitoring & Insights Track your project's performance with every deployment and understand your Netlify team's behavior and the behavior of visitors to your site or app. Netlify DNS Simplify domain management for your projects and add unique custom domains for different versions of your project. Preview Servers Share a customizable preview environment where you and key collaborators can preview content updates alongside code updates in real-time. Forms Netlify's serverless form handling allows you to customize forms and notifications for form entries. Redirects & Rewrites Simplify redirects & rewrites management to maintain top performance and keep visitors routed to the latest. Netlify Extensions Extend Netlify with custom add-ons or integrations to add new capabilities to your project. Platform Primitives Data & Storage Instantly provision a production-grade database with Netlify Database or use Blobs as a simple key/value store or lightweight database. Platform Primitives Caching Control & customize cache behavior, including Stale-While-Revalidate (SWR), on-demand cache invalidation, a programmatic Cache API, and more. Platform Primitives Image CDN Transform images on demand without impacting build times. Handle content negotiation automatically. Platform Primitives Compute Flexible compute ready to customize.Netlify Functions for APIs and server-side logicEdge Functions for low-latency logic at the edgeScheduled, background, and async workloads Agent ExperienceBuild with AIBuild and ship with AI agents, AI models, and curated prompts.Learn more about building with AI Prompt Templates Explore curated Prompt Templates that you can customize and save for your Netlify team's use. Agent Runners Prompt AI agents to fix, update, and ship code using your unique project context directly from your Netlify dashboard. AI Gateway Use popular AI models within your project code and connect to them seamlessly without managing API keys. Netlify MCP Server Share context & connect AI assistants to your Netlify account for seamless deployment workflows. Frameworks Deploy with any modern framework Already have a preferred framework? We support all the modern frameworks you love. Check out some of our top used frameworks, and rest assured we have even more framework guides, such as our Vite guide. Get started deploying Astro React Next.js TanStack Vue Nuxt Svelte Angular Eleventy Gatsby Developer ToolsDevelop with NetlifyCustomize with powerful developer tools including the Netlify API, CLI, and SDK—designed to automate workflows and integrate seamlessly into any stack.Learn more about building on Netlify Netlify API Manage sites, deploys, DNS, and more programmatically with the Netlify REST API—ideal for automating workflows and integrating into your systems. Netlify CLI Deploy sites, run local dev servers, and manage your Netlify projects right from the terminal with this powerful command-line tool. Netlify SDK Build extensions and custom integrations with the Netlify SDK to enhance workflows, add UI components, and connect third-party services. Support Get customized help Stuck on something? Our AI-powered Ask Netlify assistant and human-powered Support team are here to help you succeed, whether it's your first deployment or your hundredth. Ask Netlify AIGet information faster from our generative AI chatbot assistant that can quickly answer your questions about Netlify. Go to Ask Netlify docs Talk with SupportStill not finding answers? Netlifolk are here to help. If you are having trouble logging in, need a site/DNS transfer, or seeing fraud, contact the support team. Contact support Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.138Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1567}}2{"id":"doc-static_routing_overview_netlify_docs-9db1d345","source":"documentation","title":"Static routing overview | Netlify Docs","url":"https://docs.netlify.com/manage/routing/overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Static Routing & Redirects Static Routing & Redirects Overview Custom headers Redirects Overview Redirect options Rewrites proxies Test redirects locally with Netlify CLI On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Routing / Static routing overview Copy page View as Markdown Copy as Markdown View as Markdown Routing allows you to manage the traffic to and from your Netlify site. You can enable powerful static routing features like redirects, rewrites, and proxies by defining rules in a site’s _redirects file or Netlify configuration file. As requests come in from site visitors, our CDN edge nodes evaluate these rules, pointing visitors to different paths or rewriting paths based on options or conditions like preferred language or current location. Rules can proxy an incoming request to another website or to execute a serverless function. You can also define custom headers sent in response to site requests. These are controlled in a _headers file or Netlify configuration file for each Netlify site. Build Plugins can dynamically access and modify a site’s redirects, headers, and other build configuration options during the build. Last 14, 2025 PreviousUsage and billingNextCustom headers Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.140Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":700}}3{"id":"doc-overview_netlify_docs-668658be","source":"documentation","title":"Overview | Netlify Docs","url":"https://docs.netlify.com/extend/develop-and-share/overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Develop & share Develop & share Overview Develop extensions and integrations Develop build plugins Share build plugins On this page Overview Framework adapters General extensions Build plugins On this page Overview Framework adapters General extensions Build plugins For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Develop And Share / Overview Copy page View as Markdown Copy as Markdown View as Markdown As a developer extending Netlify, you can add on to the Netlify platform in several ways— whether it’s for your own use or something you want to make available to others. Extensions vs. integrations You may find resources that use the terms \"extension\" or \"integrations\" interchangably.Generally, the term \"extension\" refers to artifacts created using the Netlify SDK that extend the Netlify platform, while \"integration\" can signal two systems coming together and are possibly not made with the Netlify SDK.Extensions have the following ownership and supported by Netlify or one of our technology partners. Community and supported by customers and other third parties. Framework adaptersSection titled “Framework adapters” If you are a framework author, you can integrate with Netlify using the Frameworks API. Use the API to build a framework adapter and define how a framework deploys sites to Netlify. General extensionsSection titled “General extensions” For all other use cases, we recommend using the Netlify SDK to create an extension. An extension can integrate with other systems, add on to the Netlify platform, or both. For example, you may develop an extension that renders a configuration form in the Netlify UI and uses the input values to connect to and sync data from a content management system to Netlify Connect. You can develop an extension that does the logic during the build-deploy lifecycle for a site Build pluginsSection titled “Build plugins” You can also create a build plugin to extend the functionality of the Netlify Build process but we recommend you use the updated Netlify SDK to create extensions instead. Last 11, 2025 PreviousStripe ProjectsNextDevelop extensions and integrations Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.142Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":918}}4{"id":"doc-how_projects_work_netlify_docs-b959c1b1","source":"documentation","title":"How projects work | Netlify Docs","url":"https://docs.netlify.com/manage/projects/how-projects-work","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Projects Projects How projects work Customize project name & image Find a project Organize projects Add new project Update project with Agent Runners Connect project to repo Monitor project activity Transfer a project Disable project Resume paused projects On this page Overview Understand project basics Your project name and your URL Managing versions of your project Learn more On this page Overview Understand project basics Your project name and your URL Managing versions of your project Learn more For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Projects / How projects work Copy page View as Markdown Copy as Markdown View as Markdown Whether you're new to Netlify or setting up your team, learn the basics of how projects work to help you manage your projects, access, and workflows. Understand project basicsSection titled “Understand project basics” Netlify organizes your work into three workspaces (available for Enterprise plans) Team workspaces (available on all plans, including Free and Personal plans) Projects (Your sites or apps) Your project name and your URLSection titled “Your project name and your URL” Every project gets a default Netlify URL based on the project ://your-project-name.netlify.app To change your project name, check out Customize project name. If you rename your project, the default URL changes to match. You can also connect a custom domain (like yoursite.com) so visitors don't see the .netlify.app address. Learn more about custom domains. Managing versions of your projectSection titled “Managing versions of your project” A \"deploy\" is a version of your project built on Netlify's infrastructure. You can have multiple deploys or versions of your project but only one live production version available at the production URL. This production URL can be the default Netlify URL that ends in netlify.app or it can be a custom domain you add to your project. Netlify supports two main types of deploys or versions of your deploys - uses settings for the production version of your project Deploy Previews - uses settings for your project's previews Netlify also supports branch deploys, which is another version of your project based on a Git repository branch. Branch deploys are less commonly used and require a connected Git repository and must be enabled for your project. Learn more about branch deploys. Learn more about the basics of deploys. Learn moreSection titled “Learn more” Understand version control Manage deploys Last 2, 2026 PreviousNotificationsNextCustomize project name & image Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nhttps://your-project-name.netlify.app\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.143Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":1038}}5{"id":"doc-overview_netlify_docs-d4adaf28","source":"documentation","title":"Overview | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Install & use Install & use Overview Extensions and integrations Build plugins Setup guides Netlify App for Slack Netlify Email integration Auth0 Contentful integration GPT action LaunchDarkly integration Optimizely Edge Delivery PlanetScale integration Supabase integration Stripe Projects On this page Overview Finding an extension or integration Installing an extension or integration Installing Netlify Apps Installing a build plugin On this page Overview Finding an extension or integration Installing an extension or integration Installing Netlify Apps Installing a build plugin For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Install And Use / Overview Copy page View as Markdown Copy as Markdown View as Markdown Learn how to install and use extensions, integrations, and more. If you're looking for help installing and using an AI tool or agent, check out our Build with AI docs. Finding an extension or integrationSection titled “Finding an extension or integration” If you’re looking for a service, we recommend starting with the Extensions directory in the Netlify team dashboard at Extensions. Installing an extension or integrationSection titled “Installing an extension or integration” For next steps, you can follow in the in-app help or go to the Extensions install docs. Installing Netlify AppsSection titled “Installing Netlify Apps” The top two apps that Netlify manages are the Netlify App for Slack and the Netlify App for GitHub. For next steps on installing the Netlify app for Slack, you can follow in the in-app help or go to the Netlify apps install docs. Installing a build pluginSection titled “Installing a build plugin” Build plugins are the predecessor to extensions and are still available in the Netlify UI. For next steps, you can follow in the in-app help or go to the Build plugins install docs. Last 11, 2025 PreviousVercel to Netlify migration checklistNextExtensions and integrations Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.143Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":868}}6{"id":"doc-building_code_agents_overview_netlify_docs-403cc7a2","source":"documentation","title":"Building code agents overview | Netlify Docs","url":"https://docs.netlify.com/extend/building-code-agents/overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Building code agents Building code agents Overview APIs for code agents Become AI partner On this page Overview Benefits of deploying to Netlify Designed for AI workflows API-first architecture Simplified rapid scaling Agent building resources On this page Overview Benefits of deploying to Netlify Designed for AI workflows API-first architecture Simplified rapid scaling Agent building resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Building Code Agents / Building code agents overview Copy page View as Markdown Copy as Markdown View as Markdown If you’re building code agents, assistants, or other AI tools, you can give your customers and agents a better experience and more capabilities by working with Netlify. Benefits of deploying to NetlifySection titled “Benefits of deploying to Netlify” The benefits of deploying to Netlify friction deployments that don’t require users to have Netlify accounts to start Global CDN (content delivery network) so projects stay fast on our infrastructure Custom domain support Secret scanning management Enterprise-grade security If you become an official AI partner, we can also rate limits (we don’t slow you down when growth hits). Help from our best-in-class support for fraud and abuse detection and mitigation. Access to engineering support focused on supporting partners leveraging Netlify to deploy websites. Co-marketing to celebrate and showcase your offerings. Designed for AI workflowsSection titled “Designed for AI workflows” Netlify is designed to support AI workflows, which means you can give your customers and agents more capabilities by working with Netlify. API-first architectureSection titled “API-first architecture” Netlify’s API-first approach allows AI tools to programmatically create, configure, and deploy sites without friction. While most platforms were built primarily for human workflows, Netlify’s architecture naturally accommodates both human developers and AI agents. This architecture translates to the agents can create new sites with unique configurations in seconds Build settings, environment variables, and domain rules can be programmatically defined Deployment build logs can be fed back to AI systems to improve future builds For help with building AI tools, agents, and AI workflows, check out our docs on APIs for code agents. Simplified rapid scalingSection titled “Simplified rapid scaling” Netlify is also designed to simplify rapid scaling. For example, when Bolt needed to scale from hundreds to millions of deployments, our infrastructure handled the growth without requiring complex DevOps expertise. Our edge network to handle traffic spikes without intervention Delivers content from 100+ global points of presence Responds in under 50ms to users worldwide Manages billions of requests with reliable performance Agent building resourcesSection titled “Agent building resources” Get help building your code agents and AI workflows with the following for code agents Becoming an AI partner Netlify Support Netlify & Agent experience Build a MCP Server on Netlify Last 1, 2025 PreviousShare build pluginsNextAPIs for code agents Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.144Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1172}}7{"id":"doc-terraform_provider_netlify_docs-b63f26d6","source":"documentation","title":"Terraform Provider | Netlify Docs","url":"https://docs.netlify.com/terraform-provider","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI On this page Overview Supported Terraform Versions Get Help On this page Overview Supported Terraform Versions Get Help For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Terraform Provider Copy page View as Markdown Copy as Markdown View as Markdown The Netlify Terraform provider allows companies to automate and manage their web infrastructure on Netlify using code. It integrates Netlify’s features into your Terraform workflows, enabling consistent and scalable deployments. More information about the Terraform provider can be found in the official provider documentation. Supported Terraform VersionsSection titled “Supported Terraform Versions” The Netlify Terraform provider is compatible with Terraform 1.0 or later, as well as OpenTofu 1.0 or later. Pulumi is supported through the Pulumi Terraform provider. Get HelpSection titled “Get Help” If you have ideas for new features or encounter bugs, you can start an issue on Netlify Terraform provider’s open source repository. You can also visit our Support Forums to start or join a conversation. We’d love to hear from you! Last 25, 2025 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.147Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":659}}8{"id":"doc-netlify_visual_editor_overview_netlify_docs-d32d5aea","source":"documentation","title":"Netlify Visual Editor overview | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Key visual editing features Learn how Visual Editor works Supported tools, services, and frameworks Supported frameworks Supported content sources Unsupported tools On this page Overview Key visual editing features Learn how Visual Editor works Supported tools, services, and frameworks Supported frameworks Supported content sources Unsupported tools For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Netlify Visual Editor overview Copy page View as Markdown Copy as Markdown View as Markdown Netlify Visual Editor is an environment for content editors to work with structured content in a visual way. It is designed for composable architectures, and is compatible with any site framework and API-enabled content source. Learn more about how Visual Editor works and what it can do for your team below. Or move on to enable visual editing for your site. Key visual editing featuresSection titled “Key visual editing features” Content Source engine that makes content from any source editable with Visual Editor. No production required packages can be installed as development dependencies. You do not need to use Visual Editor in production. Visual site runs in a preview window inside Visual Editor. Content changes are reflected immediately in the preview. Two-way content Editor also listens for changes from content sources and updates the preview immediately. Inline addition to traditional form fields, Visual Editor makes it possible for editors to change content by clicking directly on elements in the preview window. Learn how Visual Editor worksSection titled “Learn how Visual Editor works” If you want a deeper understanding of how Visual Editor works, dig into our concept Editor concepts deeper dive into how Visual Editor fits into your modern web stack and how its major elements work. How the visual editor through the core concepts of how Visual Editor works by following a developer’s typical journey. Content-driven non-technical editors to make structural changes to a website without the help of a developer. Reusable content editors work faster by providing a starting point for content. Structured Visual Editor works with structured content, along with content modeling basics. Two-way content Editor stores content back to the appropriate source, while also listening for changes from each source. Supported tools, services, and frameworksSection titled “Supported tools, services, and frameworks” As part of the Netlify platform, Visual Editor supports most tools, services, and frameworks supported by Netlify. Find more information below on details specific to Visual Editor. Supported frameworksSection titled “Supported frameworks” The visual editor is run in a Node-based environment by default, but can be customized to run any framework. Local development supports any framework that runs on a local port. Enabling automatic content reloading (showing content updates in real-time in the visual editor UI) may require additional code and configuration in some frameworks. See framework integration guides for specific cases. Supported content sourcesSection titled “Supported content sources” Content Source Interface (CSI) supports any structured content source with read and write abilities via an API. There are several content sources supported by default, though you can always build your own CSI module or contact us for additional support. Unsupported toolsSection titled “Unsupported tools” Visual Editor is designed to be composable and flexible, and we’re always working to expand our integrations. If your tool isn’t supported, get in touch to discuss your needs. It is likely that if we aren’t already working on support for your desired integration, you can create the necessary support through code and configuration. Last 14, 2025 PreviousSnippet injectionNextGet started overview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.148Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1628}}9{"id":"doc-error_reference_netlify_docs-ea0867ca","source":"documentation","title":"Error reference | Netlify Docs","url":"https://docs.netlify.com/resources/troubleshooting/error-reference","text":"Example:\n```text\nBulid failed due to a user error: Build script returned non-zero exit code: 2Failing build: Failed to build site\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.148Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":1,"totalLines":6,"estimatedTokens":37}}10{"id":"doc-deploy_overview_netlify_docs-c16e1754","source":"documentation","title":"Deploy overview | Netlify Docs","url":"https://docs.netlify.com/deploy/deploy-overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview How atomic deploys work Skew protection Deploy contexts Page loads Password Protection Deploy summary Deploy log Fix a failed deploy Share log content Branches and deploys Definitions Branch deploys versus Deploy Previews Collaboration tools for your site Production branch controls Branch deploy controls Deploy Preview controls Search engine indexing Deploy contexts Deploy protection Deploy permissions Working with deploy requests from non-team members Require manual review for deploy requests Enable auto-approval for deploy requests Match to an existing team member Add a non-team member as a Git Contributor Reject a pending deploy Sensitive variable policy Netlify deploys as previews Types of previews Preview URL visibility More site deploys resources On this page Overview How atomic deploys work Skew protection Deploy contexts Page loads Password Protection Deploy summary Deploy log Fix a failed deploy Share log content Branches and deploys Definitions Branch deploys versus Deploy Previews Collaboration tools for your site Production branch controls Branch deploy controls Deploy Preview controls Search engine indexing Deploy contexts Deploy protection Deploy permissions Working with deploy requests from non-team members Require manual review for deploy requests Enable auto-approval for deploy requests Match to an existing team member Add a non-team member as a Git Contributor Reject a pending deploy Sensitive variable policy Netlify deploys as previews Types of previews Preview URL visibility More site deploys resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Deploy overview Copy page View as Markdown Copy as Markdown View as Markdown Understand how deploys work, how to find information about deploys, and how to manage branches, deploy contexts, deploy permissions, and more. Quick help for deploying Looking for the best way to deploy your project and share it on the web? Try our new Deploy Navigator for personalized deployment recommendations based on your project type and requirements. How atomic deploys workSection titled “How atomic deploys work” Netlify enforces a strict concept of atomic deploys. If you’re used to uploading files with FTP, SSH, RSync or S3’s API, this is quite a different concept. Instead of pushing individual files to Netlify, you always create a new deploy. Netlify will compare the new deploy with your existing deploy and determine which files have changed and need to be uploaded. No changes go live on your site’s public URL before all changes have been uploaded. Once all the changes are ready, the new version of the site immediately goes live on the CDN. This means deploys are atomic, and your site is never in an inconsistent state while you’re uploading a new deploy. With FTP or S3 uploads, each file is pushed live one after the other, so you can easily get into situations where a new HTML page is live before the supporting assets (images, scripts, CSS) have been uploaded. And if your connection cuts out in the middle of an upload, your site could get stuck in a broken state for a long time. Atomic deploys guarantee that your site is always consistent. Files per directory limit While Netlify doesn't have a limit on the number of files per deploy, we do have a limit of 54,000 files per directory. If any directory within your publish directory has more than 54,000 files, your deploys will fail. Skew protectionSection titled “Skew protection” Availability and framework support Skew protection is available on all plans. It is currently supported for the following : Starting with version 5.15.0, Astro enables skew protection on Netlify by default when using Astro's Netlify Adapter. Next.js: Skew protection is an optional feature for Next.js. Earlier Next.js versions also require a minor configuration change. Learn how to enable it. Skew protection works with CLI deploys starting with Netlify CLI version 23.11.0 and above. To update the Netlify CLI version, run npm update -g netlify-cli or append npx to your CLI commands to always use the latest Netlify CLI version. Netlify offers skew protection to address version skew, which is a common challenge when deploying a new version of a production site while users are actively using it. The issue occurs when the server code is updated, but some clients continue to use an older version, typically due to stale browser caches or long-lived browser sessions that span multiple Netlify deploys. This drift can cause unpredictable behavior, especially if the server update includes breaking changes. For example, consider this user opens your app and loads the client-side code in their browser. You deploy a new version that removes a field from one of your API endpoints. The user continues using the app without reloading. The outdated client code sends a request that includes the now-removed field, resulting in an error. Skew protection fixes this by tracking which deploy each client should communicate with and routing requests to the appropriate server version. As long as a deploy is available, it will be served to clients that require it. If you are a framework maintainer, here is how to add support for skew protection to your framework. Deploy contextsSection titled “Deploy contexts” Skew protection is only available on the production context. When you make a request for a branch deploy or a Deploy Preview, Netlify will bypass skew protection and serve the latest deploy associated with those contexts. Deploy permalinks, where the URL itself already contains a reference to a specific deploy ID, also bypass skew protection. Page loadsSection titled “Page loads” If not implemented correctly, skew protection can lead to clients perpetually using old versions of your application. Imagine a scenario where your application sends a cookie that locks the client to deploy A. If we keep using that cookie for as long as it's persisted on the user's browser, they keep requesting deploy A even if your application is now on deploy Z. To mitigate this, Netlify discards skew protection signals whenever the browser navigates between pages. This is typically known as a hard navigation, in constrast with the concept of a soft navigation popularized by Single Page Applications. Netlify uses the following heuristics to detect a hard Sec-Fetch-Mode header is set to navigate, or The Sec-Fetch-Site header is present and is not set to same-origin. Password ProtectionSection titled “Password Protection” If your site has Password Protection enabled, skew protection works only if you're only protecting non-production deploys. This means that if you are protecting production deploys, then skew protection will not work. The skew protection token lets clients continue to request the specific deploy they were served, but they can't use that token to request other deploys. In practice, this means that any production deploy that was ever published can still be accessed by the clients who received it, but production deploys that were never published are still fully private. If your password protection settings target all deploys, skew protection will be ignored. This means that you can still fully gate access to your site at any point, regardless of whether any clients still hold any skew protection tokens that gave them access to a specific deploy. Deploy summarySection titled “Deploy summary” You can find a deploy summary on the detail page of any successful deploy, right above the deploy log. It allows you to quickly identify your deploy status and refer to the details in the log based on different types of information. This summary indicates how many files have been uploaded to our CDN. It also indicates the status of site headers and redirects included in the deploy. It also shows you how many functions and edge functions were deployed. When you have branch deploys enabled, the summary will inform you if the files to upload have already been uploaded by a previous deploy with the same commits. Netlify’s deployment infrastructure knows how to avoid uploading the same file twice, even between different deploys, so we get your changes ready without duplicating content. You can read more about how this works in this article about our deploying and routing infrastructure. If the summary continually indicates that many more files were uploaded than you were expecting, your site may be taking longer to deploy than it needs to. Visit our Forums for a verified Support Guide on making the most of Netlify’s CDN cache to learn about why this might be happening and get advice about what you can do to reduce the number of files uploaded each time in order to speed up your deploys. Deploy logSection titled “Deploy log” You can find a deploy log on the detail page of every deploy. The log provides content such about your site’s build image, dependency caching, and Netlify Build process, including all of the standard output which comes from running your build information about any Build Plugins your site may have installed and their execution details about the success, failure, or cancellation of the deploy For any successful deploy, highlights from the deploy log will be included in the deploy summary. Fix a failed deploySection titled “Fix a failed deploy” To help you fix failed deploys, Netlify offers AI capabilities that diagnose and suggest solutions for deploy failures and build errors so you can get back to shipping code. Learn more about Netlify’s AI capabilities to give solutions for failed deploys. For additional troubleshooting help, check out our Forums for a verified Support Guide on using the log to debug your build process. Note that Netlify deletes failed and canceled deploys that are 6 months old. Learn more about automated cleanup for failed deploys. Share log contentSection titled “Share log content” Deploy logs for a site linked to a private repo are available to all site members. For a site linked to a public repo, you can control deploy log visibility to determine the privacy level. To share deploy log content, you can copy the entire log by selecting Copy to clipboard (the clipboard icon). You can also generate a shareable URL for a single log line or a range of lines. For a single log line, select the line number to highlight the line. For a range of log lines, select the line number for the first log line in the range, then press shift and select the final log line number to highlight the full range. If needed, press esc to deselect log lines. Once you’ve selected a line or range, copy the resulting URL from the address bar of your web browser. The URL syntax should resemble ://app.netlify.com/sites/SITE_NAME/deploys/DEPLOY_ID#L5-L10 Branches and deploysSection titled “Branches and deploys” Netlify lets you control which branches in your Git repository you want to deploy. DefinitionsSection titled “Definitions” The following definitions highlight terms related to site deploys. For definitions regarding build commands, directories, and settings, visit the build configuration overview. Production Git branch that Netlify uses to build and deploy changes to your site’s main URL, such as www.yourcustomdomain.com or mysitename.netlify.app. Production deploy from the production branch. If auto publishing is enabled, each new production deploy will become the published deploy. Published deploy that is currently available as the live version of your site, accessible from your site’s main URL. Branch deploy generated from a branch that is not your production branch. Branch deploys are published to a URL which includes the branch name and two hyphens (--) as a prefix. For example, if a branch is called staging, it will deploy to staging--mysitename.netlify.app. If you use Netlify DNS, you can enable branch subdomains, so the staging branch example would deploy to staging.yourcustomdomain.com. To set up a branch deploy, learn more. Deploy deploy generated from a pull request, merge request, or agent run, building a preview of the site based on the latest changes. Deploy Previews from pull/merge requests are published to a URL with the prefix deploy-preview followed by the identifier number and two hyphens (--). For example, a Deploy Preview for pull/merge request #42 will deploy to deploy-preview-42--mysitename.netlify.app. Deploy Previews from agent runs use a URL with the prefix agent- followed by the run ID, for example agent-69a6140cc823ebba94b8ef32--mysitename.netlify.app. For more information, visit the docs on Deploy Previews. successful deploy of your site also creates a deploy permalink that starts with the deploy ID number and two hyphens (--). For The web content at this URL never changes. This is in contrast to production deploys, branch deploys, and Deploy Previews where the web content is updated when you merge or push new commits. Branch deploys versus Deploy PreviewsSection titled “Branch deploys versus Deploy Previews” Deploy PreviewsBranch deploysDefault setupNetlify automatically builds Deploy Previews for pull/merge requests and agent runs unless you change the Deploy Preview controls.Requires setup in Netlify UI. Set up branch deploys for only specific branches or for all new branches.URLFor pull/merge includes deploy-preview- and the PR/MR number. For agent includes agent- and the run ID.Default URL generated from the branch name. Can customize your branch deploy domain with Netlify DNS.ScopePreview site changes scoped to a single pull/merge request or agent run.Preview site changes scoped to a branch. Netlify generates a new branch deploy for every commit to your branch deploy branch. Site visitors can visit your branch deploy at the same stable branch deploy URL. By default, if a pull/merge request is opened on a branch against a production or branch deploy branch, then Netlify also generates a Deploy Preview. For example, you can open a pull/merge request on a branch deploy branch and find both a Deploy Preview and a branch deploy in your site’s deploy list from this update. Collaboration tools for your siteSection titled “Collaboration tools for your site” By default, the Netlify Drawer is enabled for Deploy Previews but if you want to use the Netlify Drawer on branch deploys, you must configure this in the Netlify Drawer settings. The Netlify Drawer enables stakeholders to share context-rich feedback about your deploy. This includes image, video, and browser metadata that syncs with your established workflows and project tracking tools. You can also invite an unlimited number of people to review your site deploys with Netlify’s Reviewer role. Stakeholders can open issues, items, or cards that sync with their preferred project tracking tools. The Netlify Drawer integrates with project tracking tools, such as GitHub, GitLab, GitLab self-hosted instances, Jira Software, Jira Server/Data Center, Azure DevOps, Trello, and more. Learn more about making your Deploy Previews and branch deploys more collaborative with the Netlify Drawer in our deploy collaboration docs. Production branch controlsSection titled “Production branch controls” By default, Netlify deploys your site’s production branch after every merge to the production branch. If you want to pause publishing your production branch, you can lock a deploy and stop auto-publishing to your site’s designated production branch. To change the production branch name, go to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. Branch deploy controlsSection titled “Branch deploy controls” You can set up a branch deploy for a specific branch or for all new branches in your repository through your project configuration. By default, Netlify will not generate a branch deploy unless a Developer or Owner has set up branch deploys for your site. Missing collaboration tools on your branch deploy? If you have an existing branch deploy that does not show the Netlify Drawer, try merging new changes into your branch to generate a refreshed branch deploy. For more help, check our troubleshooting docs. Set up a branch deploy for specific branchesSection titled “Set up a branch deploy for specific branches” To set up a branch deploy for one or more specific branches, such as staging or to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. Select Let me add individual branches and enter the name of each branch you want to deploy. You can also enter branch names you haven’t created yet in your repository. To deploy all branches with a specific prefix, add an asterisk to the end of your branch name, e.g. features/*. To confirm, select Save. Set up branch deploys for all new branchesSection titled “Set up branch deploys for all new branches” To automatically generate branch deploys for every new branch pushed to your remote site to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. Next to Branch deploys, select All. This excludes the designated production branch for your repository. To confirm, select Save. Turn off all branch deploys for your siteSection titled “Turn off all branch deploys for your site” To turn off all branch deploys for your to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. For Branch deploys, select None. To confirm, select Save. Protect all branch deploys with a passwordSection titled “Protect all branch deploys with a password” You can control who can access your site's branch deploys by requiring a password. Learn more at our Password Protection docs. Deploy Preview controlsSection titled “Deploy Preview controls” Netlify builds Deploy Previews by default for pull requests and merge requests. To learn how to configure Deploy Previews, review the Deploy Previews docs. Search engine indexingSection titled “Search engine indexing” Netlify automatically ensures that only your currently published production deploy and most recent branch deploys can be indexed by search engines. Requests to Deploy Previews, unpublished production deploys, and old branch deploys will have an header included in the response. Depending on how you use branch deploys, you may want to prevent even your most recent branch deploys from being indexed by search engines. You can do so by configuring custom headers in your branch. Deploy contextsSection titled “Deploy contexts” Deploy contexts give you the flexibility to configure your site’s builds depending on the context they are going to be deployed to. There are five predefined deploy : this context corresponds to the main site’s deployment, attached to the Git branch you set when the site is created. context corresponds to the previews we build for pull/merge requests and agent runs. context corresponds to deploys from branches that are not the site’s main production branch. context corresponds to Preview Server environments. context corresponds to local development environments run using Netlify Dev. Besides these predefined contexts, sites can also use branch names as custom deploy contexts. For example, a branch called staging will match a deploy context called staging. Deploy contexts allow you to override options from your site’s configuration including the build command, the environment variables added to the build, Build Plugin configuration, and more. Overrides are applied in a hierarchical order. The site’s global settings apply to each deploy, if we’re building the production site, and if you change options in your production context, they will be overridden. Only options that are set explicitly are overridden; if you leave one out, the build will use the value of the global settings or previous contexts. Environment variables are also overridden individually, for example, you can have access tokens as environment variables per context. To customize settings for each deploy context, create a file called netlify.toml in the root of your Git repository. There, you can set as many contexts as you want to configure. For environment variables, you can also set different values for each deploy context using the Netlify UI, CLI, or API. Note that, as the configuration file is stored in your repository, you should be mindful of what sensitive values you include. Where possible, we recommend you set sensitive environment variables with the Netlify UI, CLI, or API instead. # Production context:# All deploys from the main repository branch# will inherit these settings. Be mindful# when using this option and avoid committing# sensitive values to public source repositories.[context.production] command = \"make production\" [context.production.environment] ACCESS_TOKEN = \"super secret\" # Deploys from main branch run this plugin in the build. # Plugins context requires double brackets. [[context.production.plugins]] package = \"@netlify/plugin-sitemap\" # Deploy Preview context:# All deploys generated from a pull/merge request or agent run# will inherit these settings. Be mindful# when using this option and avoid committing# sensitive values to public source repositories.[context.deploy-preview.environment] ACCESS_TOKEN = \"not so secret\" # Branch deploy context:# All deploys that are not from a pull/merge request# or from the production branch will inherit these settings.[context.branch-deploy] command = \"make staging\" # Dev context:# Environment variables set here are available for local# development environments run using Netlify Dev. These# values can be overwritten on branches that have a more# specific branch context configured.[context.dev.environment] NODE_ENV = \"development\" # Specific branch context:# Deploys from this branch will take these settings# and override their current ones.[context.feature] command = \"make feature\" [context.\"features/branch\"] command = \"gulp\" File-based configuration settings will override those set in the UI. In the netlify.toml file, settings for more specific contexts will override more general ones. For example, settings for a specific branch will override those for branch-deploy. Visit our docs on file-based configuration to learn more about what you can do with deploy contexts. Deploy protectionSection titled “Deploy protection” Netlify gives you the ability to protect your site deploys with the following Traffic Rules, which protect your site by applying traffic rules to block or allow certain IP addresses or geographic locations to access your site deploys. Rate limiting, which protects your site by applying highly-customizable rate limiting rules Password Protection features, which protect your site by requiring site visitors to enter a basic universal password or their Netlify team login credentials to access your site deploys. Deploy permissionsSection titled “Deploy permissions” Netlify has a Deploy Request Policy that ensures that Netlify only builds and deploys changes pushed to private repositories from recognized authors. This policy applies to production deploys, branch deploys, and Deploy Previews. Builds from build hooks are not affected. Recognized authors include Owners, Developers, and Git Contributors. Netlify also treats bots from GitHub Marketplace as recognized authors in private repositories. Unrecognized authors, or non-team members, are people, automated services, or bots who are not associated with a Netlify team member account. This includes some Git-based services, like a CMS. This policy does not apply to build hooks. Deploys triggered by build hooks are treated as trusted deploys. Similar to the Sensitive Variables policy, the Deploy Request Policy treats deploys from unrecognized authors as \"untrusted.\" Working with deploy requests from non-team membersSection titled “Working with deploy requests from non-team members” When a non-team member merges a pull request that triggers a build, the subsequent deploy will have the status Pending approval on the Deploys page. The Deploy log will show a similar message of Deploy request is pending review. A pending deploy request can be approved by a Team Owner, who must associate the non-team member with a Netlify team account before the build can start. If the non-team member has an existing Netlify account, they can connect their Git provider account to their Netlify user. Depending on your team plan, a Team Owner can take the following actions for non-team them as Git Contributors and enable auto-approval for all deploy requests Match them to an existing team member Add them as a new Git Contributor Reject their pending deploy request Require manual review for deploy requestsSection titled “Require manual review for deploy requests” Team Owners can require that all deploy requests triggered by users who are not already Netlify team members are manually approved by a Team Owner. This ensures that your team is not charged for any Git Contributors unless they are manually approved. Learn more in this Billing FAQ. To require manual approval for all deploy to Team settings > Access & security > Visitor access > Auto-approve deploys from non-team members. Select Edit settings. Select Require approval, then Save. Enable auto-approval for deploy requestsSection titled “Enable auto-approval for deploy requests” Team Owners can allow all builds for non-team members to run and deploy without needing approval or prompting a deploy request. This automatically adds the non-team member to the team as a Git Contributor. Team members are free on the Credit Pro plan On the Credit Pro plan, you can add unlimited team member seats for free. Unlimited seats are included in your monthly subscription cost starting at $20/month for 3,000 credits. Learn more about Credit-based pricing plans, or see the April 2026 pricing update. Teams on plans that charge for Git Contributors, such as the Legacy Pro plan, will be charged for auto-approved Git Contributors. See the Billing FAQ page for details. Credit Pro includes unlimited team seats and is not charged for auto-approved Git Contributors. To enable auto-approval for all deploy to Team settings > Access & security > Visitor access > Auto-approve deploys from non-team members. Select Edit settings. Select Auto-approve, then Save. Match to an existing team memberSection titled “Match to an existing team member” To match an unrecognized author with an existing team to a sites’s Deploys page and find the pending deploy in the list of deploys. Select Start approval process. Next, use the Further action required drop-down menu to select Approve and match with existing team member. Use the list to select the existing team member to match. To confirm, select Match contributor and approve deploy. Add a non-team member as a Git ContributorSection titled “Add a non-team member as a Git Contributor” Not every Git committer in your repo must be added as a Git Contributor. Only the Git committer who you’d like to trigger a deploy needs to be added to your team as a Git Contributor. To add a non-team member as a Git to a sites’s Deploys page and find the pending deploy in the list of deploys. Select Start approval process. Next, use the Further action required drop-down menu to select Approve and add as Git Contributor. Git Contributors will appear on the Members page as Active Git Contributors. Reject a pending deploySection titled “Reject a pending deploy” To reject a non-team member’s pending deploy request, go to the Site overview page and select Reject next to the pending deploy. The pull/merge request or changes from a Git commit will not be deployed, even if it is merged, and any future deploys by the same contributor will continue to require approval. Sensitive variable policySection titled “Sensitive variable policy” For sites connected to public repositories, Netlify may block some deploys depending on sensitive variable policy settings. A site member can approve or reject these deploys. Check out our sensitive variable policy docs for more information. Netlify deploys as previewsSection titled “Netlify deploys as previews” Netlify previews allow you to test and review changes before launching your updates to your production web project. Types of previewsSection titled “Types of previews” TypeDescriptionDeploy PreviewPreview changes from a pull request, merge request, or an AI-powered site or app generatorBranch DeployPreview changes from a Git branch, such as for a release, optimized for multiple people making changesPreview ServerPreview changes live to share development or code changes with othersNetlify DrawerCollect and share feedback from Deploy Previews or Branch deploys to issue trackers/pull requests/merge requests/project toolsVisual Editor previewPreview changes in the Visual Editor Preview URL visibilitySection titled “Preview URL visibility” Preview URLs for Deploy Previews or Branch deploys can be shared with anyone with the link, unless you set up the protection team login protection Preview Server URLs require a Netlify login to preview. More site deploys resourcesSection titled “More site deploys resources” Create deploys Manage deploys Deploy Previews Split Testing Deploy notifications Post processing Compiled build and deploy resources - start here! Last 14, 2026 PreviousBeginner’s glossaryNextCompare preview options Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# Production context:# All deploys from the main repository branch# will inherit these settings. Be mindful# when using this option and avoid committing# sensitive values to public source repositories.[context.production]  command = \"make production\"  [context.production.environment]    ACCESS_TOKEN = \"super secret\"  # Deploys from main branch run this plugin in the build.  # Plugins context requires double brackets.  [[context.production.plugins]]    package = \"@netlify/plugin-sitemap\"\n# Deploy Preview context:# All deploys generated from a pull/merge request or agent run# will inherit these settings. Be mindful# when using this option and avoid committing# sensitive values to public source repositories.[context.deploy-preview.environment]  ACCESS_TOKEN = \"not so secret\"\n# Branch deploy context:# All deploys that are not from a pull/merge request# or from the production branch will inherit these settings.[context.branch-deploy]  command = \"make staging\"\n# Dev context:# Environment variables set here are available for local# development environments run using Netlify Dev. These# values can be overwritten on branches that have a more# specific branch context configured.[context.dev.environment]  NODE_ENV = \"development\"\n# Specific branch context:# Deploys from this branch will take these settings# and override their current ones.[context.feature]  command = \"make feature\"\n[context.\"features/branch\"]  command = \"gulp\"\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.151Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":13,"estimatedTokens":8174}}11{"id":"doc-api_cli_guides_netlify_docs-0a491787","source":"documentation","title":"API & CLI Guides | Netlify Docs","url":"https://docs.netlify.com/api-and-cli-guides/overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI API & CLI guides API & CLI guides Overview API guides Get started with API Deploy project from a zip file with API Deploy zip file to production More API guides API reference docs Go client JS client CLI guides Get started with CLI Local development Manage functions Debug with VSCode More CLI guides CLI reference docs On this page Overview API Guides CLI Guides On this page Overview API Guides CLI Guides For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 API And CLI Guides / API & CLI Guides Copy page View as Markdown Copy as Markdown View as Markdown Learn best practices from our guides on working with the Netlify API & CLI. API GuidesSection titled “API Guides” Learn how to integrate with Netlify's REST API to programmatically manage your projects, deploys, and more. You can also start a new project directly from the Netlify API as the video link below shows. CLI GuidesSection titled “CLI Guides” Discover how to use the Netlify CLI for local development, deploy and project management. You can also start a new project directly from the Netlify CLI as the video link below shows. Last 25, 2025 PreviousBecome AI partnerNextGet started with API Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.158Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":674}}12{"id":"doc-command_palette_netlify_docs-45fab59a","source":"documentation","title":"Command Palette | Netlify Docs","url":"https://docs.netlify.com/command-palette","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI On this page Overview Get started Use the Command Palette Command scope Custom keyboard shortcuts On this page Overview Get started Use the Command Palette Command scope Custom keyboard shortcuts For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Command Palette Copy page View as Markdown Copy as Markdown View as Markdown The Command Palette is a convenience tool that gives you quick navigation through the Netlify UI and access to various commands. Here are some examples of actions with the Command to any project on any of your teams Navigate directly to a deeply-nested feature or setting Search the docs, blog, and support forums from within the Netlify UI Toggle between light and dark themes Set custom keyboard shortcuts to quickly jump between sections of the Netlify UI Get startedSection titled “Get started” While using the Netlify UI, you can access the Command Palette at any time in two press command+K on macOS, or ctrl+K on Windows and Linux. In the navigation, select the search input. Either method will enable the Command Palette in the center of your browser window. To close the Command Palette, complete an action, press your keyboard shortcut again, or press esc. Use the Command PaletteSection titled “Use the Command Palette” After opening the Command Palette, start entering text to filter the list of available commands, then select a command from the list. Tip You can search for a project by typing its name right away. You don’t need to select the Search projects... command first. Command scopeSection titled “Command scope” Some commands become available based on the context of where you are in the Netlify UI. For example, searching for Functions or Forms is only available once you navigate to a project in the Netlify UI. Similarly, commands to open a deploy’s Git repository or pull/merge request in a new tab are only available if you’ve navigated to a deploy for a project connected to a Git repository for continuous deployment. If you want to edit a project-specific setting — such as changing environment variables — navigate to the project first by entering the project name and selecting it from the filtered list. You can then search for environment variables and jump directly to the project’s list of variables. Custom keyboard shortcutsSection titled “Custom keyboard shortcuts” To achieve repetitive tasks faster, set up custom keyboard shortcuts (available to trackpad and mouse users only). For example, if you find yourself frequently navigating to your team’s build usage & insights page, you can assign the keyboard shortcut B to that page to get there the Command Palette, find “Builds usage & insights”, and hover over the right side of the entry. Select Add shortcut and then type the desired keyboard shortcut. Next time you type B, you will navigate to the Builds > Usage & insights page directly. Last 26, 2025 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.160Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1103}}13{"id":"doc-forms_setup_netlify_docs-9a5b2f33","source":"documentation","title":"Forms setup | Netlify Docs","url":"https://docs.netlify.com/manage/forms/setup","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Forms Forms Setup Submissions Notifications Spam filters Troubleshooting tips Usage and billing On this page Overview Automatic form detection Enable form detection Disable form detection Re-enable form detection HTML forms Submit HTML forms with AJAX JavaScript forms Forms for Next.js or SSR frameworks Work with JavaScript-rendered forms Submit JavaScript-rendered forms with AJAX Success messages Custom success page Custom success alert File uploads File upload security Limitations Submit file uploads with AJAX Set up notifications Review forms usage More Forms resources On this page Overview Automatic form detection Enable form detection Disable form detection Re-enable form detection HTML forms Submit HTML forms with AJAX JavaScript forms Forms for Next.js or SSR frameworks Work with JavaScript-rendered forms Submit JavaScript-rendered forms with AJAX Success messages Custom success page Custom success alert File uploads File upload security Limitations Submit file uploads with AJAX Set up notifications Review forms usage More Forms resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Forms / Forms setup Copy page View as Markdown Copy as Markdown View as Markdown Netlify’s serverless form handling allows you to manage forms without extra API calls or additional JavaScript. Once enabled, the built-in form detection feature allows our build system to automatically parse your HTML at deploy time, so there’s no need for you to make an API call or include extra JavaScript on your site. To get started, enable automatic form detection and then add a netlify attribute to your HTML form. Wondering how Netlify handles form submissions? Visit our form submissions doc to learn more about the form submissions UI, API endpoints, and more. Automatic form detectionSection titled “Automatic form detection” If you would like Netlify to automatically manage your form submissions, you need to enable form detection. Enable form detectionSection titled “Enable form detection” To enable form detection for your the Netlify UI, go to Forms. Select Enable form detection. Starting with your next site deploy, Netlify will automatically scan your deploys for forms that require submission handling. If you previously used Netlify Forms and disabled automatic form detection, follow the steps to re-enable form detection and start accepting submissions again. Disable form detectionSection titled “Disable form detection” You may want to disable form detection if your site doesn’t have forms anymore or if you decide not to use Netlify to manage your forms. Disabling form detection will reduce post processing and may speed up deploys. To disable form detection for your the Netlify UI, go to Forms > Usage and configuration > Form detection. Select Disable form detection. A confirmation prompt will appear. To continue, enter the name of your site and select Disable form detection. Starting with your next site deploy, Netlify will no longer scan your deploys for forms and will disable form submission handling for any new or updated forms. Warning Disabling form detection is intended only for sites that don’t use Netlify Forms. If your site does use Netlify Forms, we recommend removing forms from your site code or altering your code to handle submissions by other means before disabling form detection. Re-enable form detectionSection titled “Re-enable form detection” If you previously used Netlify Forms and disabled automatic form detection, follow these steps to re-enable form the Netlify UI, go to Forms > Usage and configuration > Form detection. Select Enable form detection. Redeploy your site. Once you redeploy your site, Netlify will automatically scan your deploys for forms and start accepting submissions again. HTML formsSection titled “HTML forms” Once you enable form detection, add an HTML form to your site with a data-netlify=\"true\" or a netlify attribute in the <form> tag. Deploy your site with that form included and you can start receiving submissions in your Netlify site admin panel. Your form’s name attribute determines what we call the form in the Netlify UI. If you have more than one form on a site, each form should have a different name attribute. Here’s an example of how to use the data-netlify=\"true\" attribute or the netlify attribute in your with data-netlify attribute Form with netlify attribute <form name=\"contact\" method=\"POST\" data-netlify=\"true\"> <p> <label>Your Name: <input type=\"text\" name=\"name\" /></label> </p> <p> <label>Your Email: <input type=\"email\" name=\"email\" /></label> </p> <p> <label>Your Role: <select name=\"role[]\" multiple> <option value=\"leader\">Leader</option> <option value=\"follower\">Follower</option> </select></label> </p> <p> <label>Message: <textarea name=\"message\"></textarea></label> </p> <p> <button type=\"submit\">Send</button> </p></form> <form name=\"contact\" method=\"POST\" netlify> <p> <label>Your Name: <input type=\"text\" name=\"name\" /></label> </p> <p> <label>Your Email: <input type=\"email\" name=\"email\" /></label> </p> <p> <label>Your Role: <select name=\"role[]\" multiple> <option value=\"leader\">Leader</option> <option value=\"follower\">Follower</option> </select></label> </p> <p> <label>Message: <textarea name=\"message\"></textarea></label> </p> <p> <button type=\"submit\">Send</button> </p></form> When Netlify parses the static HTML for a form you’ve added, the build system automatically strips the data-netlify=\"true\" or netlify attribute from the <form> tag and injects a hidden input named form-name. In the resulting HTML that’s deployed, the data-netlify=\"true\" or netlify attribute is gone, and the hidden form-name input’s value matches the name attribute of <form> like this: <input type=\"hidden\" name=\"form-name\" value=\"contact\" /> Submit HTML forms with AJAXSection titled “Submit HTML forms with AJAX” You don’t have to, but you can submit static HTML forms using AJAX. A static HTML form submitted this way must have data-netlify=true or a netlify attribute inside its <form> tag. For an example of how to set these attributes, review the HTML forms section. Here’s an AJAX form submission example using the fetch API for a static HTML handleSubmit = event => { event.preventDefault(); const myForm = event.target; const formData = new FormData(myForm); fetch(\"/\", { method: \"POST\", headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" }, URLSearchParams(formData).toString() }) .then(() => console.log(\"Form successfully submitted\")) .catch(error => alert(error));}; document.querySelector(\"form\").addEventListener(\"submit\", handleSubmit); Requirements for the body of the request must be URL-encoded. In the above example, the form is passed to a FormData constructor. That object is then encoded using the URLSearchParams constructor and converted to a string. Note that Netlify Forms does not support JSON form data at this time. If the form accepts alphanumeric data only, the request should include the header \"Content-Type\": \"application/x-www-form-urlencoded\". If the form accepts file uploads, including a Content-Type header is not recommended. JavaScript formsSection titled “JavaScript forms” You don’t need to include extra JavaScript on your site to use Netlify Forms. But, if you want to, you can use JavaScript to render a form client-side. You can also submit JavaScript-rendered forms over AJAX. Forms for Next.js or SSR frameworksSection titled “Forms for Next.js or SSR frameworks” If you’re using a pure JavaScript form or SSR (Server Side Rendering), you must include an HTML form that meets this HTML form criteria, including all the input tags with the same names as the JavaScript form. For instructions and examples specific to Next.js 13.5 and above, visit breaking changes for the Next.js runtime. Work with JavaScript-rendered formsSection titled “Work with JavaScript-rendered forms” The Netlify build system finds your forms by parsing the HTML of your site when the build completes. This means that if you’re using JavaScript to render a form client-side, our build system won’t find it in the pre-built files. You can work around a hidden HTML form with the data-netlify=\"true\" attribute or a netlify attribute and input fields with name attributes to match the inputs of your JavaScript-rendered form. You need to apply the same work around if you want to use our reCAPTCHA 2 integration, and create a div element in the hidden HTML with the data-netlify-recaptcha=\"true\" attribute. Add a hidden input to the JavaScript-rendered form or JSX form: <input type=\"hidden\" name=\"form-name\" value=\"name_of_my_form\" /> You can also find related tutorials on our to Integrate Netlify’s Form Handling in a React App How to Integrate Netlify forms in a Vue App While the two articles are fairly framework-specific, the code demonstrates how to prerender forms when working with them in a web application. Submit JavaScript-rendered forms with AJAXSection titled “Submit JavaScript-rendered forms with AJAX” To submit a JavaScript-rendered form built with a framework like Gatsby or Nuxt, you can send an AJAX POST request to any path on your site. Requirements for the need to URL-encode your form data in the body of the request. If you haven’t added a hidden form-name input to your JavaScript-rendered form, you need to send a form-name attribute in the AJAX POST request body. If the form accepts alphanumeric data only, the request should include the header \"Content-Type\": \"application/x-www-form-urlencoded\". If the form accepts file uploads, including a Content-Type header is not recommended. Here’s an AJAX form submission code sample using the fetch API for a JavaScript-rendered form. It uses Gatsby’s navigate function to redirect to a custom page on form submission success. const handleSubmit = event => { event.preventDefault(); const myForm = event.target; const formData = new FormData(myForm); fetch(\"/\", { method: \"POST\", headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" }, URLSearchParams(formData).toString() }) > <input type=\"hidden\" name=\"form-name\" value=\"pizzaOrder\" /> <label> What order did the pizza give to the pineapple? <input name=\"order\" type=\"text\" onChange={handleChange} /> </label> <input type=\"submit\" /> </form>); In the code sample above, a handleChange function updates the form’s state, which ultimately gets sent in a POST request to Netlify. Success messagesSection titled “Success messages” By default, when visitors complete a form, they are redirected to a page with a generically styled success message with a link back to the form page. Custom success pageSection titled “Custom success page” You can replace the default success page with a custom page you create by adding an action attribute to the <form> tag, entering the path of your custom page (like \"/pages/success\") as the value. The path must be relative to the site root, starting with a /. Here’s an example: <form name=\"contact\" action=\"/pages/success\" method=\"POST\" data-netlify=\"true\"></form> If you submit your form using AJAX, reference this Gatsby-specific example of how to set a custom success page. Custom success alertSection titled “Custom success alert” If you use AJAX to submit the form, you can substitute an alert instead of redirecting to a generic or custom page. Here’s an example for an HTML handleSubmit = event => { event.preventDefault(); const myForm = event.target; const formData = new FormData(myForm); fetch(\"/\", { method: \"POST\", headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" }, URLSearchParams(formData).toString() }) .then(() => alert(\"Thank you for your submission\")) .catch(error => alert(error));}; document.querySelector(\"form\").addEventListener(\"submit\", handleSubmit); File uploadsSection titled “File uploads” Netlify Forms can receive files uploaded with form submissions. To do this, add an input with type=\"file\" to any form. Although most browsers will detect the encoding automatically, you can optionally include enctype=\"multipart/form-data\" in the <form> tag, Here’s a sample HTML form with a file upload field: <form name=\"fileForm\" enctype=\"multipart/form-data\" data-netlify=\"true\"> <p> <label> <span>Name:</span> <input name=\"name\" type=\"text\" /> </label> </p> <p> <label> <span>Add file:</span> <input name=\"file\" type=\"file\" /> </label> </p> <button>Submit</button></form><p class=\"result\"></p> File upload securitySection titled “File upload security” Forms that accept file uploads that contain personally identifiable information (PII) require additional security configuration. We recommend using the Very Good Security integration for this type of secure form upload. LimitationsSection titled “Limitations” Keep the following considerations in mind when working with file uploads in forms. Only one file upload per field is supported. For multiple file uploads, use multiple fields. The form request has a maximum size limit of 8 MB. File uploads time out after 30 seconds. Submit file uploads with AJAXSection titled “Submit file uploads with AJAX” When submitting a form with a file upload, including a Content-Type header is not recommended. The browser should detect and set the Content-Type automatically. Here’s an AJAX form submission code sample using the fetch API for the above HTML form with file (\"submit\", event => { event.preventDefault(); const result = document.querySelector(\".result\"); fetch(\"/\", { FormData(event.target), method: \"POST\" }) ) );}); Set up notificationsSection titled “Set up notifications” To monitor the content of your form submissions, you can set up notifications to send the content of the form submissions to an email address or to an external service with an HTTP POST request. Learn more about forms notifications. To set up notifications for your site’s form your site go to Configuration > Notifications > Form submission notifications, and select Add notification. Review forms usageSection titled “Review forms usage” For the last month (or billing period), you can review how many verified form submissions were made and the total storage size of all files uploaded. For your site, go to Forms > Usage and configuration > Usage. Learn more about reviewing and managing forms usage. More Forms resourcesSection titled “More Forms resources” Spam filters Form submissions Form submission notifications Form-triggered functions Troubleshooting tips Forms usage and billing Last 14, 2025 PreviousSet up Preview Server for content sitesNextSubmissions Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n<form name=\"contact\" method=\"POST\" data-netlify=\"true\">  <p>    <label>Your Name: <input type=\"text\" name=\"name\" /></label>  </p>  <p>    <label>Your Email: <input type=\"email\" name=\"email\" /></label>  </p>  <p>    <label>Your Role: <select name=\"role[]\" multiple>      <option value=\"leader\">Leader</option>      <option value=\"follower\">Follower</option>    </select></label>  </p>  <p>    <label>Message: <textarea name=\"message\"></textarea></label>  </p>  <p>    <button type=\"submit\">Send</button>  </p></form>\n```\n\nExample:\n```text\n<form name=\"contact\" method=\"POST\" netlify>  <p>    <label>Your Name: <input type=\"text\" name=\"name\" /></label>  </p>  <p>    <label>Your Email: <input type=\"email\" name=\"email\" /></label>  </p>  <p>    <label>Your Role: <select name=\"role[]\" multiple>      <option value=\"leader\">Leader</option>      <option value=\"follower\">Follower</option>    </select></label>  </p>  <p>    <label>Message: <textarea name=\"message\"></textarea></label>  </p>  <p>    <button type=\"submit\">Send</button>  </p></form>\n```\n\nExample:\n```text\n<input type=\"hidden\" name=\"form-name\" value=\"contact\" />\n```\n\nExample:\n```text\nconst handleSubmit = event => {  event.preventDefault();\n  const myForm = event.target;  const formData = new FormData(myForm);\n  fetch(\"/\", {    method: \"POST\",    headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },    body: new URLSearchParams(formData).toString()  })    .then(() => console.log(\"Form successfully submitted\"))    .catch(error => alert(error));};\ndocument.querySelector(\"form\").addEventListener(\"submit\", handleSubmit);\n```\n\nExample:\n```text\n<input type=\"hidden\" name=\"form-name\" value=\"name_of_my_form\" />\n```\n\nExample:\n```text\nconst handleSubmit = event => {  event.preventDefault();\n  const myForm = event.target;  const formData = new FormData(myForm);\n  fetch(\"/\", {    method: \"POST\",    headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },    body: new URLSearchParams(formData).toString()  })    .then(() => navigate(\"/thank-you/\"))    .catch(error => alert(error));};\n```\n\nExample:\n```text\nreturn (  <form    data-netlify=\"true\"    name=\"pizzaOrder\"    method=\"post\"    onSubmit={handleSubmit}  >    <input type=\"hidden\" name=\"form-name\" value=\"pizzaOrder\" />    <label>      What order did the pizza give to the pineapple?      <input name=\"order\" type=\"text\" onChange={handleChange} />    </label>    <input type=\"submit\" />  </form>);\n```\n\nExample:\n```text\n<form  name=\"contact\"  action=\"/pages/success\"  method=\"POST\"  data-netlify=\"true\"></form>\n```\n\nExample:\n```text\nconst handleSubmit = event => {  event.preventDefault();\n  const myForm = event.target;  const formData = new FormData(myForm);\n  fetch(\"/\", {    method: \"POST\",    headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },    body: new URLSearchParams(formData).toString()  })    .then(() => alert(\"Thank you for your submission\"))    .catch(error => alert(error));};\ndocument.querySelector(\"form\").addEventListener(\"submit\", handleSubmit);\n```\n\nExample:\n```text\n<form name=\"fileForm\" enctype=\"multipart/form-data\" data-netlify=\"true\">  <p>    <label>      <span>Name:</span>      <input name=\"name\" type=\"text\" />    </label>  </p>  <p>    <label>      <span>Add file:</span>      <input name=\"file\" type=\"file\" />    </label>  </p>  <button>Submit</button></form><p class=\"result\"></p>\n```\n\nExample:\n```text\ndocument.forms.fileForm.addEventListener(\"submit\", event => {  event.preventDefault();  const result = document.querySelector(\".result\");  fetch(\"/\", {    body: new FormData(event.target),    method: \"POST\"  })    .then(() => {      result.innerText = \"Success\";    })    .catch(error => {      result.innerText = `Failed: ${error}`;    });});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.161Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":11,"totalLines":66,"estimatedTokens":4939}}14{"id":"doc-migrate_sites_and_projects_overview_netlify_docs-7accde55","source":"documentation","title":"Migrate sites and projects overview | Netlify Docs","url":"https://docs.netlify.com/resources/migrate/overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Migrate Migrate Overview Vercel to Netlify migration with AI agent On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Migrate / Migrate sites and projects overview Copy page View as Markdown Copy as Markdown View as Markdown Get support migrating your projects to Netlify. We want to help you make this transition smooth. For custom questions not covered by documentation, reach out to Netlify Support. Get answers from our Ask Netlify AI bot that answers questionsbased on our docs and official Support a conversation Last 12, 2026 PreviousSupportNextVercel to Netlify migration with AI agent Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.162Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":546}}15{"id":"doc-checklists_overview_netlify_docs-383521e2","source":"documentation","title":"Checklists overview | Netlify Docs","url":"https://docs.netlify.com/resources/checklists/overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Checklists Checklists Overview Production checklist Onboard to Pro checklist Security checklist Vercel to Netlify migration checklist On this page Overview Available checklists On this page Overview Available checklists For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Checklists / Checklists overview Copy page View as Markdown Copy as Markdown View as Markdown Ensure your Netlify projects are secure and ready for production with our checklists. Use them to plan your projects or to give your AI tools or agents to further customize or check for completeness. Available checklistsSection titled “Available checklists” Production checklist - Essential steps before launching your project to production Onboard to Pro checklist - Get your team set up for collaboration, billing stability, and production readiness on Netlify Pro Security checklist - Security best practices for your Netlify projects Last 1, 2026 PreviousVercel to Netlify migration with AI agentNextProduction checklist Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.162Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":634}}16{"id":"doc-release_phases_netlify_docs-590228a1","source":"documentation","title":"Release Phases | Netlify Docs","url":"https://docs.netlify.com/release-phases","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI On this page Overview Beta Private beta Public beta Early access General availability Deprecated End of service On this page Overview Beta Private beta Public beta Early access General availability Deprecated End of service For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Release Phases Copy page View as Markdown Copy as Markdown View as Markdown As part of the product lifecycle, Netlify offers features and functionality at different stages of development. Features may go through all phases or just some. The product lifecycle covers everything from significant new services on our platform to minor updates like a new flag in our command line interface (CLI). This page serves as a reference to define each release phase. BetaSection titled “Beta” Beta features are still under development. They are ready for testing and use in projects that are not mission critical. Netlify uses two beta release and public. Private betaSection titled “Private beta” Private beta features are enabled individually for selected users or teams with internal approval. Netlify uses this phase to gather qualitative feedback to guide development. Certain private beta features may use Netlify Labs to enable access. Outages within the feature or sites using the feature are possible, but these should not impact other sites or systems. Breaking changes are likely to occur. Public betaSection titled “Public beta” Features in public beta are available to all users, although certain features or functionality may be available only for teams on specific pricing plans. Netlify uses the public beta phase to gather higher-volume qualitative feedback, aggregate usage data, and perform error monitoring. Features in public beta may be automatically enabled for all users, or they may require opting in through Netlify Labs or another mechanism. Although we aim for production quality and stability, they aren’t guaranteed at this release phase. Bugs are expected, and breaking changes are possible. Early accessSection titled “Early access” When we’re making significant changes and improvements to an existing feature, we may make an Early Access version of the feature available for users to opt-in and start using early. Each Early Access feature may have its own specific opt-in or rollout process. General availabilitySection titled “General availability” At the general availability phase, features are production-ready for mission critical applications. They meet Netlify standards for production quality and stability and abide by our service-level agreements. Breaking changes are unlikely and require significant prior notice. Versioned services such as Netlify CLI, Netlify REST API, and related clients and SDKs follow semantic versioning. While there are multiple releases available for these services, we recommend that you use the latest version. DeprecatedSection titled “Deprecated” A feature or functionality marked as deprecated is still available, but we don’t recommend its continued use or adoption for new use cases. Before any deprecated feature reaches end of service, Netlify provides time and guidance to migrate off. While breaking changes are unlikely until a service is shut down, there may be degraded quality and stability during a deprecation period. End of serviceSection titled “End of service” A feature at the end of service phase is no longer available or supported. Last 19, 2025 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.163Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1235}}17{"id":"doc-browse_prompt_templates_netlify_docs-cf96854e","source":"documentation","title":"Browse Prompt Templates | Netlify Docs","url":"https://docs.netlify.com/prompt-templates/browse/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Build with AI Build with AI Overview Agent Runners Overview Make changes with Agent Runners Create a repo from Netlify Prompt examples Troubleshoot Prompt Templates Browse Manage Agent setup guides Overview Claude Code Codex Claude Web Claude Desktop Claude Design ChatGPT Antigravity Antigravity CLI AI Gateway Prototyping best practices Manage AI features Overview Claude admin configuration Security and privacy for AI features Block AI crawlers For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Prompt Templates / Browse Prompt Templates Prompt templates are reusable prompts contributed by teams and the community. Each template includes variable placeholders that you can customize for your specific use case. 0 templatesLoading templates... PreviousTroubleshootNextManage Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.163Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":579}}18{"id":"doc-troubleshooting_netlify_docs-88882983","source":"documentation","title":"Troubleshooting | Netlify Docs","url":"https://docs.netlify.com/resources/troubleshooting/overview","text":"Example:\n```text\nPage not foundLooks like you’ve followed a broken link or entered a URL that doesn’t exist on this site.If this is your site, and you weren’t expecting a 404 for this path, please visit Netlify’s “page not found” support guide for troubleshooting tips.\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.164Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":1,"totalLines":6,"estimatedTokens":72}}19{"id":"doc-compare_preview_options_netlify_docs-af367cdd","source":"documentation","title":"Compare preview options | Netlify Docs","url":"https://docs.netlify.com/deploy/compare-preview-options","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview Preview options Preview URLs On this page Overview Preview options Preview URLs For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Compare preview options Copy page View as Markdown Copy as Markdown View as Markdown Compare preview options to choose the right preview for your workflow, stakeholders, and review needs. Different deployments can offer different preview experiences and other options. There are also preview options that are not a deployment on Netlify that you may find helpful in certain cases or at certain points of your workflow. Preview optionsSection titled “Preview options” Preview optionAccessStarts fromOptimized forDeploy PreviewAnyone with Preview URL unless you’re protecting deploysPull request, merge request, agent runReviewing and sharing changes from a pull request, merge request, or agent runBranch deployAnyone with Preview URL unless you’re protecting deploysBranchSteady set of batched changes, such as for an early releaseLocal developmentYouTerminalConfirming code works for framework, solo developmentPreview ServerNetlify teamPreview ServerLive content updates shared between developer & content stakeholders Preview URLsSection titled “Preview URLs” Preview optionPreview URLDeploy PreviewFor previews built from pull/merge ://deploy-preview-1234--my-site.netlify.app For previews built from agent ://agent-69a6140cc823ebba94b8ef32--my-site.netlify.appBranch deployhttps://branch-1234--my-site.netlify.appLocal developmentDepends on your framework. For example, an Astro site can be http://localhost:4321/.Preview Serverhttps://devserver-branchname--my-site.netlify.app Last 30, 2026 PreviousDeploy overviewNextProduction deploy Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.164Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":896}}20{"id":"doc-framework_setup_netlify_docs-41cefd84","source":"documentation","title":"Framework setup | Netlify Docs","url":"https://docs.netlify.com/start/framework-setup","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Start Start Choose your path What is Netlify? Quickstarts Netlify Drop Quickstart Create a new project with an AI agent Iterate on a project with an AI agent Deploy from your repository Deploy from AI code generation tool Create a repo from Netlify Core Concepts Version control Primitives Framework setup guides Agent setup guides Netlify CLI Netlify API Beginner’s glossary On this page Overview Framework support Environment variable best practices Support Enhancing framework support On this page Overview Framework support Environment variable best practices Support Enhancing framework support For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Start / Framework setup Copy page View as Markdown Copy as Markdown View as Markdown Netlify auto-detects your framework and will set up default configuration for that framework. In cases where you want to further develop your project or customize how your project works, you can check out framework docs for your project. Framework supportSection titled “Framework support” Netlify is framework-agnostic, meaning you shouldn't be limited by the current framework you choose. Netlify supports the following Astro Eleventy Express Gatsby Hugo Hydrogen Next.js Nuxt React React Router Remix SvelteKit TanStack Start Vite Vue CLI Netlify technically supports additional frameworks, but we don't have a guide for them all. If it’s a modern framework or even just HTML, CSS, and basic JS, it should work on Netlify. For detailed setup instructions and framework-specific configuration, visit the individual framework guide pages above. Environment variable best practicesSection titled “Environment variable best practices” Learn best practices for using environment variables with environment variables with frameworks SupportSection titled “Support” To help you determine if you need Support from your Framework vs. Netlify, you can try the your project locally to see if it works Check the documentation for your framework Search for an existing question on our Support Forums Enhancing framework supportSection titled “Enhancing framework support” If you need to enhance the framework support for your project, you can use the Frameworks API, which is designed for Framework authors and collaborators to help build adapters to make building and deploying on Netlify smoother for your framework. Last 30, 2026 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.165Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":974}}21{"id":"doc-netlify_platform_primitives_netlify_docs-6a5001d1","source":"documentation","title":"Netlify Platform Primitives | Netlify Docs","url":"https://docs.netlify.com/start/core-concepts/primitives","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Start Start Choose your path What is Netlify? Quickstarts Netlify Drop Quickstart Create a new project with an AI agent Iterate on a project with an AI agent Deploy from your repository Deploy from AI code generation tool Create a repo from Netlify Core Concepts Version control Primitives Framework setup guides Agent setup guides Netlify CLI Netlify API Beginner’s glossary On this page Overview Functions Edge Functions Background Functions Scheduled Functions Image CDN Blobs Netlify Database Caching Stale while revalidate (SWR) On-demand cache invalidation Durable cache Support in web frameworks Preview Servers On this page Overview Functions Edge Functions Background Functions Scheduled Functions Image CDN Blobs Netlify Database Caching Stale while revalidate (SWR) On-demand cache invalidation Durable cache Support in web frameworks Preview Servers For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Start / Core Concepts / Netlify Platform Primitives Copy page View as Markdown Copy as Markdown View as Markdown If you're evaluating Netlify or deciding which platform features to use in your project, this doc gives you a tour of what the platform can do. Explain like I'm new to web devNetlify's platform primitives are the building blocks that power what you can build on Netlify. Understanding these primitives can help you and your AI agents build and debug custom high-performance web experiences. OverviewSection titled “Overview” Netlify Platform Primitives are framework-agnostic runtime features of our platform. They are used in our framework adapters to offer consistent functionality and freedom regardless of your chosen framework. These primitives can also be used directly to transform stale pages and static pages into dynamic experiences that best suit your architectural strategy and : Use serverless functions to add dynamic behavior to your site. Functions can be used for server-side rendering, API endpoints, and more. Edge Functions connect our platform with an open runtime standard at the network edge, allowing fast, personalized web experiences in a dev ecosystem. Background Background Functions for long-running serverless functions that handle tasks like batch processing, scraping, and more. Scheduled Scheduled Functions to run serverless functions on a regular and consistent schedule, like a cron job. Image images on demand without impacting build times. Handle content negotiation automatically. and retrieve unstructured data. Use blob storage as a simple key/value store or basic database. Netlify serverless Postgres database with deep integration into the Netlify workflow, including branching, automated backups, and team guardrails. Fine-Grained cache behavior, including Stale-While-Revalidate (SWR), on-demand cache invalidation, a programmatic Cache API, and more. FunctionsSection titled “Functions” With Netlify Functions, your serverless functions are version-controlled, built, and deployed along with the rest of your Netlify site, and we will automatically handle service discovery through our built-in API gateway. This eliminates overhead and brings the power of Deploy Previews and rollbacks to your functions. During a build, we automatically generate functions for web frameworks that support server-side rendering and/or API endpoints. This is done through a build plugin or adapter for that framework. If you are using a framework that does not support server-side rendering, you can still add dynamic behavior by creating functions directly. Functions resources Refer to the following resources to learn more about Netlify to Functions Getting started with Functions Functions API reference Or start building with one of our platform starters. Edge FunctionsSection titled “Edge Functions” Edge Functions connect the Netlify platform and workflow with an open runtime standard at the network edge. This enables you to build fast, personalized web experiences with an ecosystem of development tools. Using TypeScript and JavaScript, you can modify network requests to localize content, serve relevant ads, authenticate users, personalize content, redirect visitors, and much more. Edge Functions also support a new generation of edge-first web frameworks allowing your entire app to run at the edge, dramatically increasing performance in many cases. All this dynamic processing happens in a secure runtime based on Deno directly from the worldwide network edge location closest to each user for fast response times. Plus, you have the option to cache edge function responses for even faster response times. With Netlify, your edge functions are version-controlled, built, and deployed along with the rest of your Netlify site. This eliminates overhead and brings the power of Deploy Previews and rollbacks to your edge functions. Edge Functions resources Refer to the following resources to learn more about Netlify Edge to Edge Functions Getting started with Edge Functions Edge Functions API reference Or start building with one of our platform starters. Background FunctionsSection titled “Background Functions” This feature is available on Credit-based plans, including Free, Personal, and Pro and on Enterprise plans. Learn more. Netlify’s Background Functions provide an option for serverless functions that run for up to 15 minutes and don’t need to complete before a visitor can take next steps on your site. For tasks like batch processing, scraping, and slower API workflow execution, they may be a better fit than synchronous functions. Learn more about Background Functions→ Scheduled FunctionsSection titled “Scheduled Functions” This feature is available on all pricing plans. Scheduled Functions is a feature of Netlify Functions that enables you to run functions on a regular and consistent schedule, much like a cron job. Scheduled functions can do almost anything that serverless functions do today, though some tasks are better suited to scheduled functions than others. For example, you may want a set of APIs to collate data for a report at the end of every week Backup data from one data store to another at the end of every night Build and/or deploy all your static content every hour instead of for every authored or merged pull request Or anything else you can imagine you might want to invoke on a regular basis! Learn more about Scheduled Functions→ Image CDNSection titled “Image CDN” With Netlify Image CDN, you can transform images on demand without impacting build times. Netlify Image CDN also handles content negotiation to use the most efficient image format for the requesting client. Optimizing the size and format of your images improves both the runtime performance and reliability of your site. Transformations are integrated natively into the CDN so that repeated requests leverage layers of caching for improved performance. Many frameworks on Netlify use Netlify Image CDN to power image optimization and transformation. Image CDN resources Refer to the following resources to learn more about Netlify Image to Image CDN Image CDN usage reference Creating an Image CDN integration Or start building with one of our platform starters. BlobsSection titled “Blobs” With Netlify Blobs, you can store and retrieve blobs and unstructured data. You can also use this feature as a simple key/value store or basic database. Netlify Blobs is a highly-available data store optimized for frequent reads and infrequent writes. For maximum flexibility, it offers a configurable consistency model. If multiple write calls to the same key are issued, the last write wins. We automatically handle provisioning, configuration, and access control for you. This integrated zero-configuration solution helps you focus on building business value in your project rather than toil on setting up and scaling a separate blob storage solution. Blobs resources Refer to the following resources to learn more about Netlify to Blobs Blobs API reference Or start building with one of our platform starters. Netlify DatabaseSection titled “Netlify Database” Netlify Database is available on Credit-based plans only. When a database is active, it consumes credits for the compute and bandwidth used. However, database storage space (i.e., the size of data stored) is free until July 1, 2026. Learn more in our billing and usage docs. Netlify Database offers a production-grade serverless database instance that you or a code agent can instantly set up and deploy with a single command. Netlify Database automatically connects to your functions and environment variables, making it ideal for fast development and automated scaffolding. Learn more about Netlify Database→ CachingSection titled “Caching” Netlify’s global caching infrastructure is built to provide stellar performance without any stale pages or broken assets for your visitors. Static asset responses on Netlify are cached on Netlify’s global edge nodes and automatically invalidated whenever a deploy changes the content. However, responses coming from Netlify Functions, Edge Functions, and proxies are not cached by default, because these responses are dynamic and their content may change per request. To cache these dynamic responses, we offer fine-grained cache controls via response headers. These controls go from basic, common capabilities (such as setting a maximum age for content) to state-of-the art patterns such as on-demand invalidation. All caching features follow web standards as much as possible. Additionally, you can use the Cache API to programmatically store the responses from network calls made within your function or edge function code. Here are a few key caching while revalidate (SWR)Section titled “Stale while revalidate (SWR)” Stale while revalidate is a caching pattern, set via response headers, that allows the cache to keep serving a stale object out of the cache while the object is revalidated in the background. This can be impactful for implementing API caching or patterns like incremental static regeneration (ISR). Learn more about the stale while revalidate directive→ On-demand cache invalidationSection titled “On-demand cache invalidation” If you want to invalidate cached objects while their cache control headers indicate they’re still fresh, you can purge the cache by site or cache tag. These granular options for refreshing your cache without redeploying your entire site optimize developer productivity for your team and site performance for your customers. On-demand invalidation across the entire network takes just a few seconds, even if you’re purging a tag associated with thousands of cached objects. Learn more about on-demand cache invalidation→ Durable cacheSection titled “Durable cache” By default, when a site visitor makes a request to Netlify for content that is generated by a function, the specific edge node the visitor has connected to will only check its own local cache. If fresh content is not found in that node’s cache, the node invokes the function to generate a new response. To reduce function invocations and latency, you can use the durable directive for a function’s response. This stores the response in a shared cache mechanism. Whenever that content is requested, edge nodes that don’t have the response locally check the durable cache first, and only invoke a function if necessary. Learn more about the durable cache→ Support in web frameworksSection titled “Support in web frameworks” When running some frameworks on Netlify, caching features are automatically put to use by the framework adapter to serve framework capabilities. For example, Netlify's OpenNext adapter fully supports on-demand revalidation in Next.js by using the caching primitives offered by Netlify. With most other frameworks, or for sites without a framework, developers have more direct control of and responsibility for caching behavior. Netlify provides an extensive set of guides for these cases in our Developers Hub, as well as helpful utility functions. Caching resources Here are a few of our framework-specific caching with Nuxt 4 ISR and advanced caching with Astro ISR and advanced caching with Remix Speed up your Hydrogen e-commerce site Preview ServersSection titled “Preview Servers” The number of Preview Servers available to you is based on your Pricing plan. Set up a Preview Server to share a customizable preview environment where you and key collaborators can preview content updates alongside code updates in real-time. Preview Servers run in secure, isolated virtual containers in Netlify’s infrastructure by taking advantage of the same netlify dev command that you run locally, but in a cloud environment Servers automatically detect your site’s framework (Gatsby, Next.js, Astro, etc.) and configure the appropriate settings Development server the development mode of your framework, allowing for instant page regeneration Webhook to your CMS via webhooks to trigger content refreshes Resource CPU, memory, and disk usage in near real-time Secure existing access controls, so team members with appropriate roles can access without anything new to configure For developers, this means you can set up Preview Servers once and provide a self-service model, freeing you to focus on core development instead of facilitating previews or struggling through a slow review process. Learn more about Preview Servers→ Last 30, 2026 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.167Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":3723}}22{"id":"doc-create_new_project_with_an_ai_agent_netlify_docs-126d5503","source":"documentation","title":"Create new project with an AI agent | Netlify Docs","url":"https://docs.netlify.com/start/quickstarts/create-new-project-with-ai-agent/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Start Start Choose your path What is Netlify? Quickstarts Netlify Drop Quickstart Create a new project with an AI agent Iterate on a project with an AI agent Deploy from your repository Deploy from AI code generation tool Create a repo from Netlify Core Concepts Version control Primitives Framework setup guides Agent setup guides Netlify CLI Netlify API Beginner’s glossary On this page Overview Video walkthrough overview Create a new project steps Next steps On this page Overview Video walkthrough overview Create a new project steps Next steps For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Start / Quickstarts / Create new project with an AI agent Copy page View as Markdown Copy as Markdown View as Markdown Learn how to create a new project from a prompt using an AI agent directly from your Netlify dashboard. When you start a new project this way, your project gets the best context and feedback loops for building and debugging custom experiences with features like forms, Blobs, Netlify Identity to manage access and authorization, and more. Video walkthrough overviewSection titled “Video walkthrough overview” For a video walkthrough of this process, check out the following walkthrough transcript Meet a new way to start projects on Netlify. Go to netlify.new, describe what you want to build, and choose an agent. Netlify runs the agent, generates the project, and deploys it. In minutes, you have a live site running on production infrastructure. Everything you need to ship is there from the first identity for auth Storage to manage data assets and files Serverless functions for APIs AI gateway for model access and skills that help agents use Netlify primitives the right way. Keep iterating with agent runners using your own prompt library or switch to code. Prompts and code operate on the same project, the same infrastructure and the same workflow. Projects live in real repositories. Changes are reviewable. Deployments follow the approval process you already use. Your next idea could be live in minutes. Start building at netlify.new. Create a new project stepsSection titled “Create a new project steps” To use this feature, you need a Credit-based pricing plan and must have enabled AI features. To start a new project with an AI to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select Add new project. Enter your own prompt or select a starter prompt to use or edit. You can also dictate a prompt. Optionally, choose your AI agent and add any additional images or files. Start building with Build now. Checkpoint Once your project builds, you should find a notification on your dashboard that your project's first deployment is ready for review. Next stepsSection titled “Next steps” Customize your project name Continue building with Agent Runners Add a custom domain Last 30, 2026 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.168Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1107}}23{"id":"doc-deploy_from_ai_code_generation_tool_netlify_docs-3dca239c","source":"documentation","title":"Deploy from AI code generation tool | Netlify Docs","url":"https://docs.netlify.com/start/quickstarts/deploy-from-ai-code-generation-tool/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Start Start Choose your path What is Netlify? Quickstarts Netlify Drop Quickstart Create a new project with an AI agent Iterate on a project with an AI agent Deploy from your repository Deploy from AI code generation tool Create a repo from Netlify Core Concepts Version control Primitives Framework setup guides Agent setup guides Netlify CLI Netlify API Beginner’s glossary On this page Overview Before you begin Choose your deployment method Method and drop Method Netlify context Method CLI Create a project from a prompt Deploy without an account Next steps On this page Overview Before you begin Choose your deployment method Method and drop Method Netlify context Method CLI Create a project from a prompt Deploy without an account Next steps For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Start / Quickstarts / Deploy from AI code generation tool Copy page View as Markdown Copy as Markdown View as Markdown To deploy your project from an AI code generation tool, such as Bolt, Lovable, or Cursor, follow these steps and best practices. This doc is for people who have already built their project using an AI site or app builder. If you're not sure which method to use, we recommend starting with the Drag and Drop method of deploying. Before you beginSection titled “Before you begin” We recommend you create a Netlify account but you can also deploy your project first and then claim your deployment later. Creating an account first allows Netlify to help you troubleshoot deployment issues. Need tips building your project? If you need help building your project, check out our Build with AI docs. Choose your deployment methodSection titled “Choose your deployment method” You can deploy to Netlify from any AI code generation tool by either using the Drag and Drop publisher, by sharing Netlify context with your AI tool, or by using the Netlify CLI directly. Deployment methodDescriptionOptimized forDrag and dropDownload your code files into a project folder, then drag and drop that folder into the Netlify Drop publisher.Deploying from a local folder on your computerShare Netlify contextShare Netlify context with your AI tool and then prompt your tool to deploy with Netlify or use the Netlify CLI directly.Deploying from an AI code generation tool or the terminalNetlify CLIUse the CLI to create a project from a prompt or deploy without an account.AI agents and automated workflows Method and dropSection titled “Method and drop” If you haven't already, create a Netlify account and stay signed into your Netlify team. Download your code files from your AI code generation tool. You can ask your AI tool how to do this, or if that doesn't help, look up their documentation. Create a project folder for your code files if needed and move your code files into that folder. Drag and drop that folder into the Netlify Drop. Next time you want to deploy, you can drag and drop the same folder into the Netlify Drop Publisher to start a new manual deployment. Have more questions? Check out the Drag and drop docs. Method Netlify contextSection titled “Method Netlify context” Share Netlify deployment context with your AI tool. We recommend sharing both if they are both supported. Share Netlify’s llms.txt URL at https://docs.netlify.com/llms.txt Install the Netlify MCP Server Once you've shared Netlify context, prompt your AI tool to deploy to Netlify. You can also use the Netlify CLI commands directly. Example deploy this project to Netlify. Ask me questions if you need more details.To help reduce complexity, explain as if I'm new to web development butstill use the technical terms I'd need to understand for debugging,troubleshooting, and looking up more information. Have more questions? Check out the Build with AI docs. Checkpoint Your AI tool should deploy your project to Netlify and share a Deploy Preview link and/or a link to your Netlify dashboard.If your project is not deploying as expected, get help in these a failed deploy Build troubleshooting tips Ask Netlify AI Method CLISection titled “Method CLI” The Netlify CLI offers commands designed for AI agents and automated workflows. Create a project from a promptSection titled “Create a project from a prompt” Use netlify create to generate, deploy, and download a new project from a natural language windownetlify create \"a landing page for a SaaS product with a waitlist signup\" This command uses Agent Runners to build the project, deploy it to a live URL, and download the code to your local machine. Deploy without an accountSection titled “Deploy without an account” Use the --allow-anonymous flag to deploy without logging in or creating a Netlify windownetlify deploy --allow-anonymous This creates a project with a live URL. You have one hour to claim ownership by logging in or creating a Netlify account. This is useful for AI agents that need to create temporary projects without requiring credentials. Note, though, that sites or apps that use serverless functions or edge functions will require an account. Learn more about these features in the Netlify CLI docs. Next stepsSection titled “Next steps” Need help refining your project? See our Build with AI and Prototyping best practices guides. Last 30, 2026 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nDeploy this project to Netlify. Ask me questions if you need more details.To help reduce complexity, explain as if I'm new to web development butstill use the technical terms I'd need to understand for debugging,troubleshooting, and looking up more information.\n```\n\nExample:\n```text\nnetlify create \"a landing page for a SaaS product with a waitlist signup\"\n```\n\nExample:\n```text\nnetlify deploy --allow-anonymous\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.169Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":18,"estimatedTokens":1798}}24{"id":"doc-what_is_netlify_netlify_docs-2af4054c","source":"documentation","title":"What is Netlify? | Netlify Docs","url":"https://docs.netlify.com/start/what-is-netlify/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Start Start Choose your path What is Netlify? Quickstarts Netlify Drop Quickstart Create a new project with an AI agent Iterate on a project with an AI agent Deploy from your repository Deploy from AI code generation tool Create a repo from Netlify Core Concepts Version control Primitives Framework setup guides Agent setup guides Netlify CLI Netlify API Beginner’s glossary On this page Overview Workflows support More questions? On this page Overview Workflows support More questions? For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Start / What is Netlify? Copy page View as Markdown Copy as Markdown View as Markdown Netlify is the trusted launch center for modern web projects spanning from solo first-time builders to enterprises building at scale. We simplify building for the web on our global CDN (Content Delivery Network) so you can focus on building your project and reaching your goals without managing infrastructure. Netlify gives you and your AI agents tools and custom building blocks, such as platform primitives, for building custom high-performance experiences that scale. We support many different modern coding frameworks and are not locked-in to a single framework. Learn more in our Framework setup docs. Finally, Netlify simplifies how you can collaborate, preview, secure, and govern your projects so you can build with others cross-functionally and securely at scale. Learn more about the security and building blocks Netlify Trust Center Security Overview Netlify Platform Primitives Workflows supportSection titled “Workflows support” Netlify supports a variety of workflows, Deploy Previews and share feedback Drag and drop to publish live on the web AI workflows Create a new project or update an existing project from the Netlify dashboard with your preferred AI coding agent using Agent Runners Build with an AI coding agent in a text editor, your terminal, browser, or other AI platform. Deploy an AI-generated project to the web that you started building with an AI code tool in your browser or a desktop app. Create an MCP Server on Netlify Build an AI code agent Git-connected repository workflows Version control without a Git repository AI governance workflows More questions?Section titled “More questions?” Reach out to the Netlify team for more help with your questions. Last 30, 2026 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.169Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":967}}25{"id":"doc-framework_setup_netlify_docs-ba80c36d","source":"documentation","title":"Framework setup | Netlify Docs","url":"https://docs.netlify.com/start/framework-setup/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Start Start Choose your path What is Netlify? Quickstarts Netlify Drop Quickstart Create a new project with an AI agent Iterate on a project with an AI agent Deploy from your repository Deploy from AI code generation tool Create a repo from Netlify Core Concepts Version control Primitives Framework setup guides Agent setup guides Netlify CLI Netlify API Beginner’s glossary On this page Overview Framework support Environment variable best practices Support Enhancing framework support On this page Overview Framework support Environment variable best practices Support Enhancing framework support For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Start / Framework setup Copy page View as Markdown Copy as Markdown View as Markdown Netlify auto-detects your framework and will set up default configuration for that framework. In cases where you want to further develop your project or customize how your project works, you can check out framework docs for your project. Framework supportSection titled “Framework support” Netlify is framework-agnostic, meaning you shouldn't be limited by the current framework you choose. Netlify supports the following Astro Eleventy Express Gatsby Hugo Hydrogen Next.js Nuxt React React Router Remix SvelteKit TanStack Start Vite Vue CLI Netlify technically supports additional frameworks, but we don't have a guide for them all. If it’s a modern framework or even just HTML, CSS, and basic JS, it should work on Netlify. For detailed setup instructions and framework-specific configuration, visit the individual framework guide pages above. Environment variable best practicesSection titled “Environment variable best practices” Learn best practices for using environment variables with environment variables with frameworks SupportSection titled “Support” To help you determine if you need Support from your Framework vs. Netlify, you can try the your project locally to see if it works Check the documentation for your framework Search for an existing question on our Support Forums Enhancing framework supportSection titled “Enhancing framework support” If you need to enhance the framework support for your project, you can use the Frameworks API, which is designed for Framework authors and collaborators to help build adapters to make building and deploying on Netlify smoother for your framework. Last 30, 2026 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.171Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":974}}26{"id":"doc-understand_version_control_netlify_docs-5e3136de","source":"documentation","title":"Understand version control | Netlify Docs","url":"https://docs.netlify.com/start/core-concepts/version-control/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Start Start Choose your path What is Netlify? Quickstarts Netlify Drop Quickstart Create a new project with an AI agent Iterate on a project with an AI agent Deploy from your repository Deploy from AI code generation tool Create a repo from Netlify Core Concepts Version control Primitives Framework setup guides Agent setup guides Netlify CLI Netlify API Beginner’s glossary On this page Overview What is Git? What is a Git provider? Learn more On this page Overview What is Git? What is a Git provider? Learn more For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Start / Core Concepts / Understand version control Copy page View as Markdown Copy as Markdown View as Markdown Version control is a way of tracking changes to your project over time. Think of it like a detailed undo history. Version control allows you to save changes as you build so you can go back to any earlier version. Netlify has version control built-in so you can always rollback to a previous version of your project, even if your project is not connected to a Git repository. What is Git?Section titled “What is Git?” Git is the most widely used version control tool. When your project uses Git, every change you save (called a commit) is recorded with a description of what changed and when. You don't need to use Git to publish a project on Netlify. If you built your project with an AI tool and downloaded the files, you can publish instantly using Netlify Drop without Git. What is a Git provider?Section titled “What is a Git provider?” A Git Provider is a site where you can host or store your project's Git repository. Netlify supports these Git GitLab BitBucket Azure DevOps When you connect your project to a hosted Git repository, you time you save a change to your project, Netlify automatically rebuilds and republishes your site. Deploy proposed change gets its own preview URL before it goes live. History and full project history lives in one place. Learn moreSection titled “Learn more” Deploy from your repository Git workflows Last 30, 2026 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.171Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":893}}27{"id":"doc-netlify_platform_primitives_netlify_docs-40439ddf","source":"documentation","title":"Netlify Platform Primitives | Netlify Docs","url":"https://docs.netlify.com/start/core-concepts/primitives/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Start Start Choose your path What is Netlify? Quickstarts Netlify Drop Quickstart Create a new project with an AI agent Iterate on a project with an AI agent Deploy from your repository Deploy from AI code generation tool Create a repo from Netlify Core Concepts Version control Primitives Framework setup guides Agent setup guides Netlify CLI Netlify API Beginner’s glossary On this page Overview Functions Edge Functions Background Functions Scheduled Functions Image CDN Blobs Netlify Database Caching Stale while revalidate (SWR) On-demand cache invalidation Durable cache Support in web frameworks Preview Servers On this page Overview Functions Edge Functions Background Functions Scheduled Functions Image CDN Blobs Netlify Database Caching Stale while revalidate (SWR) On-demand cache invalidation Durable cache Support in web frameworks Preview Servers For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Start / Core Concepts / Netlify Platform Primitives Copy page View as Markdown Copy as Markdown View as Markdown If you're evaluating Netlify or deciding which platform features to use in your project, this doc gives you a tour of what the platform can do. Explain like I'm new to web devNetlify's platform primitives are the building blocks that power what you can build on Netlify. Understanding these primitives can help you and your AI agents build and debug custom high-performance web experiences. OverviewSection titled “Overview” Netlify Platform Primitives are framework-agnostic runtime features of our platform. They are used in our framework adapters to offer consistent functionality and freedom regardless of your chosen framework. These primitives can also be used directly to transform stale pages and static pages into dynamic experiences that best suit your architectural strategy and : Use serverless functions to add dynamic behavior to your site. Functions can be used for server-side rendering, API endpoints, and more. Edge Functions connect our platform with an open runtime standard at the network edge, allowing fast, personalized web experiences in a dev ecosystem. Background Background Functions for long-running serverless functions that handle tasks like batch processing, scraping, and more. Scheduled Scheduled Functions to run serverless functions on a regular and consistent schedule, like a cron job. Image images on demand without impacting build times. Handle content negotiation automatically. and retrieve unstructured data. Use blob storage as a simple key/value store or basic database. Netlify serverless Postgres database with deep integration into the Netlify workflow, including branching, automated backups, and team guardrails. Fine-Grained cache behavior, including Stale-While-Revalidate (SWR), on-demand cache invalidation, a programmatic Cache API, and more. FunctionsSection titled “Functions” With Netlify Functions, your serverless functions are version-controlled, built, and deployed along with the rest of your Netlify site, and we will automatically handle service discovery through our built-in API gateway. This eliminates overhead and brings the power of Deploy Previews and rollbacks to your functions. During a build, we automatically generate functions for web frameworks that support server-side rendering and/or API endpoints. This is done through a build plugin or adapter for that framework. If you are using a framework that does not support server-side rendering, you can still add dynamic behavior by creating functions directly. Functions resources Refer to the following resources to learn more about Netlify to Functions Getting started with Functions Functions API reference Or start building with one of our platform starters. Edge FunctionsSection titled “Edge Functions” Edge Functions connect the Netlify platform and workflow with an open runtime standard at the network edge. This enables you to build fast, personalized web experiences with an ecosystem of development tools. Using TypeScript and JavaScript, you can modify network requests to localize content, serve relevant ads, authenticate users, personalize content, redirect visitors, and much more. Edge Functions also support a new generation of edge-first web frameworks allowing your entire app to run at the edge, dramatically increasing performance in many cases. All this dynamic processing happens in a secure runtime based on Deno directly from the worldwide network edge location closest to each user for fast response times. Plus, you have the option to cache edge function responses for even faster response times. With Netlify, your edge functions are version-controlled, built, and deployed along with the rest of your Netlify site. This eliminates overhead and brings the power of Deploy Previews and rollbacks to your edge functions. Edge Functions resources Refer to the following resources to learn more about Netlify Edge to Edge Functions Getting started with Edge Functions Edge Functions API reference Or start building with one of our platform starters. Background FunctionsSection titled “Background Functions” This feature is available on Credit-based plans, including Free, Personal, and Pro and on Enterprise plans. Learn more. Netlify’s Background Functions provide an option for serverless functions that run for up to 15 minutes and don’t need to complete before a visitor can take next steps on your site. For tasks like batch processing, scraping, and slower API workflow execution, they may be a better fit than synchronous functions. Learn more about Background Functions→ Scheduled FunctionsSection titled “Scheduled Functions” This feature is available on all pricing plans. Scheduled Functions is a feature of Netlify Functions that enables you to run functions on a regular and consistent schedule, much like a cron job. Scheduled functions can do almost anything that serverless functions do today, though some tasks are better suited to scheduled functions than others. For example, you may want a set of APIs to collate data for a report at the end of every week Backup data from one data store to another at the end of every night Build and/or deploy all your static content every hour instead of for every authored or merged pull request Or anything else you can imagine you might want to invoke on a regular basis! Learn more about Scheduled Functions→ Image CDNSection titled “Image CDN” With Netlify Image CDN, you can transform images on demand without impacting build times. Netlify Image CDN also handles content negotiation to use the most efficient image format for the requesting client. Optimizing the size and format of your images improves both the runtime performance and reliability of your site. Transformations are integrated natively into the CDN so that repeated requests leverage layers of caching for improved performance. Many frameworks on Netlify use Netlify Image CDN to power image optimization and transformation. Image CDN resources Refer to the following resources to learn more about Netlify Image to Image CDN Image CDN usage reference Creating an Image CDN integration Or start building with one of our platform starters. BlobsSection titled “Blobs” With Netlify Blobs, you can store and retrieve blobs and unstructured data. You can also use this feature as a simple key/value store or basic database. Netlify Blobs is a highly-available data store optimized for frequent reads and infrequent writes. For maximum flexibility, it offers a configurable consistency model. If multiple write calls to the same key are issued, the last write wins. We automatically handle provisioning, configuration, and access control for you. This integrated zero-configuration solution helps you focus on building business value in your project rather than toil on setting up and scaling a separate blob storage solution. Blobs resources Refer to the following resources to learn more about Netlify to Blobs Blobs API reference Or start building with one of our platform starters. Netlify DatabaseSection titled “Netlify Database” Netlify Database is available on Credit-based plans only. When a database is active, it consumes credits for the compute and bandwidth used. However, database storage space (i.e., the size of data stored) is free until July 1, 2026. Learn more in our billing and usage docs. Netlify Database offers a production-grade serverless database instance that you or a code agent can instantly set up and deploy with a single command. Netlify Database automatically connects to your functions and environment variables, making it ideal for fast development and automated scaffolding. Learn more about Netlify Database→ CachingSection titled “Caching” Netlify’s global caching infrastructure is built to provide stellar performance without any stale pages or broken assets for your visitors. Static asset responses on Netlify are cached on Netlify’s global edge nodes and automatically invalidated whenever a deploy changes the content. However, responses coming from Netlify Functions, Edge Functions, and proxies are not cached by default, because these responses are dynamic and their content may change per request. To cache these dynamic responses, we offer fine-grained cache controls via response headers. These controls go from basic, common capabilities (such as setting a maximum age for content) to state-of-the art patterns such as on-demand invalidation. All caching features follow web standards as much as possible. Additionally, you can use the Cache API to programmatically store the responses from network calls made within your function or edge function code. Here are a few key caching while revalidate (SWR)Section titled “Stale while revalidate (SWR)” Stale while revalidate is a caching pattern, set via response headers, that allows the cache to keep serving a stale object out of the cache while the object is revalidated in the background. This can be impactful for implementing API caching or patterns like incremental static regeneration (ISR). Learn more about the stale while revalidate directive→ On-demand cache invalidationSection titled “On-demand cache invalidation” If you want to invalidate cached objects while their cache control headers indicate they’re still fresh, you can purge the cache by site or cache tag. These granular options for refreshing your cache without redeploying your entire site optimize developer productivity for your team and site performance for your customers. On-demand invalidation across the entire network takes just a few seconds, even if you’re purging a tag associated with thousands of cached objects. Learn more about on-demand cache invalidation→ Durable cacheSection titled “Durable cache” By default, when a site visitor makes a request to Netlify for content that is generated by a function, the specific edge node the visitor has connected to will only check its own local cache. If fresh content is not found in that node’s cache, the node invokes the function to generate a new response. To reduce function invocations and latency, you can use the durable directive for a function’s response. This stores the response in a shared cache mechanism. Whenever that content is requested, edge nodes that don’t have the response locally check the durable cache first, and only invoke a function if necessary. Learn more about the durable cache→ Support in web frameworksSection titled “Support in web frameworks” When running some frameworks on Netlify, caching features are automatically put to use by the framework adapter to serve framework capabilities. For example, Netlify's OpenNext adapter fully supports on-demand revalidation in Next.js by using the caching primitives offered by Netlify. With most other frameworks, or for sites without a framework, developers have more direct control of and responsibility for caching behavior. Netlify provides an extensive set of guides for these cases in our Developers Hub, as well as helpful utility functions. Caching resources Here are a few of our framework-specific caching with Nuxt 4 ISR and advanced caching with Astro ISR and advanced caching with Remix Speed up your Hydrogen e-commerce site Preview ServersSection titled “Preview Servers” The number of Preview Servers available to you is based on your Pricing plan. Set up a Preview Server to share a customizable preview environment where you and key collaborators can preview content updates alongside code updates in real-time. Preview Servers run in secure, isolated virtual containers in Netlify’s infrastructure by taking advantage of the same netlify dev command that you run locally, but in a cloud environment Servers automatically detect your site’s framework (Gatsby, Next.js, Astro, etc.) and configure the appropriate settings Development server the development mode of your framework, allowing for instant page regeneration Webhook to your CMS via webhooks to trigger content refreshes Resource CPU, memory, and disk usage in near real-time Secure existing access controls, so team members with appropriate roles can access without anything new to configure For developers, this means you can set up Preview Servers once and provide a self-service model, freeing you to focus on core development instead of facilitating previews or struggling through a slow review process. Learn more about Preview Servers→ Last 30, 2026 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.172Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":3723}}28{"id":"doc-get_started_with_netlify_cli_netlify_docs-e6af1b30","source":"documentation","title":"Get started with Netlify CLI | Netlify Docs","url":"https://docs.netlify.com/api-and-cli-guides/cli-guides/get-started-with-cli","text":"Example:\n```text\nnpm install -g netlify-cli\n```\n\nExample:\n```text\nnetlify\n```\n\nExample:\n```text\nnpm install netlify-cli --save-dev\n```\n\nExample:\n```text\nnetlify login\n```\n\nExample:\n```text\n# opt out of sharing usage datanetlify --telemetry-disable\n# allow your usage to help shape developmentnetlify --telemetry-enable\n```\n\nExample:\n```text\nnetlify create \"a landing page for a SaaS product with a waitlist signup\"\n```\n\nExample:\n```text\nnetlify init\n```\n\nExample:\n```text\nnetlify init --manual\n```\n\nExample:\n```text\nnetlify build\n```\n\nExample:\n```text\nnetlify build --dry\n```\n\nExample:\n```text\nnetlify build --context deploy-preview\n```\n\nExample:\n```text\nnetlify deploy\n```\n\nExample:\n```text\nnetlify deploy --dir=_site --functions=functions\n```\n\nExample:\n```text\nnetlify deploy --alias=YOUR_ALIAS\n```\n\nExample:\n```text\nnetlify deploy --prod\n```\n\nExample:\n```text\nnetlify deploy --allow-anonymous\n```\n\nExample:\n```text\nnpm install\n```\n\nExample:\n```text\nyarn\n```\n\nExample:\n```text\nnetlify clone owner/repo\n```\n\nExample:\n```text\nnetlify clone https://github.com/owner/repo.git\n```\n\nExample:\n```text\nnetlify clone owner/repo my-project-directory\n```\n\nExample:\n```text\nnetlify clone owner/repo --name my-site-name\n```\n\nExample:\n```text\nnetlify link\n```\n\nExample:\n```text\nnetlify unlink\n```\n\nExample:\n```text\nnetlify env:set API_KEY someValue --scope functions --context production branch-deploynetlify env:list --scope builds --context deploy-preview\n```\n\nExample:\n```text\nnetlify env:set API_KEY someValuenetlify env:set ANOTHER_API_KEY someValue --scope builds --context dev\n```\n\nExample:\n```text\nnetlify env:set API_KEY someValue --context production deploy-previewnetlify env:set API_KEY someOtherValue --context branch:staging\n```\n\nExample:\n```text\nnetlify env:import .env\n```\n\nExample:\n```text\nnetlify env:clone --to destinationSiteId --from sourceSiteID\n```\n\nExample:\n```text\nnetlify env:set API_KEY someValue --context production --secret\n```\n\nExample:\n```text\nnetlify env:listnetlify env:list --context branch:stagingnetlify env:list --scope functionsnetlify env:list --plain\n```\n\nExample:\n```text\nnetlify env:get API_KEYnetlify env:get API_KEY --context production\n```\n\nExample:\n```text\nnetlify env:unset API_KEYnetlify env:unset API_KEY --context dev\n```\n\nExample:\n```text\nnetlify dev --filter websitenetlify dev --filter packages/website\n```\n\nExample:\n```text\nDEBUG=* netlify deploy\n```\n\nExample:\n```text\nset DEBUG=* & netlify deploy\n```\n\nExample:\n```text\n$env:DEBUG='*';netlify deploy\n```\n\nExample:\n```text\nnetlify help\n```\n\nExample:\n```text\nnetlify help deploy\n```\n\nExample:\n```text\nnetlify help sites:create\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.175Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":40,"totalLines":202,"estimatedTokens":659}}29{"id":"doc-manage_prompt_templates_netlify_docs-4be3e57b","source":"documentation","title":"Manage Prompt Templates | Netlify Docs","url":"https://docs.netlify.com/prompt-templates/manage/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Build with AI Build with AI Overview Agent Runners Overview Make changes with Agent Runners Create a repo from Netlify Prompt examples Troubleshoot Prompt Templates Browse Manage Agent setup guides Overview Claude Code Codex Claude Web Claude Desktop Claude Design ChatGPT Antigravity Antigravity CLI AI Gateway Prototyping best practices Manage AI features Overview Claude admin configuration Security and privacy for AI features Block AI crawlers For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Prompt Templates / Manage Prompt Templates Learn how to customize and save Prompt Templates for your team’s use and how to submit new templates to Netlify’s public prompt collection. OverviewSection titled “Overview” As long as your team has Agent Runners enabled and you have a Credit-based pricing plan, you can create and manage prompt templates for your team from within your Netlify project’s dashboard. To help you get started, Netlify has created a set of public prompts and will curate community-created prompts that you can review and add to your team’s prompt collection for quick re-use in a project across your team. AccessSection titled “Access” If you have access to Netlify's agent run dashboard, you can customize, delete, create, and submit a prompt right next to where you start your agent run. Anyone on a Netlify team with the following roles can do Developer Internal Builder Publisher Create and customize prompt for teamSection titled “Create and customize prompt for team” To customize a prompt, you can copy and paste an existing Prompt Template and then edit it to fit your needs. To create a new Prompt Template for your team to your project in the Netlify dashboard. In the right sidebar, select Agent runs. Above your agent run prompt field, select Prompt Templates. You’ll find a collection of prompts including public templates curated by Netlify and your team authored templates. Choose Team-created, then add a prompt for your team, including any necessary variables that you can define. Enter the required information, confirm, and save. Find your team-created promptsSection titled “Find your team-created prompts” To find your team-created to your project in the Netlify dashboard. In the right sidebar, select Agent runs. Above your agent run prompt field, select Prompt Templates. You’ll find a collection of prompts including public templates curated by Netlify and your team authored templates. Submit prompts to public prompt collectionSection titled “Submit prompts to public prompt collection” You can submit prompts from your project’s agent runs dashboard for Netlify review. If accepted, your Prompt Template will be added to the public prompt collection. To submit a prompt for Netlify’s public prompt to your project in the Netlify dashboard. In the right sidebar, select Agent runs. Above your agent run prompt field, select Prompt Templates. Select Team-created prompts and follow the UI's context to submit your prompt for Netlify review. PreviousBrowseNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.175Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1138}}30{"id":"doc-get_started_with_netlify_cli_netlify_docs-c059129b","source":"documentation","title":"Get started with Netlify CLI | Netlify Docs","url":"https://docs.netlify.com/api-and-cli-guides/cli-guides/get-started-with-cli/","text":"Example:\n```text\nnpm install -g netlify-cli\n```\n\nExample:\n```text\nnetlify\n```\n\nExample:\n```text\nnpm install netlify-cli --save-dev\n```\n\nExample:\n```text\nnetlify login\n```\n\nExample:\n```text\n# opt out of sharing usage datanetlify --telemetry-disable\n# allow your usage to help shape developmentnetlify --telemetry-enable\n```\n\nExample:\n```text\nnetlify create \"a landing page for a SaaS product with a waitlist signup\"\n```\n\nExample:\n```text\nnetlify init\n```\n\nExample:\n```text\nnetlify init --manual\n```\n\nExample:\n```text\nnetlify build\n```\n\nExample:\n```text\nnetlify build --dry\n```\n\nExample:\n```text\nnetlify build --context deploy-preview\n```\n\nExample:\n```text\nnetlify deploy\n```\n\nExample:\n```text\nnetlify deploy --dir=_site --functions=functions\n```\n\nExample:\n```text\nnetlify deploy --alias=YOUR_ALIAS\n```\n\nExample:\n```text\nnetlify deploy --prod\n```\n\nExample:\n```text\nnetlify deploy --allow-anonymous\n```\n\nExample:\n```text\nnpm install\n```\n\nExample:\n```text\nyarn\n```\n\nExample:\n```text\nnetlify clone owner/repo\n```\n\nExample:\n```text\nnetlify clone https://github.com/owner/repo.git\n```\n\nExample:\n```text\nnetlify clone owner/repo my-project-directory\n```\n\nExample:\n```text\nnetlify clone owner/repo --name my-site-name\n```\n\nExample:\n```text\nnetlify link\n```\n\nExample:\n```text\nnetlify unlink\n```\n\nExample:\n```text\nnetlify env:set API_KEY someValue --scope functions --context production branch-deploynetlify env:list --scope builds --context deploy-preview\n```\n\nExample:\n```text\nnetlify env:set API_KEY someValuenetlify env:set ANOTHER_API_KEY someValue --scope builds --context dev\n```\n\nExample:\n```text\nnetlify env:set API_KEY someValue --context production deploy-previewnetlify env:set API_KEY someOtherValue --context branch:staging\n```\n\nExample:\n```text\nnetlify env:import .env\n```\n\nExample:\n```text\nnetlify env:clone --to destinationSiteId --from sourceSiteID\n```\n\nExample:\n```text\nnetlify env:set API_KEY someValue --context production --secret\n```\n\nExample:\n```text\nnetlify env:listnetlify env:list --context branch:stagingnetlify env:list --scope functionsnetlify env:list --plain\n```\n\nExample:\n```text\nnetlify env:get API_KEYnetlify env:get API_KEY --context production\n```\n\nExample:\n```text\nnetlify env:unset API_KEYnetlify env:unset API_KEY --context dev\n```\n\nExample:\n```text\nnetlify dev --filter websitenetlify dev --filter packages/website\n```\n\nExample:\n```text\nDEBUG=* netlify deploy\n```\n\nExample:\n```text\nset DEBUG=* & netlify deploy\n```\n\nExample:\n```text\n$env:DEBUG='*';netlify deploy\n```\n\nExample:\n```text\nnetlify help\n```\n\nExample:\n```text\nnetlify help deploy\n```\n\nExample:\n```text\nnetlify help sites:create\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.177Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":40,"totalLines":202,"estimatedTokens":659}}31{"id":"doc-production_deploy_netlify_docs-13ed4ae9","source":"documentation","title":"Production deploy | Netlify Docs","url":"https://docs.netlify.com/deploy/deploy-types/production-deploy/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview What is a production deploy? How production deploys work Managing production deploys On this page Overview What is a production deploy? How production deploys work Managing production deploys For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Deploy Types / Production deploy Copy page View as Markdown Copy as Markdown View as Markdown Learn about production deploys and how they work in Netlify. What is a production deploy?Section titled “What is a production deploy?” A production deploy is a type of deploy that is optimized to work as the production-ready version of your web project that shows up at your primary domain and is live on the web. Your primary domain can be a custom domain, such as mycompany.com, or your Netlify default URL, such as MY-PROJECT-NAME.netlify.app. If you are using Git version control, then a production deploy is typically triggered by a Git push to your production branch, such as main. You can customize your production branch in your project settings on Netlify. If you are not using Git version control, then a production deploy is typically triggered by manually deploying your site with our Drag and drop publisher. How production deploys workSection titled “How production deploys work” Production deploys are automatically created when you push changes to your production branch or manually deploy your site. These served at your primary domain Replace the previous production version Can be rolled back if needed Trigger build hooks and notifications Managing production deploysSection titled “Managing production deploys” You can manage your production deploys through the Netlify dashboard or using the Netlify CLI. Last 9, 2026 PreviousCompare preview optionsNextBranch deploys Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.178Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":910}}32{"id":"doc-troubleshooting_netlify_docs-a37f951f","source":"documentation","title":"Troubleshooting | Netlify Docs","url":"https://docs.netlify.com/resources/troubleshooting/overview/","text":"Example:\n```text\nPage not foundLooks like you’ve followed a broken link or entered a URL that doesn’t exist on this site.If this is your site, and you weren’t expecting a 404 for this path, please visit Netlify’s “page not found” support guide for troubleshooting tips.\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.179Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":1,"totalLines":6,"estimatedTokens":72}}33{"id":"doc-get_started_with_the_netlify_api_netlify_docs-e57512c9","source":"documentation","title":"Get started with the Netlify API | Netlify Docs","url":"https://docs.netlify.com/api-and-cli-guides/api-guides/get-started-with-api","text":"Example:\n```text\ncurl -H \"User-Agent: MyApp (YOUR_NAME@EXAMPLE.COM)\" \\     -H \"Authorization: Bearer YOUR_OAUTH2_ACCESS_TOKEN\" \\     https://api.netlify.com/api/v1/sites\n```\n\nExample:\n```text\nX-RateLimit-Limit: 500X-RateLimit-Remaining: 56X-RateLimit-Reset: 1372700873\n```\n\nExample:\n```text\nLink: <https://api.netlify.com/api/v1/sites?page=3&per_page=20>; rel=\"next\",    <https://api.netlify.com/api/v1/sites?page=5&per_page=20>; rel=\"last\"\n```\n\nExample:\n```text\nPOST /api/v1/sites\n```\n\nExample:\n```text\nPOST /api/v1/sites/{site_id}/deploys\n```\n\nExample:\n```text\n{  \"files\": {    \"/index.html\": \"907d14fb3af2b0d4f18c2d46abe8aedce17367bd\",    \"/main.css\": \"f18c2d7367bd9046abe8aedce17d14fb3af2b0d4\"  },  \"functions\": {    \"hello-world\": \"708b029d8aa9c8fa513d1a25b97ffb6efb12b423\"  }}\n```\n\nExample:\n```text\n{  \"id\": \"1234\",  \"required\": [\"907d14fb3af2b0d4f18c2d46abe8aedce17367bd\"],  \"required_functions\": [\"708b029d8aa9c8fa513d1a25b97ffb6efb12b423\"]}\n```\n\nExample:\n```text\nPUT /api/v1/deploys/{deploy_id}/files/index.html\n```\n\nExample:\n```text\nPUT /api/v1/deploys/{deploy_id}/functions/hello-world?runtime=js\n```\n\nExample:\n```text\n{  \"async\": true,  \"files\": {    \"/index.html\": \"907d14fb3af2b0d4f18c2d46abe8aedce17367bd\"  },  \"functions\": {    \"hello-world\": \"708b029d8aa9c8fa513d1a25b97ffb6efb12b423\"  }}\n```\n\nExample:\n```text\nGET /api/v1/sites/{site_id}/deploys/{deploy_id}\n```\n\nExample:\n```text\ncurl -H \"Content-Type: application/zip\" \\     -H \"Authorization: Bearer YOUR_OAUTH2_ACCESS_TOKEN\" \\     --data-binary \"@website.zip\" \\     https://api.netlify.com/api/v1/sites/mysite.netlify.app/deploys\n```\n\nExample:\n```text\ncurl -H \"Content-Type: application/zip\" \\     -H \"Authorization: Bearer YOUR_OAUTH2_ACCESS_TOKEN\" \\     --data-binary \"@website.zip\" \\     https://api.netlify.com/api/v1/sites\n```\n\nExample:\n```text\nGET /api/v1/deploys/{deploy_id}\n```\n\nExample:\n```text\n{ \"id\": \"1234\", \"state\": \"ready\" }\n```\n\nExample:\n```text\n[  {    \"id\": \"3970e0fe-8564-4903-9a55-c5f8de49fb8b\",    \"premium\": false,    \"claimed\": true,    \"name\": \"synergy\",    \"custom_domain\": \"www.example.com\",    \"url\": \"http://www.example.com\",    \"admin_url\": \"https://api.netlify.com/sites/synergy\",    \"screenshot_url\": null,    \"created_at\": \"2013-09-17T05:13:08Z\",    \"updated_at\": \"2013-09-17T05:13:19Z\",    \"user_id\": \"51f60d2d5803545326000005\"  }]\n```\n\nExample:\n```text\n{  \"id\": \"3970e0fe-8564-4903-9a55-c5f8de49fb8b\",  \"premium\": false,  \"claimed\": true,  \"name\": \"synergy\",  \"custom_domain\": \"www.example.com\",  \"notification_email\": \"me@example.com\",  \"url\": \"http://www.example.com\",  \"admin_url\": \"https://api.netlify.com/sites/synergy\",  \"screenshot_url\": null,  \"created_at\": \"2013-09-17T05:13:08Z\",  \"updated_at\": \"2013-09-17T05:13:19Z\",  \"user_id\": \"51f60d2d5803545326000005\"}\n```\n\nExample:\n```text\n{  \"html\": { \"pretty_urls\": true }}\n```\n\nExample:\n```text\n{  \"my_meta_key\": \"my_meta_value\"}\n```\n\nExample:\n```text\n[  {    \"id\": \"/index.html\",    \"path\": \"/index.html\",    \"sha\": \"20828dcdf2cd07e5980fe52759101591bf5014ab\",    \"mime_type\": \"text/html\",    \"size\": 27232  }]\n```\n\nExample:\n```text\n{  \"id\": \"/index.html\",  \"path\": \"/index.html\",  \"sha\": \"20828dcdf2cd07e5980fe52759101591bf5014ab\",  \"mime_type\": \"text/html\",  \"size\": 27232}\n```\n\nExample:\n```text\n[  {    \"id\": \"52465f435803544542000001\",    \"premium\": false,    \"claimed\": true,    \"name\": \"synergy\",    \"custom_domain\": \"www.example.com\",    \"notification_email\": \"me@example.com\",    \"url\": \"http://www.example.com\",    \"deploy_url\": \"http://52465f435803544542000001.some-site.netlify.app\",    \"admin_url\": \"https://api.netlify.com/sites/synergy\",    \"screenshot_url\": null,    \"created_at\": \"2013-09-17T05:13:08Z\",    \"updated_at\": \"2013-09-17T05:13:19Z\",    \"user_id\": \"51f60d2d5803545326000005\",    \"state\": \"old\"  }]\n```\n\nExample:\n```text\n{  \"id\": \"52465f435803544542000001\",  \"premium\": false,  \"claimed\": true,  \"name\": \"synergy\",  \"custom_domain\": \"www.example.com\",  \"notification_email\": \"me@example.com\",  \"url\": \"http://www.example.com\",  \"deploy_url\": \"http://52465f435803544542000001.some-site.netlify.app\",  \"admin_url\": \"https://api.netlify.com/sites/synergy\",  \"screenshot_url\": null,  \"created_at\": \"2013-09-17T05:13:08Z\",  \"updated_at\": \"2013-09-17T05:13:19Z\",  \"user_id\": \"51f60d2d5803545326000005\",  \"state\": \"old\"}\n```\n\nExample:\n```text\n{  \"id\": \"52465f435803544542000001\",  \"premium\": false,  \"claimed\": true,  \"name\": \"synergy\",  \"custom_domain\": \"www.example.com\",  \"notification_email\": \"me@example.com\",  \"url\": \"http://www.example.com\",  \"deploy_url\": \"http://52465f435803544542000001.some-site.netlify.app\",  \"admin_url\": \"https://api.netlify.com/sites/synergy\",  \"screenshot_url\": null,  \"created_at\": \"2013-09-17T05:13:08Z\",  \"updated_at\": \"2013-09-17T05:13:19Z\",  \"user_id\": \"51f60d2d5803545326000005\",  \"state\": \"current\"}\n```\n\nExample:\n```text\n[  {    \"id\": 0,    \"title\": \"Test\",    \"general\": \"\\u003Cscript\\u003Ealert(\\\"Hello\\\")\\u003C/script\\u003E\",    \"general_position\": \"head\",    \"goal\": \"\",    \"goal_position\": \"footer\"  }]\n```\n\nExample:\n```text\n{  \"id\": 0,  \"title\": \"Test\",  \"general\": \"\\u003Cscript\\u003Ealert(\\\"Hello\\\")\\u003C/script\\u003E\",  \"general_position\": \"head\",  \"goal\": \"\",  \"goal_position\": \"footer\"}\n```\n\nExample:\n```text\n[  {    \"id\": \"ac0865cc46440b1e64666f520e8d88d670c8a2f6\",    \"site_id\": \"0d3a9d2f-ef94-4380-93df-27ee400e2048\",    \"name\": \"Landing Page\",    \"paths\": [\"/index\"],    \"submission_count\": 3,    \"fields\": [      { \"name\": \"name\", \"type\": \"text\" },      { \"name\": \"email\", \"type\": \"email\" },      { \"name\": \"phone\", \"type\": \"text\" },      { \"name\": \"company\", \"type\": \"text\" },      { \"name\": \"website\", \"type\": \"url\" },      { \"name\": \"number_of_employees\", \"type\": \"select\" }    ],    \"created_at\": \"2013-09-18T20:26:19Z\"  }]\n```\n\nExample:\n```text\n[  {    \"id\": \"5231110b5803540aeb000019\",    \"number\": 13,    \"title\": null,    \"email\": \"test@example.com\",    \"name\": \"Mathias Biilmann\",    \"first_name\": \"Mathias\",    \"last_name\": \"Biilmann\",    \"company\": \"Netlify\",    \"summary\": \"Hello, World\",    \"body\": \"Hello, World\",    \"data\": {      \"email\": \"test@example.com\",      \"name\": \"Mathias Biilmann\",      \"ip\": \"127.0.0.1\"    },    \"created_at\": \"2013-09-12T00:55:39Z\",    \"site_url\": \"http://synergy.netlify.app\"  }]\n```\n\nExample:\n```text\n[  {    \"name\": \"url\",    \"fields\": [      {        \"name\": \"url\",        \"options\": {          \"type\": \"string\",          \"title\": \"URL to notify\"        }      }    ],    \"events\": [\"submission_created\", \"deploy_created\", \"deploy_failed\"]  }]\n```\n\nExample:\n```text\n[  {    \"id\": \"5636b7a00d61eec2d6001004\",    \"site_id\": \"0d3a9d2f-ef94-4380-93df-27ee400e2048\",    \"type\": \"email\",    \"event\": \"submission_created\",    \"data\": { \"email\": \"test@example.com\" },    \"created_at\": \"2015-10-20T21:51:51Z\",    \"updated_at\": \"2015-10-20T21:51:51Z\"  }]\n```\n\nExample:\n```text\n{  \"site_id\": \"0d3a9d2f-ef94-4380-93df-27ee400e2048\",  \"form_id\": \"5235a7a00d61eec2d6001302\",  \"type\": \"email\",  \"event\": \"submission_created\",  \"data\": { \"email\": \"test@example.com\" }}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.182Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":31,"totalLines":156,"estimatedTokens":1764}}34{"id":"doc-deploy_from_ai_code_generation_tool_netlify_docs-5ade027a","source":"documentation","title":"Deploy from AI code generation tool | Netlify Docs","url":"https://docs.netlify.com/start/quickstarts/deploy-from-ai-code-generation-tool","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Start Start Choose your path What is Netlify? Quickstarts Netlify Drop Quickstart Create a new project with an AI agent Iterate on a project with an AI agent Deploy from your repository Deploy from AI code generation tool Create a repo from Netlify Core Concepts Version control Primitives Framework setup guides Agent setup guides Netlify CLI Netlify API Beginner’s glossary On this page Overview Before you begin Choose your deployment method Method and drop Method Netlify context Method CLI Create a project from a prompt Deploy without an account Next steps On this page Overview Before you begin Choose your deployment method Method and drop Method Netlify context Method CLI Create a project from a prompt Deploy without an account Next steps For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Start / Quickstarts / Deploy from AI code generation tool Copy page View as Markdown Copy as Markdown View as Markdown To deploy your project from an AI code generation tool, such as Bolt, Lovable, or Cursor, follow these steps and best practices. This doc is for people who have already built their project using an AI site or app builder. If you're not sure which method to use, we recommend starting with the Drag and Drop method of deploying. Before you beginSection titled “Before you begin” We recommend you create a Netlify account but you can also deploy your project first and then claim your deployment later. Creating an account first allows Netlify to help you troubleshoot deployment issues. Need tips building your project? If you need help building your project, check out our Build with AI docs. Choose your deployment methodSection titled “Choose your deployment method” You can deploy to Netlify from any AI code generation tool by either using the Drag and Drop publisher, by sharing Netlify context with your AI tool, or by using the Netlify CLI directly. Deployment methodDescriptionOptimized forDrag and dropDownload your code files into a project folder, then drag and drop that folder into the Netlify Drop publisher.Deploying from a local folder on your computerShare Netlify contextShare Netlify context with your AI tool and then prompt your tool to deploy with Netlify or use the Netlify CLI directly.Deploying from an AI code generation tool or the terminalNetlify CLIUse the CLI to create a project from a prompt or deploy without an account.AI agents and automated workflows Method and dropSection titled “Method and drop” If you haven't already, create a Netlify account and stay signed into your Netlify team. Download your code files from your AI code generation tool. You can ask your AI tool how to do this, or if that doesn't help, look up their documentation. Create a project folder for your code files if needed and move your code files into that folder. Drag and drop that folder into the Netlify Drop. Next time you want to deploy, you can drag and drop the same folder into the Netlify Drop Publisher to start a new manual deployment. Have more questions? Check out the Drag and drop docs. Method Netlify contextSection titled “Method Netlify context” Share Netlify deployment context with your AI tool. We recommend sharing both if they are both supported. Share Netlify’s llms.txt URL at https://docs.netlify.com/llms.txt Install the Netlify MCP Server Once you've shared Netlify context, prompt your AI tool to deploy to Netlify. You can also use the Netlify CLI commands directly. Example deploy this project to Netlify. Ask me questions if you need more details.To help reduce complexity, explain as if I'm new to web development butstill use the technical terms I'd need to understand for debugging,troubleshooting, and looking up more information. Have more questions? Check out the Build with AI docs. Checkpoint Your AI tool should deploy your project to Netlify and share a Deploy Preview link and/or a link to your Netlify dashboard.If your project is not deploying as expected, get help in these a failed deploy Build troubleshooting tips Ask Netlify AI Method CLISection titled “Method CLI” The Netlify CLI offers commands designed for AI agents and automated workflows. Create a project from a promptSection titled “Create a project from a prompt” Use netlify create to generate, deploy, and download a new project from a natural language windownetlify create \"a landing page for a SaaS product with a waitlist signup\" This command uses Agent Runners to build the project, deploy it to a live URL, and download the code to your local machine. Deploy without an accountSection titled “Deploy without an account” Use the --allow-anonymous flag to deploy without logging in or creating a Netlify windownetlify deploy --allow-anonymous This creates a project with a live URL. You have one hour to claim ownership by logging in or creating a Netlify account. This is useful for AI agents that need to create temporary projects without requiring credentials. Note, though, that sites or apps that use serverless functions or edge functions will require an account. Learn more about these features in the Netlify CLI docs. Next stepsSection titled “Next steps” Need help refining your project? See our Build with AI and Prototyping best practices guides. Last 30, 2026 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nDeploy this project to Netlify. Ask me questions if you need more details.To help reduce complexity, explain as if I'm new to web development butstill use the technical terms I'd need to understand for debugging,troubleshooting, and looking up more information.\n```\n\nExample:\n```text\nnetlify create \"a landing page for a SaaS product with a waitlist signup\"\n```\n\nExample:\n```text\nnetlify deploy --allow-anonymous\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.183Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":18,"estimatedTokens":1798}}35{"id":"doc-get_started_with_the_netlify_api_netlify_docs-1908e6cd","source":"documentation","title":"Get started with the Netlify API | Netlify Docs","url":"https://docs.netlify.com/api-and-cli-guides/api-guides/get-started-with-api/","text":"Example:\n```text\ncurl -H \"User-Agent: MyApp (YOUR_NAME@EXAMPLE.COM)\" \\     -H \"Authorization: Bearer YOUR_OAUTH2_ACCESS_TOKEN\" \\     https://api.netlify.com/api/v1/sites\n```\n\nExample:\n```text\nX-RateLimit-Limit: 500X-RateLimit-Remaining: 56X-RateLimit-Reset: 1372700873\n```\n\nExample:\n```text\nLink: <https://api.netlify.com/api/v1/sites?page=3&per_page=20>; rel=\"next\",    <https://api.netlify.com/api/v1/sites?page=5&per_page=20>; rel=\"last\"\n```\n\nExample:\n```text\nPOST /api/v1/sites\n```\n\nExample:\n```text\nPOST /api/v1/sites/{site_id}/deploys\n```\n\nExample:\n```text\n{  \"files\": {    \"/index.html\": \"907d14fb3af2b0d4f18c2d46abe8aedce17367bd\",    \"/main.css\": \"f18c2d7367bd9046abe8aedce17d14fb3af2b0d4\"  },  \"functions\": {    \"hello-world\": \"708b029d8aa9c8fa513d1a25b97ffb6efb12b423\"  }}\n```\n\nExample:\n```text\n{  \"id\": \"1234\",  \"required\": [\"907d14fb3af2b0d4f18c2d46abe8aedce17367bd\"],  \"required_functions\": [\"708b029d8aa9c8fa513d1a25b97ffb6efb12b423\"]}\n```\n\nExample:\n```text\nPUT /api/v1/deploys/{deploy_id}/files/index.html\n```\n\nExample:\n```text\nPUT /api/v1/deploys/{deploy_id}/functions/hello-world?runtime=js\n```\n\nExample:\n```text\n{  \"async\": true,  \"files\": {    \"/index.html\": \"907d14fb3af2b0d4f18c2d46abe8aedce17367bd\"  },  \"functions\": {    \"hello-world\": \"708b029d8aa9c8fa513d1a25b97ffb6efb12b423\"  }}\n```\n\nExample:\n```text\nGET /api/v1/sites/{site_id}/deploys/{deploy_id}\n```\n\nExample:\n```text\ncurl -H \"Content-Type: application/zip\" \\     -H \"Authorization: Bearer YOUR_OAUTH2_ACCESS_TOKEN\" \\     --data-binary \"@website.zip\" \\     https://api.netlify.com/api/v1/sites/mysite.netlify.app/deploys\n```\n\nExample:\n```text\ncurl -H \"Content-Type: application/zip\" \\     -H \"Authorization: Bearer YOUR_OAUTH2_ACCESS_TOKEN\" \\     --data-binary \"@website.zip\" \\     https://api.netlify.com/api/v1/sites\n```\n\nExample:\n```text\nGET /api/v1/deploys/{deploy_id}\n```\n\nExample:\n```text\n{ \"id\": \"1234\", \"state\": \"ready\" }\n```\n\nExample:\n```text\n[  {    \"id\": \"3970e0fe-8564-4903-9a55-c5f8de49fb8b\",    \"premium\": false,    \"claimed\": true,    \"name\": \"synergy\",    \"custom_domain\": \"www.example.com\",    \"url\": \"http://www.example.com\",    \"admin_url\": \"https://api.netlify.com/sites/synergy\",    \"screenshot_url\": null,    \"created_at\": \"2013-09-17T05:13:08Z\",    \"updated_at\": \"2013-09-17T05:13:19Z\",    \"user_id\": \"51f60d2d5803545326000005\"  }]\n```\n\nExample:\n```text\n{  \"id\": \"3970e0fe-8564-4903-9a55-c5f8de49fb8b\",  \"premium\": false,  \"claimed\": true,  \"name\": \"synergy\",  \"custom_domain\": \"www.example.com\",  \"notification_email\": \"me@example.com\",  \"url\": \"http://www.example.com\",  \"admin_url\": \"https://api.netlify.com/sites/synergy\",  \"screenshot_url\": null,  \"created_at\": \"2013-09-17T05:13:08Z\",  \"updated_at\": \"2013-09-17T05:13:19Z\",  \"user_id\": \"51f60d2d5803545326000005\"}\n```\n\nExample:\n```text\n{  \"html\": { \"pretty_urls\": true }}\n```\n\nExample:\n```text\n{  \"my_meta_key\": \"my_meta_value\"}\n```\n\nExample:\n```text\n[  {    \"id\": \"/index.html\",    \"path\": \"/index.html\",    \"sha\": \"20828dcdf2cd07e5980fe52759101591bf5014ab\",    \"mime_type\": \"text/html\",    \"size\": 27232  }]\n```\n\nExample:\n```text\n{  \"id\": \"/index.html\",  \"path\": \"/index.html\",  \"sha\": \"20828dcdf2cd07e5980fe52759101591bf5014ab\",  \"mime_type\": \"text/html\",  \"size\": 27232}\n```\n\nExample:\n```text\n[  {    \"id\": \"52465f435803544542000001\",    \"premium\": false,    \"claimed\": true,    \"name\": \"synergy\",    \"custom_domain\": \"www.example.com\",    \"notification_email\": \"me@example.com\",    \"url\": \"http://www.example.com\",    \"deploy_url\": \"http://52465f435803544542000001.some-site.netlify.app\",    \"admin_url\": \"https://api.netlify.com/sites/synergy\",    \"screenshot_url\": null,    \"created_at\": \"2013-09-17T05:13:08Z\",    \"updated_at\": \"2013-09-17T05:13:19Z\",    \"user_id\": \"51f60d2d5803545326000005\",    \"state\": \"old\"  }]\n```\n\nExample:\n```text\n{  \"id\": \"52465f435803544542000001\",  \"premium\": false,  \"claimed\": true,  \"name\": \"synergy\",  \"custom_domain\": \"www.example.com\",  \"notification_email\": \"me@example.com\",  \"url\": \"http://www.example.com\",  \"deploy_url\": \"http://52465f435803544542000001.some-site.netlify.app\",  \"admin_url\": \"https://api.netlify.com/sites/synergy\",  \"screenshot_url\": null,  \"created_at\": \"2013-09-17T05:13:08Z\",  \"updated_at\": \"2013-09-17T05:13:19Z\",  \"user_id\": \"51f60d2d5803545326000005\",  \"state\": \"old\"}\n```\n\nExample:\n```text\n{  \"id\": \"52465f435803544542000001\",  \"premium\": false,  \"claimed\": true,  \"name\": \"synergy\",  \"custom_domain\": \"www.example.com\",  \"notification_email\": \"me@example.com\",  \"url\": \"http://www.example.com\",  \"deploy_url\": \"http://52465f435803544542000001.some-site.netlify.app\",  \"admin_url\": \"https://api.netlify.com/sites/synergy\",  \"screenshot_url\": null,  \"created_at\": \"2013-09-17T05:13:08Z\",  \"updated_at\": \"2013-09-17T05:13:19Z\",  \"user_id\": \"51f60d2d5803545326000005\",  \"state\": \"current\"}\n```\n\nExample:\n```text\n[  {    \"id\": 0,    \"title\": \"Test\",    \"general\": \"\\u003Cscript\\u003Ealert(\\\"Hello\\\")\\u003C/script\\u003E\",    \"general_position\": \"head\",    \"goal\": \"\",    \"goal_position\": \"footer\"  }]\n```\n\nExample:\n```text\n{  \"id\": 0,  \"title\": \"Test\",  \"general\": \"\\u003Cscript\\u003Ealert(\\\"Hello\\\")\\u003C/script\\u003E\",  \"general_position\": \"head\",  \"goal\": \"\",  \"goal_position\": \"footer\"}\n```\n\nExample:\n```text\n[  {    \"id\": \"ac0865cc46440b1e64666f520e8d88d670c8a2f6\",    \"site_id\": \"0d3a9d2f-ef94-4380-93df-27ee400e2048\",    \"name\": \"Landing Page\",    \"paths\": [\"/index\"],    \"submission_count\": 3,    \"fields\": [      { \"name\": \"name\", \"type\": \"text\" },      { \"name\": \"email\", \"type\": \"email\" },      { \"name\": \"phone\", \"type\": \"text\" },      { \"name\": \"company\", \"type\": \"text\" },      { \"name\": \"website\", \"type\": \"url\" },      { \"name\": \"number_of_employees\", \"type\": \"select\" }    ],    \"created_at\": \"2013-09-18T20:26:19Z\"  }]\n```\n\nExample:\n```text\n[  {    \"id\": \"5231110b5803540aeb000019\",    \"number\": 13,    \"title\": null,    \"email\": \"test@example.com\",    \"name\": \"Mathias Biilmann\",    \"first_name\": \"Mathias\",    \"last_name\": \"Biilmann\",    \"company\": \"Netlify\",    \"summary\": \"Hello, World\",    \"body\": \"Hello, World\",    \"data\": {      \"email\": \"test@example.com\",      \"name\": \"Mathias Biilmann\",      \"ip\": \"127.0.0.1\"    },    \"created_at\": \"2013-09-12T00:55:39Z\",    \"site_url\": \"http://synergy.netlify.app\"  }]\n```\n\nExample:\n```text\n[  {    \"name\": \"url\",    \"fields\": [      {        \"name\": \"url\",        \"options\": {          \"type\": \"string\",          \"title\": \"URL to notify\"        }      }    ],    \"events\": [\"submission_created\", \"deploy_created\", \"deploy_failed\"]  }]\n```\n\nExample:\n```text\n[  {    \"id\": \"5636b7a00d61eec2d6001004\",    \"site_id\": \"0d3a9d2f-ef94-4380-93df-27ee400e2048\",    \"type\": \"email\",    \"event\": \"submission_created\",    \"data\": { \"email\": \"test@example.com\" },    \"created_at\": \"2015-10-20T21:51:51Z\",    \"updated_at\": \"2015-10-20T21:51:51Z\"  }]\n```\n\nExample:\n```text\n{  \"site_id\": \"0d3a9d2f-ef94-4380-93df-27ee400e2048\",  \"form_id\": \"5235a7a00d61eec2d6001302\",  \"type\": \"email\",  \"event\": \"submission_created\",  \"data\": { \"email\": \"test@example.com\" }}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.185Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":31,"totalLines":156,"estimatedTokens":1764}}36{"id":"doc-fix_a_failed_deploy_netlify_docs-daeaa8f9","source":"documentation","title":"Fix a failed deploy | Netlify Docs","url":"https://docs.netlify.com/resources/troubleshooting/fix-a-failed-deploy","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Troubleshooting Troubleshooting Overview Ask Netlify Fix a failed deploy Error reference Request chain Page not found error guide Troubleshooting FAQ Support Guides Support scope Support On this page Overview How these solution suggestions work Enable solution suggestions Disable solution suggestions More troubleshooting help On this page Overview How these solution suggestions work Enable solution suggestions Disable solution suggestions More troubleshooting help For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Troubleshooting / Fix a failed deploy Copy page View as Markdown Copy as Markdown View as Markdown Netlify’s AI capabilities help diagnose and suggest solutions for deploy failures or build errors so you can get back to shipping code. How these solution suggestions workSection titled “How these solution suggestions work” When a deployment failure happens, your team will find a Why did it fail? button on the failed deploy summary page. This button always appears on failed deploys unless an Owner has disabled the feature for your team. If this feature is enabled for your team and you select the Why did it fail? button, the details about the failure are processed by Netlify’s AI systems to generate guidance for how to resolve the issue. We’re continuously improving the feature to suggest accurate solutions but your team should review them for accuracy. Security for solution suggestionsSection titled “Security for solution suggestions” This feature does not use the information processed to train models or store data outside of Netlify’s systems. The deploy failure details used to generate suggestions subsection of the build log entries in your deploy log at or around the place where the error returns. other metadata, such as the name of your site’s framework to provide more accurate results. Like all Netlify features, usage of this capability is subject to our service agreements referenced in the Terms of Use. Enable solution suggestionsSection titled “Enable solution suggestions” These AI capabilities are only available if they have been enabled for your team. Once enabled, any Developer or Owner on your team can use this AI capability to generate solutions for resolving deploy failures on all sites they have access to in your team. Who can turn this feature on or can enable or disable this feature for their team. Developers can enable this feature for their team unless an Owner has disabled this feature for the team. The Why did it fail? button appears to Developers and Owners unless the feature is disabled. If a Developer selects the Why did it fail? button and the feature is not enabled or disabled for the team, then a prompt appears to enable this feature for the team. Until this feature is enabled on the team, selecting this button will not process the deploy failure details or generate suggestions. As an Owner, to enable deploy failure solution your team, go to Team settings > General > AI enablement Select Configure. Choose Enabled. Disable solution suggestionsSection titled “Disable solution suggestions” Once disabled, the Why did it fail? button will not appear on any of your team’s sites. Only an Owner can enable deploy diagnostics for all sites in your team after the feature is disabled. As an Owner, to disable deploy failure solution your team, go to Team settings > General > AI enablement Select Configure. Choose Disabled. More troubleshooting helpSection titled “More troubleshooting help” Verified Support Guide on using the log to debug your build process Build troubleshooting tips Last 14, 2025 PreviousAsk NetlifyNextError reference Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.186Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1292}}37{"id":"doc-apis_for_code_agents_netlify_docs-faedc0df","source":"documentation","title":"APIs for code agents | Netlify Docs","url":"https://docs.netlify.com/extend/building-code-agents/apis-for-code-agents","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Building code agents Building code agents Overview APIs for code agents Become AI partner On this page Overview API guides Request guides and examples More resources On this page Overview API guides Request guides and examples More resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Building Code Agents / APIs for code agents Copy page View as Markdown Copy as Markdown View as Markdown As a developer building code agents, learn how to build and include Netlify’s capabilities into your AI workflows using Netlify's REST API. Netlify’s existing REST API is designed to support you in building code agents so that your AI workflows can help your users deploy, secure, and manage their projects beyond an initial prototype. API guidesSection titled “API guides” Check out our API guides for code a PAT for Netlify OAuthLearn how to use the Netlify REST API so you can act on behalf of your users.Surface deploy and function logsLearn how to make use of the information found in Netlify's logs.Add a custom domain with the APILearn how to assign a custom domain to your deployment.Deploy a full-stack app to NetlifyLearn best practices for deploying a full-stack app. We recommend this AI workflow, which deploys the app as a zip file to Netlify.Deploy a static site to NetlifyLearn best practices for deploying a static site. We recommend this example AI workflow, which deploys a static site as a zip file to Netlify. Request guides and examplesSection titled “Request guides and examples” If you want to recommend a guide, let us know in this Suggest a guide form. If you want to recommend a live working example, let us know in an issue in the Examples repo. More resourcesSection titled “More resources” If you’re just getting started with the Netlify REST API, you can check REST API reference Get started guide for Netlify REST API Last 4, 2026 PreviousOverviewNextBecome AI partner Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.186Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":861}}38{"id":"doc-create_deploys_netlify_docs-02ee9794","source":"documentation","title":"Create deploys | Netlify Docs","url":"https://docs.netlify.com/deploy/create-deploys/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview Deploy with AI agents Deploy with Git Netlify CLI Drag and drop API endpoints Deploy to Netlify button Markup File-based template configuration URL-based template configuration Define additional instructions Build hooks Zapier integrations n8n integrations On this page Overview Deploy with AI agents Deploy with Git Netlify CLI Drag and drop API endpoints Deploy to Netlify button Markup File-based template configuration URL-based template configuration Define additional instructions Build hooks Zapier integrations n8n integrations For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Create deploys Copy page View as Markdown Copy as Markdown View as Markdown This page covers features and tools you can use to create deploys with or without continuous deployment. Note When you create a deploy manually without continuous deployment, Netlify does not run a build command. New projects can be private by default On Credit-based plans, if your team has private by default enabled, new projects start private no matter how you create them. Only your team can view a project until you make it public. Learn more about project visibility. Deploy with AI agentsSection titled “Deploy with AI agents” You can build with an AI agent directly from the Netlify dashboard using Agent Runners with Claude Code, OpenAI Codex, and Google Gemini as your agent. Every agent run that makes a file change automatically generates a Deploy Preview, so you can review changes before they go live. The Deploy Preview URL for previews generated by an agent run is https://agent-69a6140cc823ebba94b8ef32--my-site.netlify.app. You can also start an agent run directly from a deploy details page. Learn more about Agent Runners. Deploy with GitSection titled “Deploy with Git” Continuous deployment works by connecting a Git repository to a Netlify site and keeping the two in sync. This is done using the Git provider’s OAuth2 authentication or the Netlify GitHub App. After you set up Git provider permissions and link a repository, Netlify will run your build command and deploy the result whenever you push to your Git repo. The benefits of Netlify’s continuous deployment deploying without committing and pushing first Easy collaboration through pull/merge requests Fix a typo through your Git provider’s web UI from your mobile Edit content without code by using a CMS Netlify CLISection titled “Netlify CLI” You can use the CLI to create a new project from a prompt with netlify create, which generates, deploys, and downloads a project based on a natural language description. You can also use the CLI to set up continuous deployment for a Git repository. Once continuous deployment is configured, you can update your Production site, staging site, or Deploy Preview with git push. You can also use the CLI to create manual deploys without continuous deployment. For example, you can deploy directly to your production site from the command line with netlify deploy --prod. To deploy without logging in or creating a Netlify account, use netlify deploy --allow-anonymous. This creates a temporary project with a live URL that you can claim within one hour. When you claim it, the project adopts the default project visibility set by the Team Owner. Drag and dropSection titled “Drag and drop” Tip For easiest deployment and management, make sure you're already logged in to the team where you want your site project to be on Netlify. You can create a new site by dragging a project folder containing your site files (like .html files) to Netlify Drop. You can also find a drag and drop section at the bottom of your team's Projects page. You don’t have to build your project first. As long as you’re logged in, you can drop a web project that still needs a build step, and Netlify will detect your framework and run the build for you before publishing. Dropping a pre-built output folder also works. If you drop a project without being logged in, Netlify publishes the files as-is. If you need to update a site that you created using drag and drop, update and rebuild your project locally. Then, drag the project’s updated output folder to the deploy dropzone at the bottom of the site’s Deploys page. This will start a new site deploy with the updated files. You can also use this functionality to manually update any site that is not connected to a Git repository. API endpointsSection titled “API endpoints” You can use the API to create deploys manually using a file digest or a ZIP file. Deploy to Netlify buttonSection titled “Deploy to Netlify button” The Deploy to Netlify button helps users deploy new sites from templates with one single click. Web developers can use the button to give their users a one-click way to deploy those applications on Netlify. It’s designed to be used in README files, documentation sites, and probably anything that renders as an HTML file. You can find examples of the button in use in the READMEs on our templates. The template code must be available in a public repository stored on GitHub.com or GitLab.com. MarkupSection titled “Markup” You can use any markup language that renders as HTML to display the button. There are two very important URLs that you’ll SVG URL for the ://www.netlify.com/img/deploy/button.svg. The URL the button takes users ://app.netlify.com/start/deploy. This link requires the public Git repository as a parameter, for ://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit You can make the button clone a whole repository or just a portion of a repository. Both are good options for monorepos but you may need to set a base directory if the button clones the whole repository. Here is an example of the full Markdown or HTML code for a Deploy to Netlify button that deploys the Netlify StatusKit HTML Markdown[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit) HTML<a href=\"https://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit\"> <img src=\"https://www.netlify.com/img/deploy/button.svg\" alt=\"Deploy to Netlify\"></a> If your repository uses extensions built with Netlify's SDK, you can add the URL parameter fullConfiguration=true to make users go through an extra step where they'll be able to install required extensions, choose a site name, and configure their new repository before deploying the site. File-based template configurationSection titled “File-based template configuration” You can control some aspects of template configuration directly in the template’s Git repository. Create a netlify.toml file in the root of the repository, if you don’t have it already. Netlify will read the information from there. If your Deploy to Netlify button clones just a subdirectory of the repository, create the netlify.toml file in that subdirectory so that the file ends up in the root of the cloned repository. This file can also be used to set options for continuous deployment, you can read more about it in the file-based configuration documentation. Within the [template] section of the netlify.toml, you can set three list of incoming hooks for the users site. This is very useful if you want to allow a third party service to control when to deploy the site. This is what headless CMS services like Contentful and DatoCMS do. Users can give those providers the address Netlify generates for their specific incoming requests. [template] incoming-hooks = [\"Contentful\"] A list of required environment variables. This is one way to let users set specific configuration options upon deployment. It also enables customization without having to change the code of the base template. If you don’t want to use a netlify.toml file, you can instead use the URL hash to require or even pre-fill environment variables. [template.environment] SECRET_TOKEN = \"change me for your secret token\" CUSTOM_LOGO = \"set the url to your custom logo here\" The placeholder strings you set in netlify.toml are used as labels in the UI to provide guidance to users deploying your template. A list of required extension slugs. Extensions expand the capabilities of a site deployed on Netlify. This is useful if you wish to specify your template depends on specific Netlify extensions to work as expected. If you define required-extensions, users will be prompted to install the extensions, to allow them to get up and running faster. This can be combined with the optional parameter fullConfiguration=true if you wish to force users to install the extension(s) prior to the first deploy of their site. [template] required-extensions = [\"supabase\"] Note that you can’t do the following in this [template] values for environment variables. To pre-fill environment variable values, use URL-based template configuration. Set a base directory for the Deploy to Netlify button. To set a base directory for sites deployed with the button, use the base query parameter instead. URL-based template configurationSection titled “URL-based template configuration” You can control the following aspects of how the template repo is cloned and how the resulting site is configured by passing values in the Deploy to Netlify or set environment variables set a base directory clone a subdirectory deploy a specific branch Require or set environment variablesSection titled “Require or set environment variables” You can require or set environment variables for the site template in the hash of the template’s Deploy to Netlify URL with key/value pairs. Values can be null. https://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/sweetkittentemplate#SECRET_TOKEN=specialuniquevalue&CUSTOM_LOGO= Passing environment variable values in the hash ensures that they’re processed on the client side only. You can create custom Deploy to Netlify buttons for your users with tokens and other secure data, and they won’t appear in Netlify logs. Set a base directory for monoreposSection titled “Set a base directory for monorepos” If your Deploy to Netlify button clones a whole monorepo rather than a single subdirectory, you can use the base query parameter to set an alternate directory as the base directory for deployments. The format is &base=your-base-directory. Note that while Netlify uses the specified base directory for the build and deploy, the entire repo is still cloned to the user’s Git provider account. For example, here’s a URL with a base directory of ://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/sweetkittentemplate&base=blog When someone uses this Deploy to Netlify button, Netlify clones the whole sweetkittentemplate repository to the user’s Git provider account and then builds and deploys from the blog subdirectory. Note the following configuration to set incoming hooks and environment variables can only be used at root level and can’t be used for sites with a different base directory. When you set an alternate base directory, the netlify.toml in the base directory will take precedence over the root level configuration for that site’s builds. Clone a subdirectory of a repoSection titled “Clone a subdirectory of a repo” To make a Deploy to Netlify button clone just a part of a repo, use the create_from_path query parameter to specify a subdirectory to clone. The format is &create_from_path=your-subdirectory. For example, here’s a URL with a creation path of examples/hello: https://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/demos&create_from_path=examples/hello When someone uses this Deploy to Netlify button, Netlify clones just the subdirectory examples/hello from the demos repo to the user’s Git provider account and then builds and deploys from the root of the cloned repository. Deploy a specific branchSection titled “Deploy a specific branch” To make a Deploy to Netlify button deploy a branch other than the default branch, use the branch query parameter. The format is &branch=your-branch. For example, here’s a URL that will deploy the beta-feature ://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/app&branch=beta-feature When someone uses this Deploy to Netlify button, Netlify sets the new site’s production branch to beta-feature and then builds and deploys from that branch of the cloned repository. Define additional instructionsSection titled “Define additional instructions” You can define additional configuration instructions in the USAGE.md file, which should be saved in the root of your repository. This can be useful to include guidance on setting up any required third-party service accounts (such as databases, content sources, analytics platforms, or APIs) and provisioning those services. Be sure to mention any necessary extensions or tools that need to be pre-installed to ensure a smooth setup. When a USAGE.md file is included in the root of the repository, Netlify's app will prompt users to read the additional instructions included in it during the fullConfiguration flow and, after the site has been deployed, in the site overview. Build hooksSection titled “Build hooks” Build hooks give you unique URLs you can use to trigger new builds and deploys. Zapier integrationsSection titled “Zapier integrations” Netlify is available on Zapier, where you can connect Netlify with over 1,000 other applications. You can use Zapier “Zaps” to start a new deploy of your site in response to a trigger from another service. You can find out more on our blog, or use one of the templates below to get deploys of Netlify sites daily Netlify + Schedule by Zapier Use this Zap Start Netlify deploys when you send new Tweets Netlify + Twitter Use this Zap Start Netlify site deploys with the push of a Flic button Flic + Netlify Use this Zap n8n integrationsSection titled “n8n integrations” Netlify is available on n8n, an open source tool that allows you to connect Netlify with other applications. By using one of n8n’s Netlify nodes, you can create your own automated workflow. To get started, you can use the Netlify node, Netlify Trigger node, or you can use the existing workflow site when new content gets added Netlify node Use workflow Last 28, 2026 PreviousDeploy PreviewsNextManage deploys Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nhttps://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit\n```\n\nExample:\n```text\n[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit)\n```\n\nExample:\n```text\n[template]  incoming-hooks = [\"Contentful\"]\n```\n\nExample:\n```text\n[template.environment]  SECRET_TOKEN = \"change me for your secret token\"  CUSTOM_LOGO = \"set the url to your custom logo here\"\n```\n\nExample:\n```text\n[template]    required-extensions = [\"supabase\"]\n```\n\nExample:\n```text\nhttps://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/sweetkittentemplate#SECRET_TOKEN=specialuniquevalue&CUSTOM_LOGO=\n```\n\nExample:\n```text\nhttps://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/sweetkittentemplate&base=blog\n```\n\nExample:\n```text\nhttps://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/demos&create_from_path=examples/hello\n```\n\nExample:\n```text\nhttps://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/app&branch=beta-feature\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.189Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":9,"totalLines":48,"estimatedTokens":4331}}39{"id":"doc-manage_deploys_netlify_docs-10cd8cc8","source":"documentation","title":"Manage deploys | Netlify Docs","url":"https://docs.netlify.com/deploy/manage-deploys/manage-deploys-overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview Find a deploy Rollbacks Locked deploys Lock a published deploy Unlock a locked deploy Event notifications Cancel a deploy Skip a deploy Retry deploy from latest branch commit Automated cleanup for failed and canceled deploys Automatic deploy deletion Change the deploy retention limit Manual deploy deletion through the Netlify UI Deploy deletion requirements Deploy deletion considerations Delete a deploy through the UI Download a deploy Download an individual file Download all deployed files Configure your deploy environment Failed deploy troubleshooting tips On this page Overview Find a deploy Rollbacks Locked deploys Lock a published deploy Unlock a locked deploy Event notifications Cancel a deploy Skip a deploy Retry deploy from latest branch commit Automated cleanup for failed and canceled deploys Automatic deploy deletion Change the deploy retention limit Manual deploy deletion through the Netlify UI Deploy deletion requirements Deploy deletion considerations Delete a deploy through the UI Download a deploy Download an individual file Download all deployed files Configure your deploy environment Failed deploy troubleshooting tips For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Manage Deploys / Manage deploys Copy page View as Markdown Copy as Markdown View as Markdown Netlify versions all deploys. From the Deploys tab for your site in the Netlify UI, you can browse any deploy you’ve ever made and preview it from a unique URL. Find a deploySection titled “Find a deploy” As a Developer or Team Owner, you can find deploys using the search or filter options available on the Deploys tab. Use the search field above the deploy list to search by deploy ID or branch name. Where to find your deploy ID You can find the deploy ID in the first part of a deploy permalink. For is the deploy ID of 1234abcd12acde000111cdef--mysitename.netlify.app. You can also filter deploys for your site based on these frame Filter deploys triggered in the Last hour, Last day, Last 7 days, or filter by a Custom date and time range. Deploy context Deploy status Successful Unsuccessful (includes Failed, Canceled, or Skipped deploys) Enqueued for deploys that are in the queue awaiting deployment Pending review, Accepted, or Rejected for deploys triggered by an unrecognized author. Learn more about deploy requests and permissions. RollbacksSection titled “Rollbacks” If you need to roll back, you can publish one of the previous deploys listed in the UI as the live version of your site in production. Use the Publish Deploy button on the detail page of any successful deploy. This doesn’t trigger a new deploy but instead publishes a previous atomic deploy that is still available to you. Rollbacks are instantaneous. Note If your Netlify site is connected to a Git repository and has auto publishing turned on, any new Git-triggered production deploys will overwrite the previously rolled back version. Locked deploysSection titled “Locked deploys” Locked deploys give you the ability of pinning a site to the latest published deploy for the time being. New deploys won’t be published to the main site, although Netlify will still build them and they will be ready for whenever you want to publish them. Lock a published deploySection titled “Lock a published deploy” You can lock a deploy by disabling auto publishing. To disable auto publishing, navigate to your site’s Deploys list and select Lock to stop auto publishing. Unlock a locked deploySection titled “Unlock a locked deploy” After a deploy has been locked, you can use Unlock to start auto publishing to unlock it from the same Deploys list. Event notificationsSection titled “Event notifications” This feature is available on all Pro and Enterprise plans. You can get notifications about locked deploys by email, outgoing webhook, or Slack. Netlify can notify you when a deploy is either locked or unlocked. You can configure these notifications from the notifications section in Project configuration > Notifications > Deploy notifications. Visit the deploy notifications documentation to learn more. Cancel a deploySection titled “Cancel a deploy” Sometimes, you may want to cancel a deploy after it has started. To do this, go to the detail page of the deploy in progress and select Cancel deploy. You’ll then be prompted to confirm the canceling action. Select Yes, cancel deploy to confirm. If you later want to restart the deploy, you can deploy from the latest branch commit. Skip a deploySection titled “Skip a deploy” Sometimes, you may want to push commits to a branch without triggering a deploy on Netlify. To avoid generating a Deploy Preview for a pull/merge request, add [skip ci] or [skip netlify] to the title of the pull/merge request. To avoid generating a branch or production deploy for a commit pushed directly to a branch, add [skip ci] or [skip netlify] anywhere in the Git commit message. To avoid generating a branch or production deploy for multiple commits pushed together, add [skip ci] or [skip netlify] to the most recent commit, and it will apply to all other commits in the push. The next commit pushed without one of those messages will trigger a new branch deploy or production deploy, including all changes from the skipped commits as well. To generate a Deploy Preview from a pull/merge request, remove [skip ci] or [skip netlify] from the title and push a new commit. To trigger a deploy at will on your production branch, go to your site’s Deploys page and select Trigger deploy at the top of the deploy list. To avoid triggering automated deploys of any kind, you can stop builds for the entire site. If you would like to continue building your deploys but don’t want them published to your main URL, you can stop auto publishing. Retry deploy from latest branch commitSection titled “Retry deploy from latest branch commit” If your build fails or you run into other issues, you can retry your deploy with the latest branch commit. You can also retry your deploy with a cleared cache. When you retry a deploy, the build triggers from the HEAD of your branch. If the HEAD of the branch differs from the original deploy SHA, Netlify still builds from the HEAD of the branch. Automated cleanup for failed and canceled deploysSection titled “Automated cleanup for failed and canceled deploys” By default, Netlify automatically deletes failed and canceled deploys older than 30 days (or 90 days on paid plans) as a part of deploy cleanup and maintenance. Once deleted, you can expect deploys and their associated builds to disappear from the Netlify UI and API queries. Automatic deploy deletionSection titled “Automatic deploy deletion” By default, Netlify will delete deploys after 30 days (or 90 days on paid plans). This includes deploys triggered by either source control changes, the Netlify UI or CLI, manual uploads, or third-party integrations. Netlify will not automatically deploy currently published to your site (also called the published deploy. The most recent successful production deploy. The most recent successful branch deploy for a given branch. Owners and Developers on an Enterprise plan can adjust the default retention period for up to 365 days. Once a deploy is automatically deleted, you can expect the deploy and its associated builds to disappear from the Netlify UI and API queries. If you visit the deploy permalink for an automatically deleted deploy, a generic 404 page is returned. The team audit log updates with Deploy retention has changed when a Developer or Team Owner changes the deploy retention limit for a site. Change the deploy retention limitSection titled “Change the deploy retention limit” This feature is available on Enterprise plans. To adjust a site’s default deploy retention limit, you must be a Team Owner or Developer. After you change the deploy retention limit for a site and save, all changes take effect instantly. For example, if you set your site’s deploy retention to 30 days and confirm this update, all eligible deploys older than 30 days will delete with no additional warning. Netlify runs deploy deletions daily. As a Developer or Team Owner, go to Project configuration > Build & Deploy > Automatic Deletion. Select Configure, and use the drop-down to select a new deploy retention limit. Confirm with Save setting. Manual deploy deletion through the Netlify UISection titled “Manual deploy deletion through the Netlify UI” You may want to delete a deploy to remove sensitive data, as a part of your team’s security best practices, or to clean up your Netlify deploys list. Deploy deletions are logged in the team audit log as Deploy deleted actions. Deploy deletion requirementsSection titled “Deploy deletion requirements” To delete a deploy manually in the Netlify UI, you must be a Developer or Team Owner. You cannot delete the deploy that was most recently published to a site’s main URL. You also cannot delete a deploy that is still in progress. You must either cancel the deploy or wait until the deploy is finished before you can delete it. Deploy deletion considerationsSection titled “Deploy deletion considerations” Be aware that deleting a deploy is permanent and does not reduce costs for your Netlify team or help you preserve build minutes. More details on this are below. Once a deploy is deleted, you cannot access any artifacts associated with the deploy, including URLs, deploy logs, or functions unique to the deploy. The deploy permalink for the deleted deploy will no longer work and will show a generic 404 error message instead. After you delete a deploy, you may encounter the deploy context URL may no longer work. If you delete a deploy and there are no other deploys in the context, the deploy context URL will return a generic 404 message. Your deploy context URL may show changes from a different deploy. If you delete the most recent deploy to a deploy context, then that URL will point to the next most recent deploy in the same context. Split testing results may be disrupted. If the deleted deploy is from a branch with split testing configured, your split testing results may be disrupted. After a deploy is deleted, the deploy’s associated build is removed from the team’s builds list on the main Builds page. However, the build data from deleted deploys is still included in the aggregated build minute counts and insights analytics to help you make an accurate assessment of your team’s build minutes usage. Delete a deploy through the UISection titled “Delete a deploy through the UI” As a Developer or Team Owner, you can delete a single deploy manually through the UI. To find the deploy you want to delete, go to the Deploys page for your site and select the deploy from the deploy list or use the deploy search. From the deploy details successful deploys, select Options > Delete deploy. For failed or canceled deploys, select Delete deploy. If the Delete deploy option is not available, make sure the deploy meets the requirements for deploy deletion. To confirm, review the deploy deletion warning, then select Delete. Download a deploySection titled “Download a deploy” From the detail page of any successful deploy, including Netlify Drop deploys, you can download individual files or an entire copy of your site. Download an individual fileSection titled “Download an individual file” On the detail page for a successful deploy, scroll down to Deploy file browser. Search for or browse to the file you want to inspect, then select Download. Download all deployed filesSection titled “Download all deployed files” To generate a ZIP file containing all of your deployed the deploy detail page header for a successful deploy, select Download. When the ZIP finishes generating, select Download ready to download the deploy. If you’re looking to update a site you deployed manually through the UI, you can download and edit the deployed files locally, and then use the deploy dropzone to deploy the update. Configure your deploy environmentSection titled “Configure your deploy environment” You can use environment variables to control the environment your site gets deployed to. Environment variables created using the Netlify UI, CLI, or API are available to Builds, Functions, Runtime and Post processing scopes. This means that you can use them in your serverless functions and edge functions at execution time, snippet injection during post processing, and more. Note that environment variables created in a netlify.toml are not available to the deploy environment. To learn more about how to set and use environment variables review our environment variables docs. For more information on using environment variables with functions during runtime specifically, review environment variables with serverless functions and edge functions. Failed deploy troubleshooting tipsSection titled “Failed deploy troubleshooting tips” To help you fix failed deploys, Netlify offers AI capabilities that diagnose and suggest solutions for deploy failures and build errors so you can get back to shipping code. Learn more about Netlify’s AI capabilities to give solutions for failed deploys. For more help troubleshooting failed builds, check out our Build troubleshooting tips. If your deploy returns an error, you can also clear your cache and retry the deploy in the Netlify UI or trigger a new deploy. Last 16, 2026 PreviousCreate deploysNextProtect deploys Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.192Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":3823}}40{"id":"doc-deploy_previews_netlify_docs-fb09c47e","source":"documentation","title":"Deploy Previews | Netlify Docs","url":"https://docs.netlify.com/deploy/deploy-types/deploy-previews/","text":"Example:\n```text\n@netlify /start/choose-your-path\n```\n\nExample:\n```text\n<!--Set an entry path if your PR has a primary page for review.    Add a relative path next to `@netlify` below.-->\n@netlify /\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.194Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":2,"totalLines":12,"estimatedTokens":54}}41{"id":"doc-function_metrics_netlify_docs-e2fb38e3","source":"documentation","title":"Function Metrics | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/function-metrics","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Use cases Metric definitions Filter your data Deployed functions Time frame Response codes Logs Inspect a deploy on your chart Data retention and freshness Limitations Next steps On this page Overview Use cases Metric definitions Filter your data Deployed functions Time frame Response codes Logs Inspect a deploy on your chart Data retention and freshness Limitations Next steps For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Function Metrics Copy page View as Markdown Copy as Markdown View as Markdown Function Metrics give you insights into the performance, reliability, and usage patterns of functions on your site. Function metrics availability Function Metrics is no longer available for Credit-based plan users or Enterprise users who have the Observability feature enabled. Instead, we recommend these users check out Observability. To explore Function Metrics for your site, go to Logs & Metrics > Functions. Use casesSection titled “Use cases” By analyzing success and error rates alongside other metrics such as invocation count and function duration, you can optimize performance, troubleshoot issues, and make data-driven decisions to enhance the overall quality and user experience of your projects. Optimize performance. Identify performance bottlenecks by analyzing function duration metrics. By pinpointing functions with high average durations or extreme long tails (as indicated by p95 and p99 durations), you can target your optimization efforts. Troubleshoot errors. Find functions with high error rates and drill into the logs to troubleshoot. By observing error rates over time, you can detect trends, enabling proactive problem-solving before errors escalate. With deploy markers on the timeline, you can discover if a spike in errors is associated with a specific change and then rollback to an earlier deploy while you fix the issue. Prioritize development efforts. Understand function invocation patterns to allocate your time more efficiently. By analyzing which low-performing functions receive the most invocations, you can focus on making high-impact improvements. Metric definitionsSection titled “Metric definitions” to your serverless function endpoints. A request to a function path that results in a cached response being served does not count as an invocation. from function endpoints with 5xx status codes. from function endpoints with non-5xx status codes. Average compute time. % of invocations were completed within this time. % of invocations were completed within this time. % of invocations were completed within this time. Percentiles and data granularity Values for p50, p95, and p99 are calculated as an average of hourly percentile scores. Filter your dataSection titled “Filter your data” Focus on the events and information that you care about by filtering your data. Deployed functionsSection titled “Deployed functions” By default, Function Metrics charts include all functions on the production branch. You can change this in a few the filter menus to pick a different Branch, focus on a specific Function, or do both depending on your needs. Select a Function name in the Distribution by function chart to scope the Invocations chart to just that function. Time frameSection titled “Time frame” By default, Function Metrics charts are scoped to the last 24 hours. You can change the time frame in a couple of the Time frame menu to select a different range. Note that data retention varies by team plan. Zoom in by clicking and dragging your desired range in the Invocations chart. Response codesSection titled “Response codes” By default, the Invocations chart is faceted by Success / Error. In these groupings, all 5xx response codes are considered errors and all other response codes are considered successes. You can instead facet the chart by All Statuses for more granular data. In both cases, you can focus on specific response types with facet filters. Here are some the chart is faceted by Success / Error, you can filter it to just the Error data. Filtering the chart to just errors can help you identify patterns and trends that might otherwise be too small to detect when successes are also included in the chart. When the chart is faceted by All Statuses, you can filter it to one or more specific status codes, such as 428. Filtering the chart to a specific status code can help you troubleshoot specific scenarios, such as missing preconditions. LogsSection titled “Logs” You can drill into function logs for more information in a few the Invocations chart, use the Go to Logs link. When the chart includes All functions, the link takes you to the function logs index for your site. When the chart is scoped to a single function, the link takes you to that specific function’s logs filtered to the same time frame you were exploring in Function Metrics. In the Distribution by function chart, use the link on the Errors rate. These links take you to the specific function’s logs filtered to the same time frame you were exploring in Function Metrics. Older logs may no longer be available Note that function metric retention is different than function log retention. If your metrics charts are zoomed in to a time frame in the past, function logs may no longer be available for that period. Inspect a deploy on your chartSection titled “Inspect a deploy on your chart” When the Invocations chart is zoomed in to 3 days or less, it includes deploy markers to help you correlate patterns in your metrics with changes to your production code. Deploy markers are displayed as grey vertical lines in the chart. To inspect deploys, do the sure the Invocations chart is zoomed in to 3 days or less so that deploy markers are included in it. Select a deploy marker to reveal a description based on the pull/merge request title or commit message. Use the link on the deploy description to go to the relevant deploy details page where you can find a deploy summary and deploy log. Data retention and freshnessSection titled “Data retention and freshness” Metrics are retained for at least 7 days even after new function deployments. The metric retention period increases to 30 days for Core Pro and Enterprise plans. We update Function Metrics data on an ongoing basis. There are a few minutes of delay between when an invocation completes and when the metrics data is updated. You will need to refresh your browser to load the updates. LimitationsSection titled “Limitations” Function Metrics do not include data for the Builders Background Functions local invocations triggered while running netlify dev or netlify Next stepsSection titled “Next steps” After identifying patterns, trends, spikes, or other points of interest with Function Metrics you can go deeper with other monitoring tools knowing you’re focusing your efforts on impactful areas. Function logs. Examine per-invocation log statements and messages in a filterable interface. Log Drains. Perform flexible queries in third-party monitoring services. Last 16, 2025 PreviousSplit testingNextMonitor builds Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.194Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2248}}42{"id":"doc-overview_netlify_docs-da9deddb","source":"documentation","title":"Overview | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/observability/overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Get started Use cases Use case videos Availability Quick insights Traffic insights Bandwidth insights Compute insights Blocked requests Understand request counts Differences from web analytics tools Impact of CDN or proxy services Search & filter options Search options Filter options Observability vs. Log drains Limits and other restrictions Other restrictions On this page Overview Get started Use cases Use case videos Availability Quick insights Traffic insights Bandwidth insights Compute insights Blocked requests Understand request counts Differences from web analytics tools Impact of CDN or proxy services Search & filter options Search options Filter options Observability vs. Log drains Limits and other restrictions Other restrictions For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Observability / Overview Copy page View as Markdown Copy as Markdown View as Markdown Netlify Observability offers near real-time visibility into your project's production performance and resource usage. Monitor requests, bandwidth, runtime behavior, functions, and Edge Functions to understand how your web project operates in production, fix errors, and optimize web performance. Get startedSection titled “Get started” From your project overview, select Logs & metrics > Observability. To expand details for a request, select a request. Use casesSection titled “Use cases” Observability is designed to give you real-world insights into how your web project is working in production. Common use caseDescriptionQuestions exploredTroubleshoot issuesIdentify frequently requested 404 URLs and diagnose unexpected behavior.How common are these errors? On which pages? Is this driven by real user traffic or bots and crawlers?Analyze traffic patternsDetect AI crawler activity and bot traffic.What kinds of site visitors or requests is your site getting?Optimize performanceIdentify which resources are using the most bandwidth. Find cache misses on critical endpoints, assets consuming excessive bandwidth, over-invoked functions, and edge logic running in unintended regions.Which resources are using the most bandwidth? What’s driving up serverless function usage? Note that Observability shows you how your project is working in production but does not show you credits usage. To understand your credits and billing, check out our usage and billing docs. Use case videosSection titled “Use case videos” Learn how to use Observability to troubleshoot issues, analyze traffic patterns, and optimize performance from the following tutorial videos. AvailabilitySection titled “Availability” This feature is available on Credit-based plans, including Free, Personal, and Pro, Business, and Enterprise plans. Observability is available for Credit-based plans and Enterprise plans. If you have a Legacy pricing plan, you can get a sneak peek at your observability data by checking out the widget from your Project Overview. Credit-based planTime filter availableFreePast 24 hoursPersonalPast 24 hoursProPast 7 days Enterprise planTime filter availableAny Enterprise planPast 30 days Note that if you have a Credit-based plan or an Enterprise plan, then Function Metrics will no longer be available to you as it is replaced by Observability. On plans that do not have Observability, Function Metrics continues to be available. If you’re interested in switching to a Credit-based plan or upgrading to a higher Credit-based plan, check out Change your pricing plan. Quick insightsSection titled “Quick insights” Use the Quick actions menu to quickly check for insights with a set of pre-selected filters across traffic, bandwidth, and compute. Traffic insightsSection titled “Traffic insights” Selected filters forDescriptionBrowser traffic onlyExclude common bots and automated toolsTop URLsWhich URLs are getting the most requests?Top client typesWhich client types are making the most requests?Top URLs not foundURLs with the most 404sTop URLs with errorsWhich URLs return the most errors?Top AI searchesPages crawled on-demand to answer user prompts Bandwidth insightsSection titled “Bandwidth insights” Selected filters forDescriptionBandwidth by URLWhich routes use the most bandwidth?Bandwidth by client typeWhich client types are using your bandwidth?Bandwidth by content typeWhich types of content are using your bandwidth? Compute insightsSection titled “Compute insights” Selected filters forDescriptionTop functionsWhich Netlify Functions are invoked the most?Slowest URLsWhich URLs are the slowest to respond?Top client types invoking functionsWhich client types invoke the most functions? Blocked requestsSection titled “Blocked requests” You can also learn more about the types of requests that are blocked by Netlify’s security features. Netlify’s Observability will not show you certain kinds of blocked requests, such as requests blocked by a CDN, proxy service, or Netlify’s automated DDoS protection. Learn more about blocked requests. Understand request countsSection titled “Understand request counts” Netlify Observability shows raw server-side HTTP request data. This may differ from metrics in other tools you use, which measure different aspects of your site's traffic. Differences from web analytics toolsSection titled “Differences from web analytics tools” Web analytics tools like Google Analytics measure traffic differently than our observability tools filter out bot traffic to show only human visitors. Our dashboard shows all requests, including bots. Page views vs. tools count single-page app (SPA) navigation as separate page views, even though they don't trigger new requests. Our dashboard only counts actual HTTP requests. Client-side vs. server-side tools run in the browser and can't see failed requests (404s) or redirects (301s, 302s) because the page never fully loads. Our dashboard tracks all requests at the server level, including errors and redirects. Visitors and tools use heuristics and cookies to estimate unique visitors and sessions. Our dashboard doesn't track these metrics—it shows raw HTTP request data and how our platform handles them. Impact of CDN or proxy servicesSection titled “Impact of CDN or proxy services” If you use a CDN or proxy service (like Cloudflare or Akamai) in front of your site, blocked or cached traffic may never reach our platform. The dashboard only measures requests that actually arrive at our servers. Search & filter optionsSection titled “Search & filter options” The following search and filter options allow you to create custom views of your project's observability data. Search optionsSection titled “Search options” Use Observability's search field to filter web requests by the request URL (including domain or query params) The user-agent string Client IP address (if the request went through a trusted proxy—the IP is what the proxy reports as \"forwarded for\") The request ID—each response from Netlify includes a header with a unique ID for that request Any text in function and edge function logs Filter optionsSection titled “Filter options” Observability filters allow you to group requests by different criteria to gain insights into your project's behavior. FiltersDescriptionStatus codesWeb standards-defined filter to group requests by HTTP status codes.Status groupCustom Netlify filter to group status codes. Instead of using the HTTP standard status classes (such as informational for 1xx, successful for 2xx, redirect for 3xx, client error for 4xx, and server error for 5xx), Netlify groups status codes into 5 , Redirect, Not Found, Client Error, and Server Error.HTTP methodWeb standards-defined filter to group requests by HTTP method, including GET, POST, PUT, DELETE, etc.Content typeWeb standards-defined filter to group requests by content type, including text/html, application/json, application/xml, etc.Cache statusCustom Netlify filter to group requests by cache status based on Netlify caching.User agent categoryCustom Netlify filter to group requests by user agent category, including bot, crawler, etc.Function nameCustom Netlify filter to group requests by function name for functions in netlify/functions.Edge function nameCustom Netlify filter to group requests by edge function name for edge functions in netlify/edge-functions.Block reasonCustom Netlify filter to group requests by the reason Netlify blocked a request, including rate limited, firewall traffic rules, web application firewall (WAF), password protection, and more. Observability vs. Log drainsSection titled “Observability vs. Log drains” FeatureObservabilityLog DrainsPrimary purposeReal-time debugging and performance analysisLong-term log retention and cross-platform aggregationInterfaceNetlify-native dashboardThird-party tools (Datadog, Splunk, etc.)ConfigurationEnabled by defaultRequires endpoint setup and authenticationData availableRequest-level traffic, cache status, regional latency, function executionRaw log , functions, edge functions, deploys, WAF rulesData retentionShort-term (varies by plan)Determined by external providerCorrelationBuilt-in request tracing and timeline viewDepends on external tool capabilitiesCost modelIncluded with Netlify planExternal tool pricing appliesCross-project analysisSingle-site view onlyAggregate multiple sites and servicesAlertingNot availableConfigure in external toolCompliance & auditLimited retentionSupports compliance workflows and SIEM integration Limits and other restrictionsSection titled “Limits and other restrictions” If you need alerting, long-term data retention, or custom dashboards, we recommend setting up a log drain to connect to a third-party monitoring tool with longer log retention. Learn more about log drain support. Other restrictionsSection titled “Other restrictions” Requests blocked by automated mechanisms that the user cannot control or configure in any way (and that are not visible elsewhere to users) do not appear in Observability. Requests blocked by Advanced Web Security (by WAF, Firewall Traffic Rules, or Rate Limiting rules defined by the customer) do appear. Calls to AI Gateway from Agent Runners are not shown in Observability Credits usage is not shown in Observability but you can find your credit usage in your billing dashboard. Monitoring your project in the Observability dashboard does not add any new usage charges. Learn more in Monitor usage for credit-based plans. There is currently no programmatic access to observability data. Granular caching information Debugging specific issues at depth, e.g., Incremental Static Regeneration (ISR) behavior with Next.js, often requires granular caching information not shown today. Observability is not available for Legacy pricing plans and replaces Function Metrics. Last 9, 2026 PreviousOverviewNextContent type Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.196Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":3179}}43{"id":"doc-create_deploys_netlify_docs-15f15506","source":"documentation","title":"Create deploys | Netlify Docs","url":"https://docs.netlify.com/deploy/create-deploys","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview Deploy with AI agents Deploy with Git Netlify CLI Drag and drop API endpoints Deploy to Netlify button Markup File-based template configuration URL-based template configuration Define additional instructions Build hooks Zapier integrations n8n integrations On this page Overview Deploy with AI agents Deploy with Git Netlify CLI Drag and drop API endpoints Deploy to Netlify button Markup File-based template configuration URL-based template configuration Define additional instructions Build hooks Zapier integrations n8n integrations For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Create deploys Copy page View as Markdown Copy as Markdown View as Markdown This page covers features and tools you can use to create deploys with or without continuous deployment. Note When you create a deploy manually without continuous deployment, Netlify does not run a build command. New projects can be private by default On Credit-based plans, if your team has private by default enabled, new projects start private no matter how you create them. Only your team can view a project until you make it public. Learn more about project visibility. Deploy with AI agentsSection titled “Deploy with AI agents” You can build with an AI agent directly from the Netlify dashboard using Agent Runners with Claude Code, OpenAI Codex, and Google Gemini as your agent. Every agent run that makes a file change automatically generates a Deploy Preview, so you can review changes before they go live. The Deploy Preview URL for previews generated by an agent run is https://agent-69a6140cc823ebba94b8ef32--my-site.netlify.app. You can also start an agent run directly from a deploy details page. Learn more about Agent Runners. Deploy with GitSection titled “Deploy with Git” Continuous deployment works by connecting a Git repository to a Netlify site and keeping the two in sync. This is done using the Git provider’s OAuth2 authentication or the Netlify GitHub App. After you set up Git provider permissions and link a repository, Netlify will run your build command and deploy the result whenever you push to your Git repo. The benefits of Netlify’s continuous deployment deploying without committing and pushing first Easy collaboration through pull/merge requests Fix a typo through your Git provider’s web UI from your mobile Edit content without code by using a CMS Netlify CLISection titled “Netlify CLI” You can use the CLI to create a new project from a prompt with netlify create, which generates, deploys, and downloads a project based on a natural language description. You can also use the CLI to set up continuous deployment for a Git repository. Once continuous deployment is configured, you can update your Production site, staging site, or Deploy Preview with git push. You can also use the CLI to create manual deploys without continuous deployment. For example, you can deploy directly to your production site from the command line with netlify deploy --prod. To deploy without logging in or creating a Netlify account, use netlify deploy --allow-anonymous. This creates a temporary project with a live URL that you can claim within one hour. When you claim it, the project adopts the default project visibility set by the Team Owner. Drag and dropSection titled “Drag and drop” Tip For easiest deployment and management, make sure you're already logged in to the team where you want your site project to be on Netlify. You can create a new site by dragging a project folder containing your site files (like .html files) to Netlify Drop. You can also find a drag and drop section at the bottom of your team's Projects page. You don’t have to build your project first. As long as you’re logged in, you can drop a web project that still needs a build step, and Netlify will detect your framework and run the build for you before publishing. Dropping a pre-built output folder also works. If you drop a project without being logged in, Netlify publishes the files as-is. If you need to update a site that you created using drag and drop, update and rebuild your project locally. Then, drag the project’s updated output folder to the deploy dropzone at the bottom of the site’s Deploys page. This will start a new site deploy with the updated files. You can also use this functionality to manually update any site that is not connected to a Git repository. API endpointsSection titled “API endpoints” You can use the API to create deploys manually using a file digest or a ZIP file. Deploy to Netlify buttonSection titled “Deploy to Netlify button” The Deploy to Netlify button helps users deploy new sites from templates with one single click. Web developers can use the button to give their users a one-click way to deploy those applications on Netlify. It’s designed to be used in README files, documentation sites, and probably anything that renders as an HTML file. You can find examples of the button in use in the READMEs on our templates. The template code must be available in a public repository stored on GitHub.com or GitLab.com. MarkupSection titled “Markup” You can use any markup language that renders as HTML to display the button. There are two very important URLs that you’ll SVG URL for the ://www.netlify.com/img/deploy/button.svg. The URL the button takes users ://app.netlify.com/start/deploy. This link requires the public Git repository as a parameter, for ://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit You can make the button clone a whole repository or just a portion of a repository. Both are good options for monorepos but you may need to set a base directory if the button clones the whole repository. Here is an example of the full Markdown or HTML code for a Deploy to Netlify button that deploys the Netlify StatusKit HTML Markdown[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit) HTML<a href=\"https://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit\"> <img src=\"https://www.netlify.com/img/deploy/button.svg\" alt=\"Deploy to Netlify\"></a> If your repository uses extensions built with Netlify's SDK, you can add the URL parameter fullConfiguration=true to make users go through an extra step where they'll be able to install required extensions, choose a site name, and configure their new repository before deploying the site. File-based template configurationSection titled “File-based template configuration” You can control some aspects of template configuration directly in the template’s Git repository. Create a netlify.toml file in the root of the repository, if you don’t have it already. Netlify will read the information from there. If your Deploy to Netlify button clones just a subdirectory of the repository, create the netlify.toml file in that subdirectory so that the file ends up in the root of the cloned repository. This file can also be used to set options for continuous deployment, you can read more about it in the file-based configuration documentation. Within the [template] section of the netlify.toml, you can set three list of incoming hooks for the users site. This is very useful if you want to allow a third party service to control when to deploy the site. This is what headless CMS services like Contentful and DatoCMS do. Users can give those providers the address Netlify generates for their specific incoming requests. [template] incoming-hooks = [\"Contentful\"] A list of required environment variables. This is one way to let users set specific configuration options upon deployment. It also enables customization without having to change the code of the base template. If you don’t want to use a netlify.toml file, you can instead use the URL hash to require or even pre-fill environment variables. [template.environment] SECRET_TOKEN = \"change me for your secret token\" CUSTOM_LOGO = \"set the url to your custom logo here\" The placeholder strings you set in netlify.toml are used as labels in the UI to provide guidance to users deploying your template. A list of required extension slugs. Extensions expand the capabilities of a site deployed on Netlify. This is useful if you wish to specify your template depends on specific Netlify extensions to work as expected. If you define required-extensions, users will be prompted to install the extensions, to allow them to get up and running faster. This can be combined with the optional parameter fullConfiguration=true if you wish to force users to install the extension(s) prior to the first deploy of their site. [template] required-extensions = [\"supabase\"] Note that you can’t do the following in this [template] values for environment variables. To pre-fill environment variable values, use URL-based template configuration. Set a base directory for the Deploy to Netlify button. To set a base directory for sites deployed with the button, use the base query parameter instead. URL-based template configurationSection titled “URL-based template configuration” You can control the following aspects of how the template repo is cloned and how the resulting site is configured by passing values in the Deploy to Netlify or set environment variables set a base directory clone a subdirectory deploy a specific branch Require or set environment variablesSection titled “Require or set environment variables” You can require or set environment variables for the site template in the hash of the template’s Deploy to Netlify URL with key/value pairs. Values can be null. https://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/sweetkittentemplate#SECRET_TOKEN=specialuniquevalue&CUSTOM_LOGO= Passing environment variable values in the hash ensures that they’re processed on the client side only. You can create custom Deploy to Netlify buttons for your users with tokens and other secure data, and they won’t appear in Netlify logs. Set a base directory for monoreposSection titled “Set a base directory for monorepos” If your Deploy to Netlify button clones a whole monorepo rather than a single subdirectory, you can use the base query parameter to set an alternate directory as the base directory for deployments. The format is &base=your-base-directory. Note that while Netlify uses the specified base directory for the build and deploy, the entire repo is still cloned to the user’s Git provider account. For example, here’s a URL with a base directory of ://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/sweetkittentemplate&base=blog When someone uses this Deploy to Netlify button, Netlify clones the whole sweetkittentemplate repository to the user’s Git provider account and then builds and deploys from the blog subdirectory. Note the following configuration to set incoming hooks and environment variables can only be used at root level and can’t be used for sites with a different base directory. When you set an alternate base directory, the netlify.toml in the base directory will take precedence over the root level configuration for that site’s builds. Clone a subdirectory of a repoSection titled “Clone a subdirectory of a repo” To make a Deploy to Netlify button clone just a part of a repo, use the create_from_path query parameter to specify a subdirectory to clone. The format is &create_from_path=your-subdirectory. For example, here’s a URL with a creation path of examples/hello: https://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/demos&create_from_path=examples/hello When someone uses this Deploy to Netlify button, Netlify clones just the subdirectory examples/hello from the demos repo to the user’s Git provider account and then builds and deploys from the root of the cloned repository. Deploy a specific branchSection titled “Deploy a specific branch” To make a Deploy to Netlify button deploy a branch other than the default branch, use the branch query parameter. The format is &branch=your-branch. For example, here’s a URL that will deploy the beta-feature ://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/app&branch=beta-feature When someone uses this Deploy to Netlify button, Netlify sets the new site’s production branch to beta-feature and then builds and deploys from that branch of the cloned repository. Define additional instructionsSection titled “Define additional instructions” You can define additional configuration instructions in the USAGE.md file, which should be saved in the root of your repository. This can be useful to include guidance on setting up any required third-party service accounts (such as databases, content sources, analytics platforms, or APIs) and provisioning those services. Be sure to mention any necessary extensions or tools that need to be pre-installed to ensure a smooth setup. When a USAGE.md file is included in the root of the repository, Netlify's app will prompt users to read the additional instructions included in it during the fullConfiguration flow and, after the site has been deployed, in the site overview. Build hooksSection titled “Build hooks” Build hooks give you unique URLs you can use to trigger new builds and deploys. Zapier integrationsSection titled “Zapier integrations” Netlify is available on Zapier, where you can connect Netlify with over 1,000 other applications. You can use Zapier “Zaps” to start a new deploy of your site in response to a trigger from another service. You can find out more on our blog, or use one of the templates below to get deploys of Netlify sites daily Netlify + Schedule by Zapier Use this Zap Start Netlify deploys when you send new Tweets Netlify + Twitter Use this Zap Start Netlify site deploys with the push of a Flic button Flic + Netlify Use this Zap n8n integrationsSection titled “n8n integrations” Netlify is available on n8n, an open source tool that allows you to connect Netlify with other applications. By using one of n8n’s Netlify nodes, you can create your own automated workflow. To get started, you can use the Netlify node, Netlify Trigger node, or you can use the existing workflow site when new content gets added Netlify node Use workflow Last 28, 2026 PreviousDeploy PreviewsNextManage deploys Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nhttps://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit\n```\n\nExample:\n```text\n[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-statuskit)\n```\n\nExample:\n```text\n[template]  incoming-hooks = [\"Contentful\"]\n```\n\nExample:\n```text\n[template.environment]  SECRET_TOKEN = \"change me for your secret token\"  CUSTOM_LOGO = \"set the url to your custom logo here\"\n```\n\nExample:\n```text\n[template]    required-extensions = [\"supabase\"]\n```\n\nExample:\n```text\nhttps://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/sweetkittentemplate#SECRET_TOKEN=specialuniquevalue&CUSTOM_LOGO=\n```\n\nExample:\n```text\nhttps://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/sweetkittentemplate&base=blog\n```\n\nExample:\n```text\nhttps://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/demos&create_from_path=examples/hello\n```\n\nExample:\n```text\nhttps://app.netlify.com/start/deploy?repository=https://github.com/myworkspace/app&branch=beta-feature\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.198Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":9,"totalLines":48,"estimatedTokens":4331}}44{"id":"doc-split_testing_netlify_docs-aa2eea88","source":"documentation","title":"Split Testing | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/split-testing/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Requirements and limitations Run a branch-based test Set up client-side analytics tracking Expose branch information in your site Send to Google Analytics Send to Segment Use snippet injection for more flexibility On this page Overview Requirements and limitations Run a branch-based test Set up client-side analytics tracking Expose branch information in your site Send to Google Analytics Send to Segment Use snippet injection for more flexibility For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending If you use React, you can access the same variable from the process environment at build You can read more about this environment variable and many others in our environment variables documentation. Send to Google AnalyticsSection titled “Send to Google Analytics” Google Analytics supports dimensional data that can be associated to events. You can use this feature to send the split test information that you compiled in the previous build. For example, if you're using Google Analytics in a site built with Hugo, you can use this template to track the branch a visitor is seeing: <!-- install Google Analytics' JS tracker before using this code --><!-- https://developers.google.com/analytics/devguides/collection/analyticsjs/ --><script> ga('send', 'pageview', { 'Branch': '{{ getenv \"BRANCH\" }}' });</script> Send to SegmentSection titled “Send to Segment” Segment is a platform that allows you to multiplex tracking information and send it to different services at the same time. Their JavaScript library also supports dimensional data that you can use to send the split test information. To follow Google Analytics' example, you can track the testing branch every time someone visits your site with a snippet like this one: <!-- install Segment's JS tracker before using this code --><!-- https://segment.com/docs/sources/website/analytics.js/quickstart/#step-1-copy-the-snippet --><script> analytics.track('pageview', { 'Branch': '{{ getenv \"BRANCH\" }}' });</script> Use snippet injection for more flexibilitySection titled “Use snippet injection for more flexibility” You might want those analytics scripts only in your production environment. After all, you don't want to send tracking information when you're developing your site. You can use Netlify's snippet injection to add those scripts right when we deploy your site. Snippet injection uses Liquid templates to expose environment variables to your snippets. This gives you the ability to inject the testing branch value without having to worry about which build tool you're using. To inject analytics scripts using Netlify's snippet injection, go to Project configuration > Build & deploy > Post processing, find the Snippet injection section, and select Add Snippet. Following the previous Google Analytics example, you can inject this template as a snippet: <!-- install Google Analytics' JS tracker before using this code --><!-- https://developers.google.com/analytics/devguides/collection/analyticsjs/ --><script> ga('send', 'pageview', { 'Branch': '{{ BRANCH }}' });</script> In that same way, you can inject this template as a snippet to use Segment: <!-- install Segment's JS tracker before using this code --><!-- https://segment.com/docs/sources/website/analytics.js/quickstart/#step-1-copy-the-snippet--><script> analytics.track('pageview', { 'Branch': '{{ BRANCH }}' });</script> Last 18, 2026 PreviousLogsNextFunction metrics Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n{{ getenv \"BRANCH\" }}\n```\n\nExample:\n```text\nprocess.env.BRANCH\n```\n\nExample:\n```text\n<!-- install Google Analytics' JS tracker before using this code --><!-- https://developers.google.com/analytics/devguides/collection/analyticsjs/ --><script>  ga('send', 'pageview', {    'Branch':  '{{ getenv \"BRANCH\" }}'  });</script>\n```\n\nExample:\n```text\n<!-- install Segment's JS tracker before using this code --><!-- https://segment.com/docs/sources/website/analytics.js/quickstart/#step-1-copy-the-snippet --><script>  analytics.track('pageview', {    'Branch': '{{ getenv \"BRANCH\" }}'  });</script>\n```\n\nExample:\n```text\n<!-- install Google Analytics' JS tracker before using this code --><!-- https://developers.google.com/analytics/devguides/collection/analyticsjs/ --><script>  ga('send', 'pageview', {    'Branch':  '{{ BRANCH }}'  });</script>\n```\n\nExample:\n```text\n<!-- install Segment's JS tracker before using this code --><!-- https://segment.com/docs/sources/website/analytics.js/quickstart/#step-1-copy-the-snippet--><script>  analytics.track('pageview', {    'Branch': '{{ BRANCH }}'  });</script>\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.201Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":6,"totalLines":33,"estimatedTokens":1598}}45{"id":"doc-rewrites_and_proxies_netlify_docs-3eda5a54","source":"documentation","title":"Rewrites and proxies | Netlify Docs","url":"https://docs.netlify.com/manage/routing/redirects/rewrites-proxies","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Static Routing & Redirects Static Routing & Redirects Overview Custom headers Redirects Overview Redirect options Rewrites proxies Test redirects locally with Netlify CLI On this page Overview Limitations History pushState and single-page apps Shadowing Proxy to another service Custom headers in proxy redirects Signed proxy redirects Proxy to another Netlify site On this page Overview Limitations History pushState and single-page apps Shadowing Proxy to another service Custom headers in proxy redirects Signed proxy redirects Proxy to another Netlify site For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending Custom headers apply to the request, not the response If you are proxying content to your site, custom headers will not be applied to that content. Signed proxy redirectsSection titled “Signed proxy redirects” You can use a JSON Web Signature (JWS) to sign all proxy requests to an external URL. To enable JWS on your requests, Netlify requires a secret token. You can set the token in your site’s environment variables and indicate the variable name as the signed value in the redirect rule. Note that if you have the option to set specific scopes for your environment variables, the scope must include Runtime to be available for signed proxy redirects. Netlify will inject the environment variable value automatically, so you don’t need to take extra steps to substitute the variable value in the configuration file. Once proxy redirects are added, Netlify will send the JWS as an HMAC HS256 encoded x-nf-sign header to another, non-Netlify website with every proxied request. Signed proxy redirects must be specified in the Netlify configuration file. [[redirects]] from = \"/search\" to = \"https://api.mysearch.com\" status = 200 force = true signed = \"API_SIGNATURE_TOKEN_PLACEHOLDER\" The JSON document we sign with this JWS header has this format: { \"deploy_context\": \"production\", \"exp\": 1623876755, \"iss\": \"netlify\", \"netlify_id\": \"1be0f471-6532-45ff-b1b1-f9c66ea24dc1\", \"site_url\": \"https://mysitename.netlify.app\"} Signed proxy redirects for external sites only When proxying from one Netlify application to another, using JWS to sign requests isn’t supported. Proxy to another Netlify siteSection titled “Proxy to another Netlify site” With internal rewrites, you can proxy from one Netlify site to another. If you want to proxy to another Netlify site, we recommend using the site’s .netlify.app subdomain instead of the custom domain in your rewrite rule: /netlify-site/* https://my-other-site.netlify.app/:splat 200 Last 14, 2025 PreviousRedirect optionsNextTest redirects locally with Netlify CLI Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n/*  /index.html  200\n```\n\nExample:\n```text\n[[redirects]]  from = \"/*\"  to = \"/index.html\"  status = 200\n```\n\nExample:\n```text\n/app/*  /app/index.html  200!\n```\n\nExample:\n```text\n/best-pets/dogs  /best-pets/cats.html 200!\n```\n\nExample:\n```text\n/api/*  https://api.example.com/:splat  200\n```\n\nExample:\n```text\n[[redirects]]  from = \"/search\"  to = \"https://api.mysearch.com\"  status = 200  force = true  headers = {X-From = \"Netlify\"}\n```\n\nExample:\n```text\n[[redirects]]  from = \"/search\"  to = \"https://api.mysearch.com\"  status = 200  force = true  signed = \"API_SIGNATURE_TOKEN_PLACEHOLDER\"\n```\n\nExample:\n```text\n{  \"deploy_context\": \"production\",  \"exp\": 1623876755,  \"iss\": \"netlify\",  \"netlify_id\": \"1be0f471-6532-45ff-b1b1-f9c66ea24dc1\",  \"site_url\": \"https://mysitename.netlify.app\"}\n```\n\nExample:\n```text\n/netlify-site/*  https://my-other-site.netlify.app/:splat  200\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.202Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":9,"totalLines":48,"estimatedTokens":1245}}46{"id":"doc-spam_filters_netlify_docs-8d363ea3","source":"documentation","title":"Spam filters | Netlify Docs","url":"https://docs.netlify.com/manage/forms/spam-filters","text":"Example:\n```text\n<form  name=\"contact\"  method=\"POST\"  netlify-honeypot=\"bot-field\"  data-netlify=\"true\">  <p class=\"hidden\">    <label>      Don’t fill this out if you’re human: <input name=\"bot-field\" type=\"text\" />    </label>  </p>  <p>    <label>      Email: <input type=\"text\" name=\"email\" />    </label>  </p>  <p>    <label>      Message: <textarea name=\"message\"></textarea>    </label>  </p>  <p>    <button type=\"submit\">Send</button>  </p></form>\n```\n\nExample:\n```text\n<form  name=\"contact\"  method=\"POST\"  data-netlify-recaptcha=\"true\"  data-netlify=\"true\">  <p>    <label>      Email: <input type=\"text\" name=\"name\" />    </label>  </p>  <p>    <label>      Message: <textarea name=\"message\"></textarea>    </label>  </p>  <div data-netlify-recaptcha=\"true\"></div>  <p>    <button type=\"submit\">Send</button>  </p></form>\n```\n\nExample:\n```text\n<form  name=\"contact\"  method=\"POST\"  data-netlify-recaptcha=\"true\"  data-netlify=\"true\">  <!-- input fields and custom reCAPTCHA snippet --></form>\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.203Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":3,"totalLines":16,"estimatedTokens":256}}47{"id":"doc-manage_deploys_netlify_docs-757b3dab","source":"documentation","title":"Manage deploys | Netlify Docs","url":"https://docs.netlify.com/deploy/manage-deploys/manage-deploys-overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview Find a deploy Rollbacks Locked deploys Lock a published deploy Unlock a locked deploy Event notifications Cancel a deploy Skip a deploy Retry deploy from latest branch commit Automated cleanup for failed and canceled deploys Automatic deploy deletion Change the deploy retention limit Manual deploy deletion through the Netlify UI Deploy deletion requirements Deploy deletion considerations Delete a deploy through the UI Download a deploy Download an individual file Download all deployed files Configure your deploy environment Failed deploy troubleshooting tips On this page Overview Find a deploy Rollbacks Locked deploys Lock a published deploy Unlock a locked deploy Event notifications Cancel a deploy Skip a deploy Retry deploy from latest branch commit Automated cleanup for failed and canceled deploys Automatic deploy deletion Change the deploy retention limit Manual deploy deletion through the Netlify UI Deploy deletion requirements Deploy deletion considerations Delete a deploy through the UI Download a deploy Download an individual file Download all deployed files Configure your deploy environment Failed deploy troubleshooting tips For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Manage Deploys / Manage deploys Copy page View as Markdown Copy as Markdown View as Markdown Netlify versions all deploys. From the Deploys tab for your site in the Netlify UI, you can browse any deploy you’ve ever made and preview it from a unique URL. Find a deploySection titled “Find a deploy” As a Developer or Team Owner, you can find deploys using the search or filter options available on the Deploys tab. Use the search field above the deploy list to search by deploy ID or branch name. Where to find your deploy ID You can find the deploy ID in the first part of a deploy permalink. For is the deploy ID of 1234abcd12acde000111cdef--mysitename.netlify.app. You can also filter deploys for your site based on these frame Filter deploys triggered in the Last hour, Last day, Last 7 days, or filter by a Custom date and time range. Deploy context Deploy status Successful Unsuccessful (includes Failed, Canceled, or Skipped deploys) Enqueued for deploys that are in the queue awaiting deployment Pending review, Accepted, or Rejected for deploys triggered by an unrecognized author. Learn more about deploy requests and permissions. RollbacksSection titled “Rollbacks” If you need to roll back, you can publish one of the previous deploys listed in the UI as the live version of your site in production. Use the Publish Deploy button on the detail page of any successful deploy. This doesn’t trigger a new deploy but instead publishes a previous atomic deploy that is still available to you. Rollbacks are instantaneous. Note If your Netlify site is connected to a Git repository and has auto publishing turned on, any new Git-triggered production deploys will overwrite the previously rolled back version. Locked deploysSection titled “Locked deploys” Locked deploys give you the ability of pinning a site to the latest published deploy for the time being. New deploys won’t be published to the main site, although Netlify will still build them and they will be ready for whenever you want to publish them. Lock a published deploySection titled “Lock a published deploy” You can lock a deploy by disabling auto publishing. To disable auto publishing, navigate to your site’s Deploys list and select Lock to stop auto publishing. Unlock a locked deploySection titled “Unlock a locked deploy” After a deploy has been locked, you can use Unlock to start auto publishing to unlock it from the same Deploys list. Event notificationsSection titled “Event notifications” This feature is available on all Pro and Enterprise plans. You can get notifications about locked deploys by email, outgoing webhook, or Slack. Netlify can notify you when a deploy is either locked or unlocked. You can configure these notifications from the notifications section in Project configuration > Notifications > Deploy notifications. Visit the deploy notifications documentation to learn more. Cancel a deploySection titled “Cancel a deploy” Sometimes, you may want to cancel a deploy after it has started. To do this, go to the detail page of the deploy in progress and select Cancel deploy. You’ll then be prompted to confirm the canceling action. Select Yes, cancel deploy to confirm. If you later want to restart the deploy, you can deploy from the latest branch commit. Skip a deploySection titled “Skip a deploy” Sometimes, you may want to push commits to a branch without triggering a deploy on Netlify. To avoid generating a Deploy Preview for a pull/merge request, add [skip ci] or [skip netlify] to the title of the pull/merge request. To avoid generating a branch or production deploy for a commit pushed directly to a branch, add [skip ci] or [skip netlify] anywhere in the Git commit message. To avoid generating a branch or production deploy for multiple commits pushed together, add [skip ci] or [skip netlify] to the most recent commit, and it will apply to all other commits in the push. The next commit pushed without one of those messages will trigger a new branch deploy or production deploy, including all changes from the skipped commits as well. To generate a Deploy Preview from a pull/merge request, remove [skip ci] or [skip netlify] from the title and push a new commit. To trigger a deploy at will on your production branch, go to your site’s Deploys page and select Trigger deploy at the top of the deploy list. To avoid triggering automated deploys of any kind, you can stop builds for the entire site. If you would like to continue building your deploys but don’t want them published to your main URL, you can stop auto publishing. Retry deploy from latest branch commitSection titled “Retry deploy from latest branch commit” If your build fails or you run into other issues, you can retry your deploy with the latest branch commit. You can also retry your deploy with a cleared cache. When you retry a deploy, the build triggers from the HEAD of your branch. If the HEAD of the branch differs from the original deploy SHA, Netlify still builds from the HEAD of the branch. Automated cleanup for failed and canceled deploysSection titled “Automated cleanup for failed and canceled deploys” By default, Netlify automatically deletes failed and canceled deploys older than 30 days (or 90 days on paid plans) as a part of deploy cleanup and maintenance. Once deleted, you can expect deploys and their associated builds to disappear from the Netlify UI and API queries. Automatic deploy deletionSection titled “Automatic deploy deletion” By default, Netlify will delete deploys after 30 days (or 90 days on paid plans). This includes deploys triggered by either source control changes, the Netlify UI or CLI, manual uploads, or third-party integrations. Netlify will not automatically deploy currently published to your site (also called the published deploy. The most recent successful production deploy. The most recent successful branch deploy for a given branch. Owners and Developers on an Enterprise plan can adjust the default retention period for up to 365 days. Once a deploy is automatically deleted, you can expect the deploy and its associated builds to disappear from the Netlify UI and API queries. If you visit the deploy permalink for an automatically deleted deploy, a generic 404 page is returned. The team audit log updates with Deploy retention has changed when a Developer or Team Owner changes the deploy retention limit for a site. Change the deploy retention limitSection titled “Change the deploy retention limit” This feature is available on Enterprise plans. To adjust a site’s default deploy retention limit, you must be a Team Owner or Developer. After you change the deploy retention limit for a site and save, all changes take effect instantly. For example, if you set your site’s deploy retention to 30 days and confirm this update, all eligible deploys older than 30 days will delete with no additional warning. Netlify runs deploy deletions daily. As a Developer or Team Owner, go to Project configuration > Build & Deploy > Automatic Deletion. Select Configure, and use the drop-down to select a new deploy retention limit. Confirm with Save setting. Manual deploy deletion through the Netlify UISection titled “Manual deploy deletion through the Netlify UI” You may want to delete a deploy to remove sensitive data, as a part of your team’s security best practices, or to clean up your Netlify deploys list. Deploy deletions are logged in the team audit log as Deploy deleted actions. Deploy deletion requirementsSection titled “Deploy deletion requirements” To delete a deploy manually in the Netlify UI, you must be a Developer or Team Owner. You cannot delete the deploy that was most recently published to a site’s main URL. You also cannot delete a deploy that is still in progress. You must either cancel the deploy or wait until the deploy is finished before you can delete it. Deploy deletion considerationsSection titled “Deploy deletion considerations” Be aware that deleting a deploy is permanent and does not reduce costs for your Netlify team or help you preserve build minutes. More details on this are below. Once a deploy is deleted, you cannot access any artifacts associated with the deploy, including URLs, deploy logs, or functions unique to the deploy. The deploy permalink for the deleted deploy will no longer work and will show a generic 404 error message instead. After you delete a deploy, you may encounter the deploy context URL may no longer work. If you delete a deploy and there are no other deploys in the context, the deploy context URL will return a generic 404 message. Your deploy context URL may show changes from a different deploy. If you delete the most recent deploy to a deploy context, then that URL will point to the next most recent deploy in the same context. Split testing results may be disrupted. If the deleted deploy is from a branch with split testing configured, your split testing results may be disrupted. After a deploy is deleted, the deploy’s associated build is removed from the team’s builds list on the main Builds page. However, the build data from deleted deploys is still included in the aggregated build minute counts and insights analytics to help you make an accurate assessment of your team’s build minutes usage. Delete a deploy through the UISection titled “Delete a deploy through the UI” As a Developer or Team Owner, you can delete a single deploy manually through the UI. To find the deploy you want to delete, go to the Deploys page for your site and select the deploy from the deploy list or use the deploy search. From the deploy details successful deploys, select Options > Delete deploy. For failed or canceled deploys, select Delete deploy. If the Delete deploy option is not available, make sure the deploy meets the requirements for deploy deletion. To confirm, review the deploy deletion warning, then select Delete. Download a deploySection titled “Download a deploy” From the detail page of any successful deploy, including Netlify Drop deploys, you can download individual files or an entire copy of your site. Download an individual fileSection titled “Download an individual file” On the detail page for a successful deploy, scroll down to Deploy file browser. Search for or browse to the file you want to inspect, then select Download. Download all deployed filesSection titled “Download all deployed files” To generate a ZIP file containing all of your deployed the deploy detail page header for a successful deploy, select Download. When the ZIP finishes generating, select Download ready to download the deploy. If you’re looking to update a site you deployed manually through the UI, you can download and edit the deployed files locally, and then use the deploy dropzone to deploy the update. Configure your deploy environmentSection titled “Configure your deploy environment” You can use environment variables to control the environment your site gets deployed to. Environment variables created using the Netlify UI, CLI, or API are available to Builds, Functions, Runtime and Post processing scopes. This means that you can use them in your serverless functions and edge functions at execution time, snippet injection during post processing, and more. Note that environment variables created in a netlify.toml are not available to the deploy environment. To learn more about how to set and use environment variables review our environment variables docs. For more information on using environment variables with functions during runtime specifically, review environment variables with serverless functions and edge functions. Failed deploy troubleshooting tipsSection titled “Failed deploy troubleshooting tips” To help you fix failed deploys, Netlify offers AI capabilities that diagnose and suggest solutions for deploy failures and build errors so you can get back to shipping code. Learn more about Netlify’s AI capabilities to give solutions for failed deploys. For more help troubleshooting failed builds, check out our Build troubleshooting tips. If your deploy returns an error, you can also clear your cache and retry the deploy in the Netlify UI or trigger a new deploy. Last 16, 2026 PreviousCreate deploysNextProtect deploys Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.204Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":3823}}48{"id":"doc-deploy_previews_netlify_docs-aba065af","source":"documentation","title":"Deploy Previews | Netlify Docs","url":"https://docs.netlify.com/deploy/deploy-types/deploy-previews","text":"Example:\n```text\n@netlify /start/choose-your-path\n```\n\nExample:\n```text\n<!--Set an entry path if your PR has a primary page for review.    Add a relative path next to `@netlify` below.-->\n@netlify /\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.205Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":2,"totalLines":12,"estimatedTokens":54}}49{"id":"doc-deploy_overview_netlify_docs-ec8b608c","source":"documentation","title":"Deploy overview | Netlify Docs","url":"https://docs.netlify.com/deploy/deploy-overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview How atomic deploys work Skew protection Deploy contexts Page loads Password Protection Deploy summary Deploy log Fix a failed deploy Share log content Branches and deploys Definitions Branch deploys versus Deploy Previews Collaboration tools for your site Production branch controls Branch deploy controls Deploy Preview controls Search engine indexing Deploy contexts Deploy protection Deploy permissions Working with deploy requests from non-team members Require manual review for deploy requests Enable auto-approval for deploy requests Match to an existing team member Add a non-team member as a Git Contributor Reject a pending deploy Sensitive variable policy Netlify deploys as previews Types of previews Preview URL visibility More site deploys resources On this page Overview How atomic deploys work Skew protection Deploy contexts Page loads Password Protection Deploy summary Deploy log Fix a failed deploy Share log content Branches and deploys Definitions Branch deploys versus Deploy Previews Collaboration tools for your site Production branch controls Branch deploy controls Deploy Preview controls Search engine indexing Deploy contexts Deploy protection Deploy permissions Working with deploy requests from non-team members Require manual review for deploy requests Enable auto-approval for deploy requests Match to an existing team member Add a non-team member as a Git Contributor Reject a pending deploy Sensitive variable policy Netlify deploys as previews Types of previews Preview URL visibility More site deploys resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Deploy overview Copy page View as Markdown Copy as Markdown View as Markdown Understand how deploys work, how to find information about deploys, and how to manage branches, deploy contexts, deploy permissions, and more. Quick help for deploying Looking for the best way to deploy your project and share it on the web? Try our new Deploy Navigator for personalized deployment recommendations based on your project type and requirements. How atomic deploys workSection titled “How atomic deploys work” Netlify enforces a strict concept of atomic deploys. If you’re used to uploading files with FTP, SSH, RSync or S3’s API, this is quite a different concept. Instead of pushing individual files to Netlify, you always create a new deploy. Netlify will compare the new deploy with your existing deploy and determine which files have changed and need to be uploaded. No changes go live on your site’s public URL before all changes have been uploaded. Once all the changes are ready, the new version of the site immediately goes live on the CDN. This means deploys are atomic, and your site is never in an inconsistent state while you’re uploading a new deploy. With FTP or S3 uploads, each file is pushed live one after the other, so you can easily get into situations where a new HTML page is live before the supporting assets (images, scripts, CSS) have been uploaded. And if your connection cuts out in the middle of an upload, your site could get stuck in a broken state for a long time. Atomic deploys guarantee that your site is always consistent. Files per directory limit While Netlify doesn't have a limit on the number of files per deploy, we do have a limit of 54,000 files per directory. If any directory within your publish directory has more than 54,000 files, your deploys will fail. Skew protectionSection titled “Skew protection” Availability and framework support Skew protection is available on all plans. It is currently supported for the following : Starting with version 5.15.0, Astro enables skew protection on Netlify by default when using Astro's Netlify Adapter. Next.js: Skew protection is an optional feature for Next.js. Earlier Next.js versions also require a minor configuration change. Learn how to enable it. Skew protection works with CLI deploys starting with Netlify CLI version 23.11.0 and above. To update the Netlify CLI version, run npm update -g netlify-cli or append npx to your CLI commands to always use the latest Netlify CLI version. Netlify offers skew protection to address version skew, which is a common challenge when deploying a new version of a production site while users are actively using it. The issue occurs when the server code is updated, but some clients continue to use an older version, typically due to stale browser caches or long-lived browser sessions that span multiple Netlify deploys. This drift can cause unpredictable behavior, especially if the server update includes breaking changes. For example, consider this user opens your app and loads the client-side code in their browser. You deploy a new version that removes a field from one of your API endpoints. The user continues using the app without reloading. The outdated client code sends a request that includes the now-removed field, resulting in an error. Skew protection fixes this by tracking which deploy each client should communicate with and routing requests to the appropriate server version. As long as a deploy is available, it will be served to clients that require it. If you are a framework maintainer, here is how to add support for skew protection to your framework. Deploy contextsSection titled “Deploy contexts” Skew protection is only available on the production context. When you make a request for a branch deploy or a Deploy Preview, Netlify will bypass skew protection and serve the latest deploy associated with those contexts. Deploy permalinks, where the URL itself already contains a reference to a specific deploy ID, also bypass skew protection. Page loadsSection titled “Page loads” If not implemented correctly, skew protection can lead to clients perpetually using old versions of your application. Imagine a scenario where your application sends a cookie that locks the client to deploy A. If we keep using that cookie for as long as it's persisted on the user's browser, they keep requesting deploy A even if your application is now on deploy Z. To mitigate this, Netlify discards skew protection signals whenever the browser navigates between pages. This is typically known as a hard navigation, in constrast with the concept of a soft navigation popularized by Single Page Applications. Netlify uses the following heuristics to detect a hard Sec-Fetch-Mode header is set to navigate, or The Sec-Fetch-Site header is present and is not set to same-origin. Password ProtectionSection titled “Password Protection” If your site has Password Protection enabled, skew protection works only if you're only protecting non-production deploys. This means that if you are protecting production deploys, then skew protection will not work. The skew protection token lets clients continue to request the specific deploy they were served, but they can't use that token to request other deploys. In practice, this means that any production deploy that was ever published can still be accessed by the clients who received it, but production deploys that were never published are still fully private. If your password protection settings target all deploys, skew protection will be ignored. This means that you can still fully gate access to your site at any point, regardless of whether any clients still hold any skew protection tokens that gave them access to a specific deploy. Deploy summarySection titled “Deploy summary” You can find a deploy summary on the detail page of any successful deploy, right above the deploy log. It allows you to quickly identify your deploy status and refer to the details in the log based on different types of information. This summary indicates how many files have been uploaded to our CDN. It also indicates the status of site headers and redirects included in the deploy. It also shows you how many functions and edge functions were deployed. When you have branch deploys enabled, the summary will inform you if the files to upload have already been uploaded by a previous deploy with the same commits. Netlify’s deployment infrastructure knows how to avoid uploading the same file twice, even between different deploys, so we get your changes ready without duplicating content. You can read more about how this works in this article about our deploying and routing infrastructure. If the summary continually indicates that many more files were uploaded than you were expecting, your site may be taking longer to deploy than it needs to. Visit our Forums for a verified Support Guide on making the most of Netlify’s CDN cache to learn about why this might be happening and get advice about what you can do to reduce the number of files uploaded each time in order to speed up your deploys. Deploy logSection titled “Deploy log” You can find a deploy log on the detail page of every deploy. The log provides content such about your site’s build image, dependency caching, and Netlify Build process, including all of the standard output which comes from running your build information about any Build Plugins your site may have installed and their execution details about the success, failure, or cancellation of the deploy For any successful deploy, highlights from the deploy log will be included in the deploy summary. Fix a failed deploySection titled “Fix a failed deploy” To help you fix failed deploys, Netlify offers AI capabilities that diagnose and suggest solutions for deploy failures and build errors so you can get back to shipping code. Learn more about Netlify’s AI capabilities to give solutions for failed deploys. For additional troubleshooting help, check out our Forums for a verified Support Guide on using the log to debug your build process. Note that Netlify deletes failed and canceled deploys that are 6 months old. Learn more about automated cleanup for failed deploys. Share log contentSection titled “Share log content” Deploy logs for a site linked to a private repo are available to all site members. For a site linked to a public repo, you can control deploy log visibility to determine the privacy level. To share deploy log content, you can copy the entire log by selecting Copy to clipboard (the clipboard icon). You can also generate a shareable URL for a single log line or a range of lines. For a single log line, select the line number to highlight the line. For a range of log lines, select the line number for the first log line in the range, then press shift and select the final log line number to highlight the full range. If needed, press esc to deselect log lines. Once you’ve selected a line or range, copy the resulting URL from the address bar of your web browser. The URL syntax should resemble ://app.netlify.com/sites/SITE_NAME/deploys/DEPLOY_ID#L5-L10 Branches and deploysSection titled “Branches and deploys” Netlify lets you control which branches in your Git repository you want to deploy. DefinitionsSection titled “Definitions” The following definitions highlight terms related to site deploys. For definitions regarding build commands, directories, and settings, visit the build configuration overview. Production Git branch that Netlify uses to build and deploy changes to your site’s main URL, such as www.yourcustomdomain.com or mysitename.netlify.app. Production deploy from the production branch. If auto publishing is enabled, each new production deploy will become the published deploy. Published deploy that is currently available as the live version of your site, accessible from your site’s main URL. Branch deploy generated from a branch that is not your production branch. Branch deploys are published to a URL which includes the branch name and two hyphens (--) as a prefix. For example, if a branch is called staging, it will deploy to staging--mysitename.netlify.app. If you use Netlify DNS, you can enable branch subdomains, so the staging branch example would deploy to staging.yourcustomdomain.com. To set up a branch deploy, learn more. Deploy deploy generated from a pull request, merge request, or agent run, building a preview of the site based on the latest changes. Deploy Previews from pull/merge requests are published to a URL with the prefix deploy-preview followed by the identifier number and two hyphens (--). For example, a Deploy Preview for pull/merge request #42 will deploy to deploy-preview-42--mysitename.netlify.app. Deploy Previews from agent runs use a URL with the prefix agent- followed by the run ID, for example agent-69a6140cc823ebba94b8ef32--mysitename.netlify.app. For more information, visit the docs on Deploy Previews. successful deploy of your site also creates a deploy permalink that starts with the deploy ID number and two hyphens (--). For The web content at this URL never changes. This is in contrast to production deploys, branch deploys, and Deploy Previews where the web content is updated when you merge or push new commits. Branch deploys versus Deploy PreviewsSection titled “Branch deploys versus Deploy Previews” Deploy PreviewsBranch deploysDefault setupNetlify automatically builds Deploy Previews for pull/merge requests and agent runs unless you change the Deploy Preview controls.Requires setup in Netlify UI. Set up branch deploys for only specific branches or for all new branches.URLFor pull/merge includes deploy-preview- and the PR/MR number. For agent includes agent- and the run ID.Default URL generated from the branch name. Can customize your branch deploy domain with Netlify DNS.ScopePreview site changes scoped to a single pull/merge request or agent run.Preview site changes scoped to a branch. Netlify generates a new branch deploy for every commit to your branch deploy branch. Site visitors can visit your branch deploy at the same stable branch deploy URL. By default, if a pull/merge request is opened on a branch against a production or branch deploy branch, then Netlify also generates a Deploy Preview. For example, you can open a pull/merge request on a branch deploy branch and find both a Deploy Preview and a branch deploy in your site’s deploy list from this update. Collaboration tools for your siteSection titled “Collaboration tools for your site” By default, the Netlify Drawer is enabled for Deploy Previews but if you want to use the Netlify Drawer on branch deploys, you must configure this in the Netlify Drawer settings. The Netlify Drawer enables stakeholders to share context-rich feedback about your deploy. This includes image, video, and browser metadata that syncs with your established workflows and project tracking tools. You can also invite an unlimited number of people to review your site deploys with Netlify’s Reviewer role. Stakeholders can open issues, items, or cards that sync with their preferred project tracking tools. The Netlify Drawer integrates with project tracking tools, such as GitHub, GitLab, GitLab self-hosted instances, Jira Software, Jira Server/Data Center, Azure DevOps, Trello, and more. Learn more about making your Deploy Previews and branch deploys more collaborative with the Netlify Drawer in our deploy collaboration docs. Production branch controlsSection titled “Production branch controls” By default, Netlify deploys your site’s production branch after every merge to the production branch. If you want to pause publishing your production branch, you can lock a deploy and stop auto-publishing to your site’s designated production branch. To change the production branch name, go to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. Branch deploy controlsSection titled “Branch deploy controls” You can set up a branch deploy for a specific branch or for all new branches in your repository through your project configuration. By default, Netlify will not generate a branch deploy unless a Developer or Owner has set up branch deploys for your site. Missing collaboration tools on your branch deploy? If you have an existing branch deploy that does not show the Netlify Drawer, try merging new changes into your branch to generate a refreshed branch deploy. For more help, check our troubleshooting docs. Set up a branch deploy for specific branchesSection titled “Set up a branch deploy for specific branches” To set up a branch deploy for one or more specific branches, such as staging or to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. Select Let me add individual branches and enter the name of each branch you want to deploy. You can also enter branch names you haven’t created yet in your repository. To deploy all branches with a specific prefix, add an asterisk to the end of your branch name, e.g. features/*. To confirm, select Save. Set up branch deploys for all new branchesSection titled “Set up branch deploys for all new branches” To automatically generate branch deploys for every new branch pushed to your remote site to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. Next to Branch deploys, select All. This excludes the designated production branch for your repository. To confirm, select Save. Turn off all branch deploys for your siteSection titled “Turn off all branch deploys for your site” To turn off all branch deploys for your to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. For Branch deploys, select None. To confirm, select Save. Protect all branch deploys with a passwordSection titled “Protect all branch deploys with a password” You can control who can access your site's branch deploys by requiring a password. Learn more at our Password Protection docs. Deploy Preview controlsSection titled “Deploy Preview controls” Netlify builds Deploy Previews by default for pull requests and merge requests. To learn how to configure Deploy Previews, review the Deploy Previews docs. Search engine indexingSection titled “Search engine indexing” Netlify automatically ensures that only your currently published production deploy and most recent branch deploys can be indexed by search engines. Requests to Deploy Previews, unpublished production deploys, and old branch deploys will have an header included in the response. Depending on how you use branch deploys, you may want to prevent even your most recent branch deploys from being indexed by search engines. You can do so by configuring custom headers in your branch. Deploy contextsSection titled “Deploy contexts” Deploy contexts give you the flexibility to configure your site’s builds depending on the context they are going to be deployed to. There are five predefined deploy : this context corresponds to the main site’s deployment, attached to the Git branch you set when the site is created. context corresponds to the previews we build for pull/merge requests and agent runs. context corresponds to deploys from branches that are not the site’s main production branch. context corresponds to Preview Server environments. context corresponds to local development environments run using Netlify Dev. Besides these predefined contexts, sites can also use branch names as custom deploy contexts. For example, a branch called staging will match a deploy context called staging. Deploy contexts allow you to override options from your site’s configuration including the build command, the environment variables added to the build, Build Plugin configuration, and more. Overrides are applied in a hierarchical order. The site’s global settings apply to each deploy, if we’re building the production site, and if you change options in your production context, they will be overridden. Only options that are set explicitly are overridden; if you leave one out, the build will use the value of the global settings or previous contexts. Environment variables are also overridden individually, for example, you can have access tokens as environment variables per context. To customize settings for each deploy context, create a file called netlify.toml in the root of your Git repository. There, you can set as many contexts as you want to configure. For environment variables, you can also set different values for each deploy context using the Netlify UI, CLI, or API. Note that, as the configuration file is stored in your repository, you should be mindful of what sensitive values you include. Where possible, we recommend you set sensitive environment variables with the Netlify UI, CLI, or API instead. # Production context:# All deploys from the main repository branch# will inherit these settings. Be mindful# when using this option and avoid committing# sensitive values to public source repositories.[context.production] command = \"make production\" [context.production.environment] ACCESS_TOKEN = \"super secret\" # Deploys from main branch run this plugin in the build. # Plugins context requires double brackets. [[context.production.plugins]] package = \"@netlify/plugin-sitemap\" # Deploy Preview context:# All deploys generated from a pull/merge request or agent run# will inherit these settings. Be mindful# when using this option and avoid committing# sensitive values to public source repositories.[context.deploy-preview.environment] ACCESS_TOKEN = \"not so secret\" # Branch deploy context:# All deploys that are not from a pull/merge request# or from the production branch will inherit these settings.[context.branch-deploy] command = \"make staging\" # Dev context:# Environment variables set here are available for local# development environments run using Netlify Dev. These# values can be overwritten on branches that have a more# specific branch context configured.[context.dev.environment] NODE_ENV = \"development\" # Specific branch context:# Deploys from this branch will take these settings# and override their current ones.[context.feature] command = \"make feature\" [context.\"features/branch\"] command = \"gulp\" File-based configuration settings will override those set in the UI. In the netlify.toml file, settings for more specific contexts will override more general ones. For example, settings for a specific branch will override those for branch-deploy. Visit our docs on file-based configuration to learn more about what you can do with deploy contexts. Deploy protectionSection titled “Deploy protection” Netlify gives you the ability to protect your site deploys with the following Traffic Rules, which protect your site by applying traffic rules to block or allow certain IP addresses or geographic locations to access your site deploys. Rate limiting, which protects your site by applying highly-customizable rate limiting rules Password Protection features, which protect your site by requiring site visitors to enter a basic universal password or their Netlify team login credentials to access your site deploys. Deploy permissionsSection titled “Deploy permissions” Netlify has a Deploy Request Policy that ensures that Netlify only builds and deploys changes pushed to private repositories from recognized authors. This policy applies to production deploys, branch deploys, and Deploy Previews. Builds from build hooks are not affected. Recognized authors include Owners, Developers, and Git Contributors. Netlify also treats bots from GitHub Marketplace as recognized authors in private repositories. Unrecognized authors, or non-team members, are people, automated services, or bots who are not associated with a Netlify team member account. This includes some Git-based services, like a CMS. This policy does not apply to build hooks. Deploys triggered by build hooks are treated as trusted deploys. Similar to the Sensitive Variables policy, the Deploy Request Policy treats deploys from unrecognized authors as \"untrusted.\" Working with deploy requests from non-team membersSection titled “Working with deploy requests from non-team members” When a non-team member merges a pull request that triggers a build, the subsequent deploy will have the status Pending approval on the Deploys page. The Deploy log will show a similar message of Deploy request is pending review. A pending deploy request can be approved by a Team Owner, who must associate the non-team member with a Netlify team account before the build can start. If the non-team member has an existing Netlify account, they can connect their Git provider account to their Netlify user. Depending on your team plan, a Team Owner can take the following actions for non-team them as Git Contributors and enable auto-approval for all deploy requests Match them to an existing team member Add them as a new Git Contributor Reject their pending deploy request Require manual review for deploy requestsSection titled “Require manual review for deploy requests” Team Owners can require that all deploy requests triggered by users who are not already Netlify team members are manually approved by a Team Owner. This ensures that your team is not charged for any Git Contributors unless they are manually approved. Learn more in this Billing FAQ. To require manual approval for all deploy to Team settings > Access & security > Visitor access > Auto-approve deploys from non-team members. Select Edit settings. Select Require approval, then Save. Enable auto-approval for deploy requestsSection titled “Enable auto-approval for deploy requests” Team Owners can allow all builds for non-team members to run and deploy without needing approval or prompting a deploy request. This automatically adds the non-team member to the team as a Git Contributor. Team members are free on the Credit Pro plan On the Credit Pro plan, you can add unlimited team member seats for free. Unlimited seats are included in your monthly subscription cost starting at $20/month for 3,000 credits. Learn more about Credit-based pricing plans, or see the April 2026 pricing update. Teams on plans that charge for Git Contributors, such as the Legacy Pro plan, will be charged for auto-approved Git Contributors. See the Billing FAQ page for details. Credit Pro includes unlimited team seats and is not charged for auto-approved Git Contributors. To enable auto-approval for all deploy to Team settings > Access & security > Visitor access > Auto-approve deploys from non-team members. Select Edit settings. Select Auto-approve, then Save. Match to an existing team memberSection titled “Match to an existing team member” To match an unrecognized author with an existing team to a sites’s Deploys page and find the pending deploy in the list of deploys. Select Start approval process. Next, use the Further action required drop-down menu to select Approve and match with existing team member. Use the list to select the existing team member to match. To confirm, select Match contributor and approve deploy. Add a non-team member as a Git ContributorSection titled “Add a non-team member as a Git Contributor” Not every Git committer in your repo must be added as a Git Contributor. Only the Git committer who you’d like to trigger a deploy needs to be added to your team as a Git Contributor. To add a non-team member as a Git to a sites’s Deploys page and find the pending deploy in the list of deploys. Select Start approval process. Next, use the Further action required drop-down menu to select Approve and add as Git Contributor. Git Contributors will appear on the Members page as Active Git Contributors. Reject a pending deploySection titled “Reject a pending deploy” To reject a non-team member’s pending deploy request, go to the Site overview page and select Reject next to the pending deploy. The pull/merge request or changes from a Git commit will not be deployed, even if it is merged, and any future deploys by the same contributor will continue to require approval. Sensitive variable policySection titled “Sensitive variable policy” For sites connected to public repositories, Netlify may block some deploys depending on sensitive variable policy settings. A site member can approve or reject these deploys. Check out our sensitive variable policy docs for more information. Netlify deploys as previewsSection titled “Netlify deploys as previews” Netlify previews allow you to test and review changes before launching your updates to your production web project. Types of previewsSection titled “Types of previews” TypeDescriptionDeploy PreviewPreview changes from a pull request, merge request, or an AI-powered site or app generatorBranch DeployPreview changes from a Git branch, such as for a release, optimized for multiple people making changesPreview ServerPreview changes live to share development or code changes with othersNetlify DrawerCollect and share feedback from Deploy Previews or Branch deploys to issue trackers/pull requests/merge requests/project toolsVisual Editor previewPreview changes in the Visual Editor Preview URL visibilitySection titled “Preview URL visibility” Preview URLs for Deploy Previews or Branch deploys can be shared with anyone with the link, unless you set up the protection team login protection Preview Server URLs require a Netlify login to preview. More site deploys resourcesSection titled “More site deploys resources” Create deploys Manage deploys Deploy Previews Split Testing Deploy notifications Post processing Compiled build and deploy resources - start here! Last 14, 2026 PreviousBeginner’s glossaryNextCompare preview options Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# Production context:# All deploys from the main repository branch# will inherit these settings. Be mindful# when using this option and avoid committing# sensitive values to public source repositories.[context.production]  command = \"make production\"  [context.production.environment]    ACCESS_TOKEN = \"super secret\"  # Deploys from main branch run this plugin in the build.  # Plugins context requires double brackets.  [[context.production.plugins]]    package = \"@netlify/plugin-sitemap\"\n# Deploy Preview context:# All deploys generated from a pull/merge request or agent run# will inherit these settings. Be mindful# when using this option and avoid committing# sensitive values to public source repositories.[context.deploy-preview.environment]  ACCESS_TOKEN = \"not so secret\"\n# Branch deploy context:# All deploys that are not from a pull/merge request# or from the production branch will inherit these settings.[context.branch-deploy]  command = \"make staging\"\n# Dev context:# Environment variables set here are available for local# development environments run using Netlify Dev. These# values can be overwritten on branches that have a more# specific branch context configured.[context.dev.environment]  NODE_ENV = \"development\"\n# Specific branch context:# Deploys from this branch will take these settings# and override their current ones.[context.feature]  command = \"make feature\"\n[context.\"features/branch\"]  command = \"gulp\"\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.209Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":13,"estimatedTokens":8174}}50{"id":"doc-visual_editor_setup_glossary_netlify_docs-e680e84a","source":"documentation","title":"Visual editor setup glossary | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/get-started/visual-editor-glossary/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Annotations Automatic Content Reload Content Source Interface (CSI) Custom Actions Custom Fields Document Document Hooks Editorial Permissions Field Groups Inline Editor Model Page Editor Visual Editor configuration file On this page Overview Annotations Automatic Content Reload Content Source Interface (CSI) Custom Actions Custom Fields Document Document Hooks Editorial Permissions Field Groups Inline Editor Model Page Editor Visual Editor configuration file For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Get Started / Visual editor setup glossary Copy page View as Markdown Copy as Markdown View as Markdown Learn the key terms for working with the visual editor, especially for setting up the visual editor. AnnotationsSection titled “Annotations” Annotations are HTML data attributes that are added to elements in your site’s code so that the visual editor can map content in the preview to the correct document and field in the content source. This allows for two-way content synchronization, ensuring changes made in the editor are saved back to the content source and updates in the source are reflected in the editor. Note that the data-sb-object-id attribute is used to uniquely identify a document, while the data-sb-field-path attribute specifies the field within that document to be edited. Learn more in our Annotations reference docs. Automatic Content ReloadSection titled “Automatic Content Reload” Automatic Content Reload is the mechanism that updates the site preview so that a user sees content changes made by anyone in real-time, without requiring a full page reload. This ensures all users are always working with the latest content. Content Source Interface (CSI)Section titled “Content Source Interface (CSI)” CSI is the engine that enables the Visual Editor to connect to your content source, allowing for two-way content synchronization. It is the mechanism that allows the Visual Editor to read content from and write changes back to the content source. CSI supports any structured content source with read and write abilities via an API. Learn more about the Content Source Interface in our reference docs. Custom ActionsSection titled “Custom Actions” Custom actions are like integrations that allow users to perform site and content tasks directly within the Visual Editor. This can include triggering workflows, sending content for translation, or generating AI content for fields. Custom actions can be triggered at various points in the UI, including global actions for the site, bulk actions on multiple documents, model actions on an individual document, and field actions on a specific field. Learn more about the Custom actions in our reference docs. Custom FieldsSection titled “Custom Fields” Custom fields are tailored controls for users when editing fields in the page and content editors. These allow developers to provide a better user experience when editing particular kinds of content by extending the default set of field types and controls. Custom fields can be editable inline or in a modal. DocumentSection titled “Document” A document is a structured data object from a content source that represents content for a page or component. Documents are grouped together in the content source using a model. Learn more in the model definition or in the Document reference docs. Document HooksSection titled “Document Hooks” Document hooks are methods that allow a developer to make programmatic adjustments to content based on a user’s actions, before the change is stored in the content source. This allows for specific behaviors and content transformations based on what a user does. Editorial PermissionsSection titled “Editorial Permissions” Editorial permissions define the level of access a user has within Visual Editor for each site. They control what a user can change and can be customized. You can customize these permissions or use default roles like Reviewer, Internal Builder, Publisher, and Developer. Field GroupsSection titled “Field Groups” Field Groups are used to organize form fields into tabbed groups, which simplifies the editing interface for a user editing content when a model has many fields. This helps a user focus on specific areas of content. Inline EditorSection titled “Inline Editor” The Inline Editor enables users to make changes directly within the site preview by clicking on elements. This makes content editing more intuitive for users. It is enabled through annotations, which map the content to the correct source and field. ModelSection titled “Model” A content schema that defines the structure of content in a content source. There are three , data, and object. Page models represents the shape of a web page and is tied to a URL. Data models represents content meant to stand alone or be referenced from a page. Object models represents repeatable content embedded in another model. For example, a web page can apply visual editor models in this more details, check out our structured content docs or the content modeling reference docs. Page EditorSection titled “Page Editor” The Page Editor is an editing panel that changes context based on the active page in the preview. It is enabled when the Visual Editor knows that a document is associated with a URL path. The page editor allows content editors to edit fields within the context of the page they are viewing. Visual Editor configuration fileSection titled “Visual Editor configuration file” The visual editor configuration file is a stackbit.config.ts or stackbit.config.js file stored in the root of your site repository. Last 16, 2026 PreviousTroubleshoot visual editor setupNextConcepts overview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.217Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2085}}51{"id":"doc-configure_external_dns_for_a_custom_domain_netli-79e0c414","source":"documentation","title":"Configure external DNS for a custom domain | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/configure-external-dns/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Configure a subdomain Configure an apex domain DNS record propagation On this page Overview Configure a subdomain Configure an apex domain DNS record propagation For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / Configure external DNS for a custom domain Copy page View as Markdown Copy as Markdown View as Markdown If you’ve assigned an externally registered domain to your site, and you don’t want to use Netlify DNS, you need to configure your external DNS provider to point your domain to Netlify. To access customized details about the DNS records you need to configure, go to Domain management > Production domains and select Pending DNS verification next to the custom domain. The next steps vary depending on the type of domain or subdomain. For a subdomain of a domain you own, such as blog.petsofnetlify.com or www.petsofnetlify.com, follow the directions below for subdomain configuration. For an apex domain with no subdomain, such as petsofnetlify.com, make sure to read our advice about using apex domains, then follow the directions below for apex domain configuration. Special handling for apex and www If you assign an apex domain or a www subdomain to your site, Netlify will automatically add both the apex domain and the www subdomain. This means you should follow directions for both configuring a subdomain and configuring an apex domain. For more information, visit the section on apex domains and www subdomains. Need to delegate just a subdomain? You can delegate a subdomain to Netlify DNS without the apex domain. Learn more in this doc. Configure a subdomainSection titled “Configure a subdomain” To point a subdomain such as blog.petsofnetlify.com or www.petsofnetlify.com to your site on Netlify, you must first add the domain to your site on Netlify and then create a CNAME record with your DNS provider. For example, if your site’s domain is blog.petsofnetlify.com and your Netlify subdomain is brave-curie-12345.netlify.app: Follow the instructions to add the domain blog.petsofnetlify.com to the brave-curie-12345.netlify.app site on Netlify. At the end of the process, Netlify provides a CNAME record to add to your DNS provider. Find your DNS provider’s DNS record settings for your apex domain, petsofnetlify.com. On your DNS provider’s site, add the CNAME record with your subdomain, blog, as the host. Point the record to your Netlify subdomain, brave-curie-12345.netlify.app. High-Performance Edge uses a different subdomain If your site is on the High-Performance Edge, point the record to the dedicated subdomain in your High-Performance Edge onboarding PDF. Save your settings. It may take a full day for the settings to propagate across the global Domain Name System. If your site uses the www subdomain, as in www.petsofnetlify.com, you will use the same procedure described above. Once you configure the www subdomain, an apex domain will also be added automatically to your site. You’ll need to follow the steps in the section below to configure the apex domain too. Learn more about our special handling for www subdomains. Configure an apex domainSection titled “Configure an apex domain” Unlike subdomains, apex domains don’t support CNAME records. You must configure your apex domain with an ALIAS, ANAME, flattened CNAME, or A record. Different DNS providers support different record types. Depending on what your DNS provider supports, use either the recommended configuration or the fallback option below. If your DNS provider supports ALIAS, ANAME, or flattened CNAME records, use this recommended configuration, which is more resilient than the fallback option. Find your DNS provider’s DNS record settings for your apex domain, such as petsofnetlify.com. Add an ALIAS, ANAME, or flattened CNAME record. Depending on your provider, leave the host field empty or enter @. Point the record to Netlify’s load balancer High-Performance Edge uses a different load balancer If your site is on the High-Performance Edge, point the record to the High-Performance Edge load balancer noted in the Pending DNS verification modal's customized details. Save your settings. It may take a full day for the settings to propagate across the global Domain Name System. If your DNS provider does not support ALIAS, ANAME, or flattened CNAME records, use this fallback option. Find your DNS provider’s DNS record settings for your apex domain, such as petsofnetlify.com. Add an A record. Depending on your provider, leave the host field empty or enter @. Point the record to Netlify’s load balancer IP High-Performance Edge uses a different load balancer If your site is on the High-Performance Edge, point the record to the High-Performance Edge load balancer IP address noted in the Pending DNS verification modal’s customized details. Save your settings. It may take a full day for the settings to propagate across the global Domain Name System. In both cases, the apex domain eventually resolves to our load balancer IP address. This means the apex domain can’t take advantage of direct DNS routing on a global CDN like Netlify’s. Because of this, we recommend using a subdomain for your primary domain when using external DNS. Special handling for apex domains If you assign an apex domain to your site, Netlify will automatically add a www subdomain for the domain as well, which requires the subdomain configuration as described above. To find out how this affects your site configuration, visit the section on apex domains and www subdomains. DNS record propagationSection titled “DNS record propagation” Depending on your DNS provider, changes to DNS records can take several hours to propagate and take effect for the entire internet. If more than 24 hours have passed since you configured your DNS records, and your site is still not accessible at your custom domain, try our DNS troubleshooting tips. Last 28, 2025 PreviousConfigure an automatic subdomain for deploysNextDelegate a standalone subdomain Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.218Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2082}}52{"id":"doc-domains_glossary_netlify_docs-80e16adf","source":"documentation","title":"Domains glossary | Netlify Docs","url":"https://docs.netlify.com/manage/domains/domains-fundamentals/domains-glossary/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Apex domain Atomic deploy permalink Automatic deploy subdomain Branch deploy URL Branch subdomain Custom domain Deploy Preview URL Domain alias Domain name Domain registrar DNS provider DNS server DNS zone Netlify DNS Netlify subdomain Primary domain Production deploy URL Subdomain Top-level domain On this page Overview Apex domain Atomic deploy permalink Automatic deploy subdomain Branch deploy URL Branch subdomain Custom domain Deploy Preview URL Domain alias Domain name Domain registrar DNS provider DNS server DNS zone Netlify DNS Netlify subdomain Primary domain Production deploy URL Subdomain Top-level domain For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Domains Fundamentals / Domains glossary Copy page View as Markdown Copy as Markdown View as Markdown Learn key terms for understanding how to set up and maintain domains with Netlify and beyond. Apex domainSection titled “Apex domain” The apex domain, also known as a root, bare, or naked domain, is the yourcustomdomain.com part in the domain www.yourcustomdomain.com. Atomic deploy permalinkSection titled “Atomic deploy permalink” An atomic deploy permalink is the unique URL for a specific successful deploy. Also called a deploy permalink or permalink. Unlike the other site deploys, the web content at this URL never changes. A new deploy permalink is generated for each successful deploy of your site. For example, 1234abcd12acde000111cdef--mysitename.netlify.app is an atomic deploy. Automatic deploy subdomainSection titled “Automatic deploy subdomain” An automatic deploy subdomain is a subdomain that can be customized for all Deploy Previews and/or for all branch deploys. It can use your production site’s primary domain or a different custom domain with additional subdomains and requires Netlify DNS. Branch deploy URLSection titled “Branch deploy URL” A branch deploy URL is a URL for a branch deploy that uses your production site’s primary domain or a different custom domain with additional subdomains and requires Netlify DNS. Branch subdomainSection titled “Branch subdomain” A branch subdomain is a subdomain for a branch deploy that applies your production site’s primary domain to specified branch deploys. It can apply to an individual branch deploy or to all branches besides your production branch and requires Netlify DNS. Custom domainSection titled “Custom domain” A custom domain is a domain you can assign to a site. Deploy Preview URLSection titled “Deploy Preview URL” A Deploy Preview URL is a URL for a Deploy Preview that uses your production site’s primary domain or a different custom domain with additional subdomains and requires Netlify DNS. Domain aliasSection titled “Domain alias” A domain alias is an additional custom domain assigned to a production site. Domain nameSection titled “Domain name” A domain name (or domain for short) is the full name used to access a site, such as mysitename.netlify.app or www.yourcustomdomain.com. Domain registrarSection titled “Domain registrar” A domain registrar (or domain registration service) is a company that lets you register a domain name. DNS providerSection titled “DNS provider” A DNS provider is a company that maintains the DNS servers that translate a domain name to a destination. DNS serverSection titled “DNS server” A DNS server (or Name server) is a specialized server that translates domain names into IP addresses. DNS zoneSection titled “DNS zone” A DNS zone is used to provide information about one or more domain names. Each zone contains a list of DNS records with mappings between domain names and IP addresses. Netlify DNSSection titled “Netlify DNS” Netlify DNS is Netlify’s managed DNS service. Netlify subdomainSection titled “Netlify subdomain” A Netlify subdomain is Netlify's term for the default domain with the form [name-of-your-site].netlify.app given to each site. Primary domainSection titled “Primary domain” A primary domain is Netlify's term for the main custom domain assigned to a production site. Production deploy URLSection titled “Production deploy URL” A production deploy is a deploy made to the desiginated production branch. If you haven’t assigned a custom domain for your site, then the production deploy URL will take this SubdomainSection titled “Subdomain” A subdomain is a domain that is part of a larger domain; the only domain that is not also a subdomain is the apex domain. For example, www.yourcustomdomain.com and app.yourcustomdomain.com are subdomains of yourcustomdomain.com. Top-level domainSection titled “Top-level domain” The top-level domain is the last part of the domain name. For example, the .com part in www.yourcustomdomain.com. Last 1, 2025 PreviousRegister and buy a domainNextUnderstand domains Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.220Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1772}}53{"id":"doc-manage_domains_for_branch_deploys_netlify_docs-91af6af6","source":"documentation","title":"Manage domains for branch deploys | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/manage-domains-for-branch-deploys/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Understand your domain options Default URL for branch deploys URL limitation Custom branch subdomains for branch deploys Compare subdomain options for branch deploys Set up both a branch subdomain and an automatic deploy subdomain Set up an automatic deploy subdomain Set up a branch subdomain On this page Overview Understand your domain options Default URL for branch deploys URL limitation Custom branch subdomains for branch deploys Compare subdomain options for branch deploys Set up both a branch subdomain and an automatic deploy subdomain Set up an automatic deploy subdomain Set up a branch subdomain For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Manage domains for branch deploys Copy page View as Markdown Copy as Markdown View as Markdown By default, branch deploys use the Netlify subdomain netlify.app with your branch name but you can customize your branch deploy URL with an automatic deploy subdomain. Understand your domain optionsSection titled “Understand your domain options” Default URL for branch deploysSection titled “Default URL for branch deploys” By default branch deploys use the Netlify subdomain netlify.app with the branch name, such as https://staging.netlify.app where staging is your branch name. URL limitationSection titled “URL limitation” Be aware that the branch name combined with the site name should not exceed 63 characters, as described in the RFC 1035 or the auto-generated branch deploy URL will not work. You will need to create a new branch deploy with either a shorter site name or branch name so that the total characters and symbols do not exceed 63. For example, if your site domain is my-personal-site and the branch name is my-very-long-and-important-for-release-feature-name, it will produce a URL which looks ://my-very-long-and-important-for-release-feature-name--my-personal-site.netlify.app. This URL won't work, as the first part of the domain my-very-long-and-important-for-release-feature-name--my-personal-site is longer than 63 symbols. Custom branch subdomains for branch deploysSection titled “Custom branch subdomains for branch deploys” This feature is available in our UI with Netlify DNS. Netlify can generate a branch subdomain for specified branch deploys using your site’s primary custom domain designated for your production site. The resulting branch subdomains use the fixed syntax branchname.yourcustomdomain.com and can’t use a different pattern. For example, if your custom domain is example.com and your branch is staging, you can check the latest deploy of that branch at staging.example.com. Before you can enable branch subdomains, you must enable branch deploys for your branch and successfully deploy your branch. To add a new branch subdomain, go to Domain management > Domains > Branch subdomains, and select New subdomain. A branch subdomain can be deleted by using the x button in the corresponding subdomain row. Visit our Forums for a verified Support Guide on setting up branch subdomains without Netlify DNS. Compare subdomain options for branch deploysSection titled “Compare subdomain options for branch deploys” For an overview of the main differences between these subdomains, consider these key differences. Automatic deploy subdomainsBranch subdomainsCustom domain optionsCan use your production site’s primary domain or any other custom domain or subdomain managed by Netlify DNS and available to your team.Can only use your production site’s primary domain, which must be managed by Netlify DNS.Additional subdomain supportXRequires Netlify DNSXXPricing planCore Pro plan and aboveAll plansBranch deploy scopeApplies to all branch deploys.Applies to user-specified branch branches or all branches except the designated production branch.Setup interactionsOnce set up, becomes the primary deploy URL for branch deploys. Cannot change existing branch subdomain settings without removing your automatic deploy subdomain.Once automatic deploy subdomains are set up, cannot change existing branch subdomain settings but branch subdomain URLs still resolve for pre-existing branches. Set up both a branch subdomain and an automatic deploy subdomainSection titled “Set up both a branch subdomain and an automatic deploy subdomain” If you want to use both branch subdomains and an automatic deploy subdomain for branch deploys, ensure that you set up any branch subdomains before your automatic deploy subdomain. We recommend setting up only stable or internal branch subdomains since you would need to remove your automatic deploy subdomain to make changes to your branch subdomain settings. Also, note that the Netlify UI, CLI, and API will use the automatic deploy subdomain for branch deploys configured with a branch subdomain. The branch deploy URL featuring your branch subdomain, such as staging.company.com should still resolve and work for site visitors though. Learn more about limitations to using both types of subdomains for branch deploys. Set up an automatic deploy subdomainSection titled “Set up an automatic deploy subdomain” To set up an automatic deploy subdomain for your branch deploys, check out Automatic Deploy Subdomains. Set up a branch subdomainSection titled “Set up a branch subdomain” To set up a branch subdomain for your branch deploys, check out our Branch deploy docs. Last 14, 2025 PreviousManage domains for a site appNextManage domains for Deploy Previews Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.221Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1942}}54{"id":"doc-automatic_deploy_subdomains_netlify_docs-24654e5f","source":"documentation","title":"Automatic deploy subdomains | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/automatic-deploy-subdomains/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Use cases Domain requirements Example deploy URLs Automatic deploy subdomains for Deploy Previews Set an automatic deploy subdomain for Deploy Previews Automatic deploy subdomains for branch deploys Prerequisites Set an automatic deploy subdomain for branch deploys Choose a unique URL for your branch deploys Limitations for sites with existing branch subdomains Use a new custom domain for your automatic deploy subdomain Use the Netlify API to set automatic deploy subdomains Custom certificate requirements Remove an automatic deploy subdomain On this page Overview Use cases Domain requirements Example deploy URLs Automatic deploy subdomains for Deploy Previews Set an automatic deploy subdomain for Deploy Previews Automatic deploy subdomains for branch deploys Prerequisites Set an automatic deploy subdomain for branch deploys Choose a unique URL for your branch deploys Limitations for sites with existing branch subdomains Use a new custom domain for your automatic deploy subdomain Use the Netlify API to set automatic deploy subdomains Custom certificate requirements Remove an automatic deploy subdomain For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Automatic deploy subdomains Copy page View as Markdown Copy as Markdown View as Markdown With automatic deploy subdomains, you can set up automatically branded URLs for Deploy Previews or branch deploys — unifying your site’s preview environments, auth flows, third-party services, and other site versions with a shared custom domain. Automatic deploy subdomains are a type of custom domain that you can set for all Deploy Previews or all branch deploys. Use casesSection titled “Use cases” When you set up an automatic deploy subdomain for all of your Deploy Previews or branch deploys, you branded deploy URLs that don’t include the Netlify subdomain. For example, build greater trust with your stakeholders by sharing deploy-preview-42.company.com instead of deploy-preview-42--mysitename.netlify.app. Use third-party services the way you do for your production site, such as auth flow services that rely on a custom domain. Ensure deploys are “trusted” and in the “allowed domain list” for any third-party scripts or services that require this. Meet internal security requirements while leveraging Netlify’s Deploy Previews and branch deploys to preview and collaborate on changes before they go live. Once you configure an automatic deploy subdomain, Netlify uses this custom domain for your Deploy Previews and/or branch deploys by default within the Netlify UI, the API, CLI, and deploy notifications. Domain requirementsSection titled “Domain requirements” The custom domain you set as your automatic deploy subdomain must be managed by Netlify DNS and available to your team. By default, domains managed by Netlify DNS can be applied to your Deploy Previews or branch deploys. For example, if you already delegated company.com to Netlify DNS, then subdomains of company.com, such as early-access.company.com, are also delegated to Netlify DNS by default. That means you can use early-access.company.com as your automatic deploy subdomain. If you want to use a custom domain that Netlify DNS does not already manage, add the custom domain to your Netlify team and configure it to be managed by Netlify DNS. Learn more in these domain setup steps. Want to use a subdomain without bringing the apex domain to Netlify DNS? You can bring a subdomain to Netlify DNS without the apex domain. For example, you can delegate docs.company.com to Netlify DNS without also delegating company.com. Learn more about stand-alone subdomain support. Example deploy URLsSection titled “Example deploy URLs” Site deploysNetlify subdomainAutomatic deploy subdomainDeploy Previewdeploy-preview-42--mysitename.netlify.appdeploy-preview-42.company-internal-testing.comBranch deploy, e.g. staging branchstaging--mysitename.netlify.appstaging.company-internal-testing.comAtomic deploy permalinkUses the Netlify subdomain and a deploy ID, such as 1234abcd12acde000111cdef--mysitename.netlify.app.N/A When you set an automatic deploy subdomain for all Deploy Previews or all branch deploys, your deploys are still accessible at the Netlify subdomain, such as deploy-preview-42--mysitename.netlify.app or staging--mysitename.netlify.app. Using High-Performance Edge? If your site is on the High-Performance Edge, then automatic deploy subdomains are served from the High-Performance Edge. However, Netlify subdomains (*.netlify.app) are always served from the standard network. Your deploy permalinks, which offer unique URLs for successful deploys of your site, will continue to use the Netlify subdomain. Unlike other deploy URLs, deploy permalinks do not update with new Git commits. Instead, Netlify generates new deploy permalinks for each successful deploy of your site. Not sure if you want to use Deploy Previews or branch deploys? Deploy Previews are scoped to a pull/merge request while branch deploys are scoped to a branch. Branch deploys can offer a longer-standing URL than Deploy Previews since they are based on the branch name and not the pull/merge request. Learn more about the difference between these deploys in these docs. Automatic deploy subdomains for Deploy PreviewsSection titled “Automatic deploy subdomains for Deploy Previews” Deploy Previews are automatically enabled for all sites using continuous integration with Netlify. If your site doesn’t have Netlify continuous integration set up, check out these docs. Set an automatic deploy subdomain for Deploy PreviewsSection titled “Set an automatic deploy subdomain for Deploy Previews” To set up an automatic deploy subdomain for your site’s Deploy to Domain management > Automatic deploy subdomains. Select Edit custom domains. Next to Deploy Previews, select Add custom domain. Under Domain, you’ll find domains managed by Netlify DNS. Select your chosen custom domain. Optionally, enter an additional subdomain, such as early-access or qa. Want to use a different domain? If you can’t find the domain you want to add in the drop-down menu, check out these docs for adding a new custom domain. Review the preview of the deploy URL for your Deploy Previews. To confirm, select Save. Once saved, Netlify updates the domain for all open Deploy Previews. If you applied a custom domain that is not already live as your primary site domain (or does not already have a security certificate), then your new deploy URL may take up to 24 hours to resolve and work with HTTPS. Automatic deploy subdomains for branch deploysSection titled “Automatic deploy subdomains for branch deploys” Branch deploys are often used for maintaining a separate version of your site for QA, internal testing, or even to manage different versions of site content for different audiences or product versions. If you are already using branch subdomains, check out our branch subdomain comparison docs to understand the key differences between these subdomains and how they can work together. If you set up an automatic deploy subdomain for branch deploys on your site, then each branch deploy will generate the same automatic deploy subdomain and include your branch deploy’s unique branch name. PrerequisitesSection titled “Prerequisites” To set up an automatic deploy subdomain for your site’s branch deploys, you must first enable branch deploys for your site. To enable branch deploys for your site, go to Project configuration > Build & deploy > Branches and deploy contexts. Select Configure. Next to Branch deploys, set up branch deploys for a specific branch or for all non-production branches. To confirm, select Save. Once branch deploys are enabled, create a new branch and push a commit to this branch in your connected site repo. Netlify will automatically generate a branch deploy, which you can preview in your site’s deploy list. Created a deploy with the CLI? If you created a deploy using the Netlify CLI’s --alias flag, then be aware that these deploys are not branch deploys and do not support branch subdomains or automatic deploy subdomains. We recommend you avoid using --alias with any of your branch names. Set an automatic deploy subdomain for branch deploysSection titled “Set an automatic deploy subdomain for branch deploys” To set up an automatic deploy subdomain for your site’s branch to Domain management > Automatic deploy subdomains. Select Edit custom domains. Next to Branch deploys, select Add custom domain. Under Domain, you’ll find domains managed by Netlify DNS. Select your chosen custom domain. Optionally, enter an additional subdomain, such as early-access or qa. Want to use a different domain? If you can’t find the domain you want to add in the drop-down menu, check out these docs for adding a new custom domain. Review the preview of the deploy URL for your branch deploys. To confirm, select Save. Once saved, Netlify updates the domain for all active branch deploys. If you applied a custom domain that is not already live as your primary site domain (or does not already have a security certificate), then your new deploy URL may take up to 24 hours to resolve and work with HTTPS. Choose a unique URL for your branch deploysSection titled “Choose a unique URL for your branch deploys” It is possible to configure automatic subdomains for branch deploys so that a branch subdomain conflicts with another site’s production domain. Since Deploy Previews are appended with the pull/merge request number, their automatic subdomains are unlikely to conflict with other domains. For A has a primary site domain of staging.company.com for the production site. Site B has an automated domain of staging.company.com for its staging branch. When there is a conflict, domains listed in your Production domains settings will take precedence over other internal domains. So in this example, staging.company.com will resolve to the content of site A. To prevent accidental domain duplication, you might choose to add another subdomain level to your branch subdomains that is not used in production, such as internal in staging.internal.company.com. If you get a domain conflict, you can rename the branch. For example, you can rename the branch from staging to qa. Then, the next time you deploy this branch, it would use the qa.company.com domain. Limitations for sites with existing branch subdomainsSection titled “Limitations for sites with existing branch subdomains” Once you add an automatic deploy subdomain for branch deploys, you cannot edit or change existing manual branch subdomains. You also cannot manually add new branch subdomains, but existing branch subdomains will still work. If you configured branch subdomains before enabling automatic deploy subdomains, both the branch subdomains and automatic deploy subdomains will resolve and be available. If both are set up, the Netlify UI, CLI, API, and deploy notifications will link to the automatic deploy subdomain by default. To make changes to your branch subdomain, you must remove the automatic deploy subdomain first. If you want to compare using branch subdomains with automatic deploy subdomains, check out our comparison docs for applying a custom domain to a branch deploy. Use a new custom domain for your automatic deploy subdomainSection titled “Use a new custom domain for your automatic deploy subdomain” By default, you can choose primary site domains that are also managed by Netlify DNS as your automatic deploy subdomain. You can also add additional subdomains to these domains, such as early-access or qa. If you want to use a custom domain that is not listed in the Netlify UI, you must first delegate this domain to Netlify DNS. Want to use a subdomain without bringing the apex domain to Netlify DNS? You can bring a subdomain to Netlify DNS without the apex domain. For example, you can delegate docs.company.com to Netlify DNS without also delegating company.com. Learn more about stand-alone subdomain support. To delegate a new domain to Netlify DNS, check out the steps in our docs on Configuring an automatic subdomain for deploys. Use the Netlify API to set automatic deploy subdomainsSection titled “Use the Netlify API to set automatic deploy subdomains” You can set automatic deploy subdomains when you create a site using the Netlify API. In your createSite request, use the following query parameters to pass the values to use for the branch_deploy_custom_domain Note that when you create or update a site with an automatic deploy subdomain, the build environment variable DEPLOY_PRIME_URL will update for all relevant deploys. Learn more about DEPLOY_PRIME_URL. Custom certificate requirementsSection titled “Custom certificate requirements” If you use a custom certificate for your site’s domains, that certificate must explicitly include any new subdomains used for automatic deploy subdomains. The standard wildcard syntax, such as *.company.com, does not cover this new subdomain. For example, your custom certificate will not work as expected in this have early-access.company.com as your automatic deploy subdomain, where early-access is the optional new subdomain you added in the Netlify UI you have a custom certificate with *.company.com as your wildcard domain but not *.early-access.company.com In this scenario, you must update your certificate to include the domains *.company.com, *.early-access.company.com so that early-access.company.com will work as expected. Remove an automatic deploy subdomainSection titled “Remove an automatic deploy subdomain” To remove an automatic deploy subdomain from your Deploy Previews or branch to Domain management > Automatic deploy subdomains. Select Edit custom domains. Next to Branch deploys or Deploy Previews, clear the Add custom domain checkbox. To confirm, select Save. Last 19, 2026 PreviousManage DNS recordsNextManage domains for a site app Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.223Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":4056}}55{"id":"doc-configure_an_automatic_subdomain_for_deploys_net-ad720690","source":"documentation","title":"Configure an automatic subdomain for deploys | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/configure-an-automatic-subdomain-for-deploys/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Use cases Domain requirements Example deploy URLs Automatic deploy subdomains for Deploy Previews Set an automatic deploy subdomain for Deploy Previews Automatic deploy subdomains for branch deploys Prerequisites Set an automatic deploy subdomain for branch deploys Choose a unique URL for your branch deploys Limitations for sites with existing branch subdomains Use a new custom domain for your automatic deploy subdomain Use the Netlify API to set automatic deploy subdomains Custom certificate requirements Remove an automatic deploy subdomain On this page Overview Use cases Domain requirements Example deploy URLs Automatic deploy subdomains for Deploy Previews Set an automatic deploy subdomain for Deploy Previews Automatic deploy subdomains for branch deploys Prerequisites Set an automatic deploy subdomain for branch deploys Choose a unique URL for your branch deploys Limitations for sites with existing branch subdomains Use a new custom domain for your automatic deploy subdomain Use the Netlify API to set automatic deploy subdomains Custom certificate requirements Remove an automatic deploy subdomain For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / Configure an automatic subdomain for deploys Copy page View as Markdown Copy as Markdown View as Markdown With automatic deploy subdomains, you can set up automatically branded URLs for Deploy Previews or branch deploys — unifying your site’s preview environments, auth flows, third-party services, and other site versions with a shared custom domain. Automatic deploy subdomains are a type of custom domain that you can set for all Deploy Previews or all branch deploys. Use casesSection titled “Use cases” When you set up an automatic deploy subdomain for all of your Deploy Previews or branch deploys, you branded deploy URLs that don’t include the Netlify subdomain. For example, build greater trust with your stakeholders by sharing deploy-preview-42.company.com instead of deploy-preview-42--mysitename.netlify.app. Use third-party services the way you do for your production site, such as auth flow services that rely on a custom domain. Ensure deploys are “trusted” and in the “allowed domain list” for any third-party scripts or services that require this. Meet internal security requirements while leveraging Netlify’s Deploy Previews and branch deploys to preview and collaborate on changes before they go live. Once you configure an automatic deploy subdomain, Netlify uses this custom domain for your Deploy Previews and/or branch deploys by default within the Netlify UI, the API, CLI, and deploy notifications. Domain requirementsSection titled “Domain requirements” The custom domain you set as your automatic deploy subdomain must be managed by Netlify DNS and available to your team. By default, domains managed by Netlify DNS can be applied to your Deploy Previews or branch deploys. For example, if you already delegated company.com to Netlify DNS, then subdomains of company.com, such as early-access.company.com, are also delegated to Netlify DNS by default. That means you can use early-access.company.com as your automatic deploy subdomain. If you want to use a custom domain that Netlify DNS does not already manage, add the custom domain to your Netlify team and configure it to be managed by Netlify DNS. Learn more in these domain setup steps. Want to use a subdomain without bringing the apex domain to Netlify DNS? You can bring a subdomain to Netlify DNS without the apex domain. For example, you can delegate docs.company.com to Netlify DNS without also delegating company.com. Learn more about stand-alone subdomain support. Example deploy URLsSection titled “Example deploy URLs” Site deploysNetlify subdomainAutomatic deploy subdomainDeploy Previewdeploy-preview-42--mysitename.netlify.appdeploy-preview-42.company-internal-testing.comBranch deploy, e.g. staging branchstaging--mysitename.netlify.appstaging.company-internal-testing.comAtomic deploy permalinkUses the Netlify subdomain and a deploy ID, such as 1234abcd12acde000111cdef--mysitename.netlify.app.N/A When you set an automatic deploy subdomain for all Deploy Previews or all branch deploys, your deploys are still accessible at the Netlify subdomain, such as deploy-preview-42--mysitename.netlify.app or staging--mysitename.netlify.app. Using High-Performance Edge? If your site is on the High-Performance Edge, then automatic deploy subdomains are served from the High-Performance Edge. However, Netlify subdomains (*.netlify.app) are always served from the standard network. Your deploy permalinks, which offer unique URLs for successful deploys of your site, will continue to use the Netlify subdomain. Unlike other deploy URLs, deploy permalinks do not update with new Git commits. Instead, Netlify generates new deploy permalinks for each successful deploy of your site. Not sure if you want to use Deploy Previews or branch deploys? Deploy Previews are scoped to a pull/merge request while branch deploys are scoped to a branch. Branch deploys can offer a longer-standing URL than Deploy Previews since they are based on the branch name and not the pull/merge request. Learn more about the difference between these deploys in these docs. Automatic deploy subdomains for Deploy PreviewsSection titled “Automatic deploy subdomains for Deploy Previews” Deploy Previews are automatically enabled for all sites using continuous integration with Netlify. If your site doesn’t have Netlify continuous integration set up, check out these docs. Set an automatic deploy subdomain for Deploy PreviewsSection titled “Set an automatic deploy subdomain for Deploy Previews” To set up an automatic deploy subdomain for your site’s Deploy to Domain management > Automatic deploy subdomains. Select Edit custom domains. Next to Deploy Previews, select Add custom domain. Under Domain, you’ll find domains managed by Netlify DNS. Select your chosen custom domain. Optionally, enter an additional subdomain, such as early-access or qa. Want to use a different domain? If you can’t find the domain you want to add in the drop-down menu, check out these docs for adding a new custom domain. Review the preview of the deploy URL for your Deploy Previews. To confirm, select Save. Once saved, Netlify updates the domain for all open Deploy Previews. If you applied a custom domain that is not already live as your primary site domain (or does not already have a security certificate), then your new deploy URL may take up to 24 hours to resolve and work with HTTPS. Automatic deploy subdomains for branch deploysSection titled “Automatic deploy subdomains for branch deploys” Branch deploys are often used for maintaining a separate version of your site for QA, internal testing, or even to manage different versions of site content for different audiences or product versions. If you are already using branch subdomains, check out our branch subdomain comparison docs to understand the key differences between these subdomains and how they can work together. If you set up an automatic deploy subdomain for branch deploys on your site, then each branch deploy will generate the same automatic deploy subdomain and include your branch deploy’s unique branch name. PrerequisitesSection titled “Prerequisites” To set up an automatic deploy subdomain for your site’s branch deploys, you must first enable branch deploys for your site. To enable branch deploys for your site, go to Project configuration > Build & deploy > Branches and deploy contexts. Select Configure. Next to Branch deploys, set up branch deploys for a specific branch or for all non-production branches. To confirm, select Save. Once branch deploys are enabled, create a new branch and push a commit to this branch in your connected site repo. Netlify will automatically generate a branch deploy, which you can preview in your site’s deploy list. Created a deploy with the CLI? If you created a deploy using the Netlify CLI’s --alias flag, then be aware that these deploys are not branch deploys and do not support branch subdomains or automatic deploy subdomains. We recommend you avoid using --alias with any of your branch names. Set an automatic deploy subdomain for branch deploysSection titled “Set an automatic deploy subdomain for branch deploys” To set up an automatic deploy subdomain for your site’s branch to Domain management > Automatic deploy subdomains. Select Edit custom domains. Next to Branch deploys, select Add custom domain. Under Domain, you’ll find domains managed by Netlify DNS. Select your chosen custom domain. Optionally, enter an additional subdomain, such as early-access or qa. Want to use a different domain? If you can’t find the domain you want to add in the drop-down menu, check out these docs for adding a new custom domain. Review the preview of the deploy URL for your branch deploys. To confirm, select Save. Once saved, Netlify updates the domain for all active branch deploys. If you applied a custom domain that is not already live as your primary site domain (or does not already have a security certificate), then your new deploy URL may take up to 24 hours to resolve and work with HTTPS. Choose a unique URL for your branch deploysSection titled “Choose a unique URL for your branch deploys” It is possible to configure automatic subdomains for branch deploys so that a branch subdomain conflicts with another site’s production domain. Since Deploy Previews are appended with the pull/merge request number, their automatic subdomains are unlikely to conflict with other domains. For A has a primary site domain of staging.company.com for the production site. Site B has an automated domain of staging.company.com for its staging branch. When there is a conflict, domains listed in your Production domains settings will take precedence over other internal domains. So in this example, staging.company.com will resolve to the content of site A. To prevent accidental domain duplication, you might choose to add another subdomain level to your branch subdomains that is not used in production, such as internal in staging.internal.company.com. If you get a domain conflict, you can rename the branch. For example, you can rename the branch from staging to qa. Then, the next time you deploy this branch, it would use the qa.company.com domain. Limitations for sites with existing branch subdomainsSection titled “Limitations for sites with existing branch subdomains” Once you add an automatic deploy subdomain for branch deploys, you cannot edit or change existing manual branch subdomains. You also cannot manually add new branch subdomains, but existing branch subdomains will still work. If you configured branch subdomains before enabling automatic deploy subdomains, both the branch subdomains and automatic deploy subdomains will resolve and be available. If both are set up, the Netlify UI, CLI, API, and deploy notifications will link to the automatic deploy subdomain by default. To make changes to your branch subdomain, you must remove the automatic deploy subdomain first. If you want to compare using branch subdomains with automatic deploy subdomains, check out our comparison docs for applying a custom domain to a branch deploy. Use a new custom domain for your automatic deploy subdomainSection titled “Use a new custom domain for your automatic deploy subdomain” By default, you can choose primary site domains that are also managed by Netlify DNS as your automatic deploy subdomain. You can also add additional subdomains to these domains, such as early-access or qa. If you want to use a custom domain that is not listed in the Netlify UI, you must first delegate this domain to Netlify DNS. Want to use a subdomain without bringing the apex domain to Netlify DNS? You can bring a subdomain to Netlify DNS without the apex domain. For example, you can delegate docs.company.com to Netlify DNS without also delegating company.com. Learn more about stand-alone subdomain support. To delegate an existing domain you own to Netlify to your project dashboard, on the left, choose Domain management. Under Automatic deploy subdomains, check Add custom domain. Optionally, you can add a subdomain to your custom domain, such as early-access, internal, or docs. Under Domain, choose a custom domain or add a new custom domain with the option Configure Netlify DNS for a custom domain. Enter new domain and confirm with Set up with Netlify DNS. Point your domain's name servers to Netlify. To use Netlify DNS, go to your domain registrar and change your domain's name servers to the following custom hostnames assigned to your DNS zone. Confirm with I've done this, proceed. Select Save. Your changes may need more time to take effect depending on your DNS updates. Some DNS updates can take up to 24 hours to take effect and some changes take even longer. Once your changes take effect, your Deploy Preview or branch deploy URLs will automatically update to use the new domain and/or subdomain. Use the Netlify API to set automatic deploy subdomainsSection titled “Use the Netlify API to set automatic deploy subdomains” You can set automatic deploy subdomains when you create a site using the Netlify API. In your createSite request, use the following query parameters to pass the values to use for the branch_deploy_custom_domain Note that when you create or update a site with an automatic deploy subdomain, the build environment variable DEPLOY_PRIME_URL will update for all relevant deploys. Learn more about DEPLOY_PRIME_URL. Custom certificate requirementsSection titled “Custom certificate requirements” If you use a custom certificate for your site’s domains, that certificate must explicitly include any new subdomains used for automatic deploy subdomains. The standard wildcard syntax, such as *.company.com, does not cover this new subdomain. For example, your custom certificate will not work as expected in this have early-access.company.com as your automatic deploy subdomain, where early-access is the optional new subdomain you added in the Netlify UI you have a custom certificate with *.company.com as your wildcard domain but not *.early-access.company.com In this scenario, you must update your certificate to include the domains *.company.com, *.early-access.company.com so that early-access.company.com will work as expected. Remove an automatic deploy subdomainSection titled “Remove an automatic deploy subdomain” To remove an automatic deploy subdomain from your Deploy Previews or branch to Domain management > Automatic deploy subdomains. Select Edit custom domains. Next to Branch deploys or Deploy Previews, clear the Add custom domain checkbox. To confirm, select Save. Last 18, 2026 PreviousBring a domain to NetlifyNextConfigure external DNS Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.228Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":4282}}56{"id":"doc-manage_dns_records_netlify_docs-88357f77","source":"documentation","title":"Manage DNS records | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/manage-dns-records/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Access your DNS records Add a DNS record Edit a DNS record Delete a DNS record Manage DNS records with the API Related resources On this page Overview Access your DNS records Add a DNS record Edit a DNS record Delete a DNS record Manage DNS records with the API Related resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Manage DNS records Copy page View as Markdown Copy as Markdown View as Markdown Manage the DNS records for domains using Netlify DNS. You can add records to connect external services like email providers, verify domain ownership, and configure subdomains. For domains using external DNS, manage your records through your DNS provider. Access your DNS recordsSection titled “Access your DNS records” To view and manage DNS records for a to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. Select the domain you want to manage DNS records for. This opens the domain's DNS panel. To expand details and view additional information, select the DNS record row. You can also download a CSV file of your DNS records by selecting Download records. Add a DNS recordSection titled “Add a DNS record” To add a new DNS your domain's DNS panel, scroll to the DNS records section. Select Add new record. Choose the record type from the dropdown menu. Fill in the required fields based on the record type you selected. Select Save to create the record. Propagation time DNS changes can take up to 48 hours to propagate across the internet, though most changes take effect within a few hours. Edit a DNS recordSection titled “Edit a DNS record” DNS records cannot be directly edited. To change a a new record with the updated values. Delete the old record. This approach prevents downtime by allowing both records to exist during the transition. Delete a DNS recordSection titled “Delete a DNS record” To delete a DNS your domain's DNS panel, find the record you want to delete in the DNS records section. Select the DNS record row to expand its details. Select Delete. Review the confirmation message and select Delete to confirm. Deleting NETLIFY records Do not delete NETLIFY or NETLIFYv6 records unless you want to disconnect your site from that domain. These records are automatically created when you assign a domain to a Netlify site. Manage DNS records with the APISection titled “Manage DNS records with the API” You can programmatically manage DNS records using the Netlify DNS records - List all records for a DNS zone Create DNS record - Add a new record Delete DNS record - Remove an existing record Related resourcesSection titled “Related resources” DNS records - Learn about supported DNS record types Set up Netlify DNS - Enable Netlify DNS for your domain Check DNS propagation - Verify your DNS changes have propagated Last 19, 2026 PreviousAssign a domain to your site appNextAutomatic deploy subdomains Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.233Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1329}}57{"id":"doc-transfer_a_domain_netlify_docs-1a54021b","source":"documentation","title":"Transfer a domain | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/transfer-a-domain/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Transfer domains between teams Transfer domains between registrars On this page Overview Transfer domains between teams Transfer domains between registrars For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Transfer a domain Copy page View as Markdown Copy as Markdown View as Markdown Netlify offers these options for transferring a domain. Transfer domains between teamsSection titled “Transfer domains between teams” To transfer domains between teams, you must be a Team or Organization Owner. If you already have a domain in your team’s DNS page, you can transfer the domain and all of its settings to any other team where you are an Owner or Developer. To do this, select the domain you wish to transfer, then go to Collaboration > Transfer ownership, near the bottom of the page. Transfer domains between registrarsSection titled “Transfer domains between registrars” Netlify cannot accept inbound domain transfer requests from other registrars. However, if you have a domain registered elsewhere, you can still take advantage of Netlify DNS by delegating your domain to Netlify. You can also transfer domain registrations and DNS zones between your teams on Netlify. Visit the domain transfer instructions for details. If you would like to transfer a Netlify-registered domain to another registrar, please contact support for assistance. Note that ICANN regulations do not permit transfers within 60 days of registration. Last 15, 2025 PreviousManage multiple domainsNextHTTPS SSL Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.234Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":965}}58{"id":"doc-troubleshoot_ssl_and_https_netlify_docs-16813ab9","source":"documentation","title":"Troubleshoot SSL and HTTPS | Netlify Docs","url":"https://docs.netlify.com/manage/domains/troubleshooting/troubleshoot-ssl-and-https/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Check your SSL certificate status Common SSL certificate issues How certificate provisioning works Troubleshooting steps Step 1 - Check DNS configuration Step 2 - Verify DNS propagation Step 3 - Advanced troubleshooting Common issues found by Let's and best practices Still need help? On this page Overview Check your SSL certificate status Common SSL certificate issues How certificate provisioning works Troubleshooting steps Step 1 - Check DNS configuration Step 2 - Verify DNS propagation Step 3 - Advanced troubleshooting Common issues found by Let's and best practices Still need help? For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Troubleshooting / Troubleshoot SSL and HTTPS Copy page View as Markdown Copy as Markdown View as Markdown Learn how to troubleshoot SSL and HTTPS issues so that your web project can be securely served over HTTPS. Check your SSL certificate statusSection titled “Check your SSL certificate status” To check your SSL certificate your Project overview dashboard, go to Domain management > HTTPS. Common SSL certificate issuesSection titled “Common SSL certificate issues” If you're finding any of these error messages or issues, this guide is designed to help you get unstuck. \"We could not provision a Let's Encrypt certificate for your custom domain\" Certificate stuck on \"Waiting on DNS propagation\" for more than 48 hours \"DNS verification failed\" when provisioning certificate \"Missing certificate\" or certificate won't provision after clicking [Provision certificate] \"Your domain doesn't appear to be served by Netlify\" \"HTTPS not working or showing 'connection not secure' warnings\" \"Certificate provisioning has been pending for over 24 hours\" If you're experiencing any of these issues, follow the troubleshooting steps below. How certificate provisioning worksSection titled “How certificate provisioning works” When you add a custom domain, Netlify automatically attempts to issue an SSL certificate. If the initial attempt fails, we retry every 10 minutes for the first 24 hours, then once every hour for the following two days. However, if a certificate isn't created within the first 24 hours, there's likely a DNS misconfiguration that needs your attention. Troubleshooting stepsSection titled “Troubleshooting steps” Step 1 - Check DNS configurationSection titled “Step 1 - Check DNS configuration” Most SSL certificate errors stem from incorrect DNS settings. Here's what to you're using external A Record for your bare domain should point to 75.2.60.5 Your CNAME record for www should have the value [sitename].netlify.app If you're using Netlify you're using Netlify name servers at your registrar or DNS provider Find your site's Netlify name servers by following this doc on finding Netlify name servers Step 2 - Verify DNS propagationSection titled “Step 2 - Verify DNS propagation” Even if your DNS settings look correct in your provider's dashboard, you need to confirm they've propagated globally. Follow the steps outlined in our Docs. For external DNSchecker.org to check your bare domain (e.g., example.com) with A record type — should return 75.2.60.5 Check your www subdomain with CNAME record type — should return [sitename].netlify.app Alternatively, use the host command in your terminal For Netlify DNSchecker.org with NS (name server) record type for your bare domain You should see your Netlify name servers listed Or run whois in your terminal which locations show your updated DNS records. You need 100% correct DNS records propagated globally before a certificate can be provisioned. If old records still exist in some locations, you'll need to wait for them to expire. Read more about propagation in this Support Guide. Step 3 - Advanced troubleshootingSection titled “Step 3 - Advanced troubleshooting” If DNS propagation looks complete but you're still getting errors, use Let's Debug to identify specific issues. To check the status of your domain in our SSL certificate provider, Let's to Let's Debug site Enter your project’s domain name. (The custom domain you want to serve over HTTPS, such as cats.com at https://cats.com.) Common issues found by Let's titled “Common issues found by Let's Debug:” Leftover AAAA records (IPv6): These often remain from previous hosting Netlify's load balancer doesn't support IPv6 all AAAA records at your domain registrar or DNS host Multiple A you added Netlify's load balancer IP (75.2.60.5), make sure you deleted any other A records Multiple A records on the apex domain will cause certificate failures only the single A record pointing to 75.2.60.5 DNSSEC DNS doesn't support DNSSEC DNSSEC at your domain registrar Use DNSViz to determine where DNSSEC is enabled CAA record records control who can provision SSL certificates for your domain If your CAA record doesn't include Let's Encrypt, certificate provisioning will fail your CAA record to allow Let's Encrypt, or remove the CAA record entirely Check CAA records using host command or DNSchecker.org Prevention and best practicesSection titled “Prevention and best practices” For a comprehensive checklist when setting up or migrating DNS, see the Netlify blog migration guide. For additional DNS troubleshooting resources, see: [Support Guide] Compiled resources for production domains on Netlify and DNS settings Still need help?Section titled “Still need help?” If you've worked through these troubleshooting steps and are still encountering issues, please reach out to Netlify Support with the following web project name (also called site name) Whether you're using External DNS or Netlify DNS A summary of the troubleshooting steps you've taken Last 21, 2026 PreviousCheck DNS propagationNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.235Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2011}}59{"id":"doc-troubleshooting_netlify_docs-51ffddb2","source":"documentation","title":"Troubleshooting | Netlify Docs","url":"https://docs.netlify.com/manage/domains/troubleshooting/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Troubleshooting / Troubleshooting Copy page View as Markdown Copy as Markdown View as Markdown You have several options for troubleshooting your domains and DNS setup. Here is a quick overview of resources to help you troubleshoot and rework your domains and DNS setup. NeedResourceDescriptionCheck your setup path and DNS configuration for most use cases.Domains & DNS WizardUse the Domains & DNS Wizard to find your setup path and DNS configuration.Check DNS propagationCheck DNS propagationUse a DNS lookup tool to check whether your DNS updates have propagated.Need specific domains and DNS troubleshooting tips?Troubleshooting tipsLearn how to troubleshoot common issues with your domains and DNS setup.Have a specific issue not covered above in enough depth?Support GuidesAsk the Netlify Support team for help.Having an issue that requires Support team assistance? (For example, help with a domain transfer).Contact SupportYou can get support help with any Netlify pricing plan.Want to search trusted sources with a specific question?Ask Netlify AIUse Ask Netlify AI to get answers based on documentation, blogs, and Support guides.Where are Netlify’s nameservers?Netlify nameserversLearn about Netlify’s nameservers and how to use them.How can I secure my domain with HTTPS?Secure my domain with HTTPSLearn how to secure your domain with HTTPS. Last 18, 2026 PreviousHTTPS SSLNextCheck DNS propagation Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.236Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":960}}60{"id":"doc-check_dns_propagation_netlify_docs-4e08012f","source":"documentation","title":"Check DNS propagation | Netlify Docs","url":"https://docs.netlify.com/manage/domains/troubleshooting/check-dns-propagation/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Use a DNS lookup tool Use the dig command On this page Overview Use a DNS lookup tool Use the dig command For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Troubleshooting / Check DNS propagation Copy page View as Markdown Copy as Markdown View as Markdown Use the following methods to confirm you have set up your DNS records correctly and that your DNS updates have propagated worldwide. Use a DNS lookup toolSection titled “Use a DNS lookup tool” Use a DNS lookup tool to check whether your DNS updates have propagated. While there are many DNS lookup tools available, you can get started using the following Google's Dig tool Use the dig commandSection titled “Use the dig command” To check whether your DNS updates have propagated, use the dig command in your terminal replacing example.com with your example.com The output will show the DNS records for your domain. If your DNS updates have propagated, you should see your Netlify DNS records in the output. Last 1, 2025 PreviousOverviewNextTroubleshoot SSL and HTTPS Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\ndig example.com\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.236Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":855}}61{"id":"doc-https_ssl_netlify_docs-d4c590f1","source":"documentation","title":"HTTPS (SSL) | Netlify Docs","url":"https://docs.netlify.com/manage/domains/secure-domains-with-https/https-ssl/","text":"Example:\n```text\npetsofnetlify.com         300  IN  CAA  0 issue \"letsencrypt.org;accounturi=https://acme-v02.api.letsencrypt.org/acme/acct/54403714\"\n```\n\nExample:\n```text\n/*  Strict-Transport-Security: max-age=63072000; includeSubDomains; preload\n```\n\nExample:\n```text\n[[headers]]  for = \"/*\"  [headers.values]    Strict-Transport-Security = '''    max-age=63072000;    includeSubDomains;    preload'''\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.237Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":3,"totalLines":16,"estimatedTokens":106}}62{"id":"doc-why_netlify_dns_netlify_docs-a12178e7","source":"documentation","title":"Why Netlify DNS | Netlify Docs","url":"https://docs.netlify.com/manage/domains/why-netlify-dns","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Netlify DNS domain support Netlify DNS key benefits External DNS key benefits Further learning On this page Overview Netlify DNS domain support Netlify DNS key benefits External DNS key benefits Further learning For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Why Netlify DNS Copy page View as Markdown Copy as Markdown View as Markdown Netlify DNS offers advanced subdomain automation and deployment features and ensures that your site uses our CDN for the apex domain as well as subdomains like www. Netlify DNS domain supportSection titled “Netlify DNS domain support” You can delegate many different types of domains to Netlify DNS, including apex domains or subdomains, which include stand-alone subdomains. For example, you can delegate a subdomain to Netlify DNS without the need to bring your apex domain to Netlify DNS. So you can delegate just docs.company.com to Netlify without bringing over company.com too. Learn more about stand-alone subdomain support. Netlify DNS key benefitsSection titled “Netlify DNS key benefits” Besides the convenience of managing your domains along with your site and app hosting, Netlify DNS offers the following SSL your repo has multiple branches all serving different content, you can have a subdomain for every single branch in your repo, and a wildcard SSL certificate will cover them all. This will happen automatically, with one click. Branch DNS allows you to set up branch deploys for each branch in your repo, which can serve as an ongoing staging environment for each branch or alternative version of your site. Standalone DNS allows you to have standalone subdomains for each branch in your repo so you can delegate docs.company.com to Netlify DNS and keep company.com delegated to another DNS provider. Custom subdomains for preview URLs (also called Automatic deploy subdomains): Netlify DNS allows you to customize subdomains for all Deploy Previews and/or for all branch deploys so you can unify your site's URLs across all branches and share deploy-preview-42.company.com instead of deploy-preview-42--mysitename.netlify.app. This ensures deploys can be \"trusted\" and in the \"allowed domain list\" for any third-party scripts or services that require this. This also allows you to use third-party services the way you do for your production site, such as auth flow services that rely on a custom domain. External DNS key benefitsSection titled “External DNS key benefits” Netlify does not allow inbound DNS zone transfers. If you have a lot of existing DNS records, it's simplest and safest to use an external DNS provider. Further learningSection titled “Further learning” \"Official Support can I receive emails on my domain?\" Last 24, 2026 PreviousSet up Netlify DNSNextTroubleshooting tips Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.238Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1278}}63{"id":"doc-manage_domains_for_deploy_previews_netlify_docs-3ddbf3de","source":"documentation","title":"Manage domains for Deploy Previews | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/manage-domains-for-deploy-previews/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Understand your domain options Default URL for Deploy Previews Custom domain for Deploy Previews Why customize? Set up custom domain for Deploy Previews On this page Overview Understand your domain options Default URL for Deploy Previews Custom domain for Deploy Previews Why customize? Set up custom domain for Deploy Previews For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Manage domains for Deploy Previews Copy page View as Markdown Copy as Markdown View as Markdown By default, Deploy Previews use the Netlify subdomain netlify.app with your site name but you can customize your Deploy Preview URL with an automatic deploy subdomain. Understand your domain optionsSection titled “Understand your domain options” You have a few options for the domain of your Deploy Preview if you use Netlify DNS. Default URL for Deploy PreviewsSection titled “Default URL for Deploy Previews” For example, Deploy Previews use a default Netlify subdomain, such as deploy-preview-#--mysitename.netlify.app, where # represents your pull or merge request. Custom domain for Deploy PreviewsSection titled “Custom domain for Deploy Previews” You can customize your Deploy Preview URL by setting up an automatic deploy subdomain, which is available with Netlify DNS. Netlify can generate a custom domain for all of your Deploy Previews and/or branch deploys when you set up an automatic deploy subdomain. Automatic deploy subdomains include a custom domain or subdomain that must be managed by Netlify DNS and an optional additional subdomain. Why customize?Section titled “Why customize?” Standardizing a custom subdomain for your Deploy Previews can unlock new ways of integrating deploys with your branding, review workflows, or security needs. We recommend automatic deploy subdomains for Core Pro plans and above with these want a custom domain for a Deploy Preview you want maximum flexibility with your custom domain to use certain tools that require a shared subdomain with your product site domain Set up custom domain for Deploy PreviewsSection titled “Set up custom domain for Deploy Previews” To set up a custom domain for your Deploy Previews, check out Automatic Deploy Subdomains. Last 1, 2025 PreviousManage domains for branch deploysNextManage multiple domains Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.238Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1159}}64{"id":"doc-domains_glossary_netlify_docs-1fbb9884","source":"documentation","title":"Domains glossary | Netlify Docs","url":"https://docs.netlify.com/manage/domains/domains-fundamentals/domains-glossary","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Apex domain Atomic deploy permalink Automatic deploy subdomain Branch deploy URL Branch subdomain Custom domain Deploy Preview URL Domain alias Domain name Domain registrar DNS provider DNS server DNS zone Netlify DNS Netlify subdomain Primary domain Production deploy URL Subdomain Top-level domain On this page Overview Apex domain Atomic deploy permalink Automatic deploy subdomain Branch deploy URL Branch subdomain Custom domain Deploy Preview URL Domain alias Domain name Domain registrar DNS provider DNS server DNS zone Netlify DNS Netlify subdomain Primary domain Production deploy URL Subdomain Top-level domain For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Domains Fundamentals / Domains glossary Copy page View as Markdown Copy as Markdown View as Markdown Learn key terms for understanding how to set up and maintain domains with Netlify and beyond. Apex domainSection titled “Apex domain” The apex domain, also known as a root, bare, or naked domain, is the yourcustomdomain.com part in the domain www.yourcustomdomain.com. Atomic deploy permalinkSection titled “Atomic deploy permalink” An atomic deploy permalink is the unique URL for a specific successful deploy. Also called a deploy permalink or permalink. Unlike the other site deploys, the web content at this URL never changes. A new deploy permalink is generated for each successful deploy of your site. For example, 1234abcd12acde000111cdef--mysitename.netlify.app is an atomic deploy. Automatic deploy subdomainSection titled “Automatic deploy subdomain” An automatic deploy subdomain is a subdomain that can be customized for all Deploy Previews and/or for all branch deploys. It can use your production site’s primary domain or a different custom domain with additional subdomains and requires Netlify DNS. Branch deploy URLSection titled “Branch deploy URL” A branch deploy URL is a URL for a branch deploy that uses your production site’s primary domain or a different custom domain with additional subdomains and requires Netlify DNS. Branch subdomainSection titled “Branch subdomain” A branch subdomain is a subdomain for a branch deploy that applies your production site’s primary domain to specified branch deploys. It can apply to an individual branch deploy or to all branches besides your production branch and requires Netlify DNS. Custom domainSection titled “Custom domain” A custom domain is a domain you can assign to a site. Deploy Preview URLSection titled “Deploy Preview URL” A Deploy Preview URL is a URL for a Deploy Preview that uses your production site’s primary domain or a different custom domain with additional subdomains and requires Netlify DNS. Domain aliasSection titled “Domain alias” A domain alias is an additional custom domain assigned to a production site. Domain nameSection titled “Domain name” A domain name (or domain for short) is the full name used to access a site, such as mysitename.netlify.app or www.yourcustomdomain.com. Domain registrarSection titled “Domain registrar” A domain registrar (or domain registration service) is a company that lets you register a domain name. DNS providerSection titled “DNS provider” A DNS provider is a company that maintains the DNS servers that translate a domain name to a destination. DNS serverSection titled “DNS server” A DNS server (or Name server) is a specialized server that translates domain names into IP addresses. DNS zoneSection titled “DNS zone” A DNS zone is used to provide information about one or more domain names. Each zone contains a list of DNS records with mappings between domain names and IP addresses. Netlify DNSSection titled “Netlify DNS” Netlify DNS is Netlify’s managed DNS service. Netlify subdomainSection titled “Netlify subdomain” A Netlify subdomain is Netlify's term for the default domain with the form [name-of-your-site].netlify.app given to each site. Primary domainSection titled “Primary domain” A primary domain is Netlify's term for the main custom domain assigned to a production site. Production deploy URLSection titled “Production deploy URL” A production deploy is a deploy made to the desiginated production branch. If you haven’t assigned a custom domain for your site, then the production deploy URL will take this SubdomainSection titled “Subdomain” A subdomain is a domain that is part of a larger domain; the only domain that is not also a subdomain is the apex domain. For example, www.yourcustomdomain.com and app.yourcustomdomain.com are subdomains of yourcustomdomain.com. Top-level domainSection titled “Top-level domain” The top-level domain is the last part of the domain name. For example, the .com part in www.yourcustomdomain.com. Last 1, 2025 PreviousRegister and buy a domainNextUnderstand domains Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.239Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1772}}65{"id":"doc-bring_a_domain_to_netlify_dns_netlify_docs-7b3a0970","source":"documentation","title":"Bring a domain to Netlify DNS | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/bring-a-domain-to-netlify","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Step custom domain to your Netlify site Step your DNS configuration Step 3: (Optional) Verify your setup On this page Overview Step custom domain to your Netlify site Step your DNS configuration Step 3: (Optional) Verify your setup For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / Bring a domain to Netlify DNS Copy page View as Markdown Copy as Markdown View as Markdown Bring an existing domain you’ve already registered to Netlify DNS and set it as a custom domain for your production site. Step custom domain to your Netlify siteSection titled “Step custom domain to your Netlify site” Go to your Site Overview dashboard in Netlify and in the left sidebar, select Domain management. Select Add domain, then Add a domain you already own. Enter your domain and select Verify. Next, confirm with Add domain. The custom domain you added will be the primary domain for your production site by default. Step your DNS configurationSection titled “Step your DNS configuration” The next steps will vary depending on your DNS provider, domain, and the DNS records you need but here is a general overview. Go to the DNS provider settings for your custom domain. Based on the custom domain you entered, you typically need to add a new DNS record for your domain. Which DNS record type? It’s important you understand the DNS record type you need. Check out your DNS provider’s documentation or our DNS reords docs for help. Select or enter the DNS record type you need, add your custom domain or subdomain. In Netlify, go to your domain dashboard for your site and select Pending DNS verification next to your custom domain. You’ll find more details there you can use to set up your custom domain. These details are customized for your domain. For example, you may find this an A record for blueberry.com pointing to our load balancer’s IP address 75.2.60.5. blueberry.com A 75.2.60.5 You can copy the value 75.2.60.5 to add to an A record in your DNS provider for blueberry.com. For more detailed help, check out Configure external DNS. Step 3: (Optional) Verify your setupSection titled “Step 3: (Optional) Verify your setup” After updating your DNS settings, you may need to wait up to 48 hours for your changes to take full effect. In the meantime, you can re-review your setup and then verify your DNS propagation is working with the dig command in your terminal. For YOUR-DOMAIN @DNS-IP-ADDRESS Or you can try a Dig lookup site like https://www.digwebinterface.com/. Last 28, 2025 PreviousAdd a domain aliasNextConfigure an automatic subdomain for deploys Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nCreate an A record for blueberry.com pointing to our load balancer’s IP address 75.2.60.5.\nblueberry.com A 75.2.60.5\n```\n\nExample:\n```text\ndig YOUR-DOMAIN @DNS-IP-ADDRESS\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.240Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":14,"estimatedTokens":1281}}66{"id":"doc-understand_domains_netlify_docs-99725634","source":"documentation","title":"Understand domains | Netlify Docs","url":"https://docs.netlify.com/manage/domains/domains-fundamentals/understand-domains","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Supported custom domains Default Netlify subdomain Example domains for deploys Custom domain examples Netlify subdomain examples On this page Overview Supported custom domains Default Netlify subdomain Example domains for deploys Custom domain examples Netlify subdomain examples For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Domains Fundamentals / Understand domains Copy page View as Markdown Copy as Markdown View as Markdown Learn the fundamentals of working with domains on Netlify. A domain name is the URL or web address where visitors find your site. To access your deploys on Netlify, you can set up a custom domain or use the default Netlify subdomain. Supported custom domainsSection titled “Supported custom domains” Custom domains allow you to make your sites accessible at your own domain names, such as www.yourcustomdomain.com or docs.example.dev. All top-level domains are supported for your custom domain. Netlify supports custom domains for your production site, Deploy Previews, and branch deploys. For your production site, Netlify supports a primary site domain, domain aliases, and domain-based redirects. For Deploy Previews, you can customize your domain after the Deploy Preview prefix deploy-preview-# with an automatic deploy subdomain. For For branch deploys, you can customize your domain after your branch name with automatic deploy subdomains or branch subdomains. For For more example custom domains, check out the chart below. Default Netlify subdomainSection titled “Default Netlify subdomain” Unless you’ve set up a basic password protection or authentication, a production site/app on Netlify is accessible from its Netlify subdomain, which takes the form [name-of-your-site].netlify.app. Note that you can change the name of your site to change this Netlify subdomain. For example, if your site is named brave-curie-12345, then by default your site is available at https://brave-curie-12345.netlify.app/. Learn more about other types of default Netlify subdomains for other types of deploys in the chart below. Example domains for deploysSection titled “Example domains for deploys” Your site deploys can have different domain patterns based on the type of site deploy. Custom domain examplesSection titled “Custom domain examples” Site deploy typeCustom domainUse caseProduction deploycompany.comCan set a primary domain for your production site.Deploy Previewdeploy-preview-42.early-access.company.comCan set a custom domain for Deploy Previews with an automatic deploy subdomain.Branch deploy for a branch named stagingBranch Automatic deploy or staging.internal-events.comCan set a custom domain for your branch deploys with an automatic deploy subdomain or branch subdomains. Netlify subdomain examplesSection titled “Netlify subdomain examples” By default, your site deploys are available at a URL using the Netlify subdomain mysitename.netlify.app. The Netlify subdomain URLs will always work even if you set up a custom domain for your site. Site deploy typeNetlify subdomainUse caseProduction deploy URLmysitename.netlify.appTypically a placeholder URL, ideal for internal development before assigning a custom domain for site visitors.Deploy Previewdeploy-preview-42--mysitename.netlify.appUnique URL for previewing and collaborating on each pull/merge request.Branch deploy for a branch named stagingstaging--mysitename.netlify.app a branch subdomain set up, the URL can be staging.yourcustomdomain.com.Long-standing URL ideal for internal testing, QA teams, and ongoing development. To set up branch deploys, check out branch deploy controls.Atomic deploy1234abcd12acde000111cdef--mysitename.netlify.appUnique URL for a specific successful deploy. Also called deploy permalinks or just permalinks. Unlike the other site deploys, the web content at this URL never changes. A new deploy permalink is generated for each successful deploy of your site. Last 1, 2025 PreviousDomains glossaryNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.241Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1578}}67{"id":"doc-add_a_domain_alias_netlify_docs-0b8780eb","source":"documentation","title":"Add a domain alias | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/add-a-domain-alias","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / Add a domain alias Copy page View as Markdown Copy as Markdown View as Markdown Ensure your site is available at all the expected domains by assigning multiple custom domains to your production site as domain aliases. You can assign multiple custom domains to the same production site. When you do this, one is designated as the primary domain, and all others are called domain aliases. We recommend assigning no more than 50 domain aliases to a site. To add a domain your site, go to your site configuration settings under Domain management > Production domains. Select Add domain alias, and follow the prompts to assign the domain to your site. Optionally, to change a domain alias to the primary domain, select the Options button next to the domain, then select Set as primary domain. Last 25, 2025 PreviousLock your domainNextBring a domain to Netlify Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.242Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":826}}68{"id":"doc-https_ssl_netlify_docs-e0be2a45","source":"documentation","title":"HTTPS (SSL) | Netlify Docs","url":"https://docs.netlify.com/manage/domains/secure-domains-with-https/https-ssl","text":"Example:\n```text\npetsofnetlify.com         300  IN  CAA  0 issue \"letsencrypt.org;accounturi=https://acme-v02.api.letsencrypt.org/acme/acct/54403714\"\n```\n\nExample:\n```text\n/*  Strict-Transport-Security: max-age=63072000; includeSubDomains; preload\n```\n\nExample:\n```text\n[[headers]]  for = \"/*\"  [headers.values]    Strict-Transport-Security = '''    max-age=63072000;    includeSubDomains;    preload'''\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.243Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":3,"totalLines":16,"estimatedTokens":106}}69{"id":"doc-static_routing_overview_netlify_docs-9999a9ce","source":"documentation","title":"Static routing overview | Netlify Docs","url":"https://docs.netlify.com/manage/routing/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Static Routing & Redirects Static Routing & Redirects Overview Custom headers Redirects Overview Redirect options Rewrites proxies Test redirects locally with Netlify CLI On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Routing / Static routing overview Copy page View as Markdown Copy as Markdown View as Markdown Routing allows you to manage the traffic to and from your Netlify site. You can enable powerful static routing features like redirects, rewrites, and proxies by defining rules in a site’s _redirects file or Netlify configuration file. As requests come in from site visitors, our CDN edge nodes evaluate these rules, pointing visitors to different paths or rewriting paths based on options or conditions like preferred language or current location. Rules can proxy an incoming request to another website or to execute a serverless function. You can also define custom headers sent in response to site requests. These are controlled in a _headers file or Netlify configuration file for each Netlify site. Build Plugins can dynamically access and modify a site’s redirects, headers, and other build configuration options during the build. Last 14, 2025 PreviousUsage and billingNextCustom headers Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.243Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":700}}70{"id":"doc-custom_headers_netlify_docs-b91f65a4","source":"documentation","title":"Custom headers | Netlify Docs","url":"https://docs.netlify.com/manage/routing/headers/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Static Routing & Redirects Static Routing & Redirects Overview Custom headers Redirects Overview Redirect options Rewrites proxies Test redirects locally with Netlify CLI On this page Overview Limitations Syntax for the _headers file Syntax for the Netlify configuration file Wildcards and placeholders in paths Multi-value headers Custom headers for different branch or deploy contexts Basic authentication headers On this page Overview Limitations Syntax for the _headers file Syntax for the Netlify configuration file Wildcards and placeholders in paths Multi-value headers Custom headers for different branch or deploy contexts Basic authentication headers For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Routing / Custom headers Copy page View as Markdown Copy as Markdown View as Markdown With custom headers, you can make custom adjustments or additions to the default HTTP headers that Netlify serves with your site when a client makes a request. You can configure custom headers for your Netlify site in two a plain text file called _headers to the publish directory of your site. You can find _headers file syntax details below. Add one or more headers tables to your Netlify configuration file. This method allows for more structured configuration and additional capabilities, as described in the Netlify configuration file syntax section below. LimitationsSection titled “Limitations” Custom headers apply only to files Netlify serves from our own backing store. If you are proxying content to your site or dealing with a URL handled by a function or edge function such as a server-side rendered (SSR) page, custom headers won’t be applied to that content. In those cases, the site being proxied to or the function should return any required headers instead. Visit our docs on edge functions to learn how to configure cache-control headers for edge functions. When you declare headers in a _headers file stored in the publish directory or a Netlify configuration file, the headers are global for all builds and cannot be scoped for specific branches or deploy contexts. However, there is a workaround you can use to set unique headers for each deploy context. You can set most HTTP response fields using custom headers. The following header names are exceptions. Custom headers for these are typically ignored because Netlify’s web servers need to set these headers to work properly. Accept-Ranges Age Allow Alt-Svc Connection Content-Encoding Content-Length Content-Range Date Location - use redirects instead Server Set-Cookie - may be overridden by Netlify cookie handling Trailer Transfer-Encoding Upgrade Setting cookies across subdomains only works for custom domains netlify.app is listed in the Mozilla Foundation’s Public Suffix List, which prevents setting cookies across subdomains. You can only set a cookie for all subdomains if your site uses a custom domain instead of mysitename.netlify.app. Syntax for the _headers fileSection titled “Syntax for the _headers file” In a _headers file, you can specify one or several URL paths with their additional headers indented below line beginning with # will be ignored as a comment. Header field names are case insensitive. Paths can contain wildcards and placeholders. Here is an example of a _headers file with two URL paths: # a path:/templates/index.html # headers for that : DENY# another path:/templates/index2.html # headers for that : SAMEORIGIN Here’s an example of setting the X-Frame-Options header for all pages on your site: /* Make sure we can access the file If you’re running a build command or site generator, the _headers file should end up in the folder you’re deploying. Some generators, like Jekyll, may also require additional configuration to avoid exclusion of files that begin with _. (For Jekyll, this requires adding an include parameter to _config.yml.) Syntax for the Netlify configuration fileSection titled “Syntax for the Netlify configuration file” If you specify your header rules in your Netlify configuration file, you can use a more structured configuration format with additional capabilities such as headers for proxy use TOML’s array of tables to specify each individual header rule. The following keywords are : the path or URL where the headers will be added. map of values to add to the response headers. Header field names are case insensitive. Paths can contain wildcards and placeholders. Here’s an example: [[headers]] for = \"/*\" [headers.values] X-Frame-Options = \"DENY\" Wildcards and placeholders in pathsSection titled “Wildcards and placeholders in paths” Whether you declare headers in a dedicated _headers file or using the [[headers]] section of netlify.toml, you can take advantage of wildcards and placeholders in URL path (*) can be used at any place inside of a path segment to match any character. Placeholders (:placeholders) can only be used at the start of a path segment to match any character except /. Wildcards and placeholders cannot be within the same path segment. For example, /templates/:placeholder* won’t work as the wildcard is considered part of the placeholder name. /templates/*:placeholder won’t work as the placeholder needs to be at the beginning of the path segment, right after the /. Note that Netlify processes wildcards and placeholders in redirects differently than those used in headers. Learn more about the options and limitations for wildcards in splats and placeholders in the redirect options doc. Multi-value headersSection titled “Multi-value headers” Some header fields can accept multiple values. In a _headers file, you can configure multi-value headers by listing multiple headers with the same field name. Netlify will concatenate the values of those headers into a single header as described in the RFC 7230. For example, you can include several cache-control header fields in the file, like this: /* =0 In a netlify.toml, multi-value headers are expressed with multiline strings: [[headers]] for = \"/*\" [headers.values] cache-control = ''' max-age=0, no-cache, no-store, must-revalidate''' In both cases, the values will be collapsed into one header following the HTTP 1.1 : max-age=0,no-cache,no-store,must-revalidate Custom headers for different branch or deploy contextsSection titled “Custom headers for different branch or deploy contexts” By default, when you declare headers in a _headers file stored in the publish directory or in a Netlify configuration file (netlify.toml), the headers are global for all builds and cannot be scoped for specific branches or deploy contexts. To set custom headers for a specific branch or deploy any global header declarations from netlify.toml and, if you have one, remove the _headers file from the publish directory. Create a new custom directory to store your deploy context-specific header files, such as /custom-headers. Create header files for each custom configuration you require and store them in the custom directory. While you can use any file name for each custom file, the files must still follow the syntax for headers files outlined above. In netlify.toml, modify the build command for each deploy context that requires headers. Add the following script to the end of the build command: && cp path-to-your-header-file path-to-your-publish-dir/_headers When the build command for the deploy context runs, Netlify will copy the custom header file to a new file named _headers in the publish directory for use. For example, if the custom headers folder is custom-headers and you want to apply a specific header file _stagingHeaders to your staging branch deploys, you would add the following to your netlify.toml: # Configuration for branch deploys for the branch named `staging`.# Remember to replace `npm run build` with your site's build command# and replace `dist` with your site's publish directory.[context.staging] command = \"npm run build && cp ./custom-headers/_stagingHeaders ./dist/_headers\" Note that in this example, the site uses npm run build as the build command and dist as the publish directory. You should replace those with the appropriate values for your site. Basic authentication headersSection titled “Basic authentication headers” This feature is available on all Pro and Enterprise plans. You can configure Netlify to provide basic authentication headers on paths you want to hide behind a password. Visit the basic authentication page for more information. Last 1, 2025 PreviousOverviewNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# a path:/templates/index.html  # headers for that path:  X-Frame-Options: DENY# another path:/templates/index2.html  # headers for that path:  X-Frame-Options: SAMEORIGIN\n```\n\nExample:\n```text\n/*  X-Frame-Options: DENY\n```\n\nExample:\n```text\n[[headers]]  for = \"/*\"  [headers.values]    X-Frame-Options = \"DENY\"\n```\n\nExample:\n```text\n/*  cache-control: max-age=0  cache-control: no-cache  cache-control: no-store  cache-control: must-revalidate\n```\n\nExample:\n```text\n[[headers]]  for = \"/*\"  [headers.values]  cache-control = '''  max-age=0,  no-cache,  no-store,  must-revalidate'''\n```\n\nExample:\n```text\ncache-control: max-age=0,no-cache,no-store,must-revalidate\n```\n\nExample:\n```text\n# Configuration for branch deploys for the branch named `staging`.# Remember to replace `npm run build` with your site's build command# and replace `dist` with your site's publish directory.[context.staging]  command = \"npm run build && cp ./custom-headers/_stagingHeaders ./dist/_headers\"\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.244Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":7,"totalLines":38,"estimatedTokens":2750}}71{"id":"doc-redirects_and_rewrites_netlify_docs-845648e8","source":"documentation","title":"Redirects and rewrites | Netlify Docs","url":"https://docs.netlify.com/manage/routing/redirects/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Static Routing & Redirects Static Routing & Redirects Overview Custom headers Redirects Overview Redirect options Rewrites proxies Test redirects locally with Netlify CLI On this page Overview Syntax for the _redirects file Syntax for the Netlify configuration file Rule processing order On this page Overview Syntax for the _redirects file Syntax for the Netlify configuration file Rule processing order For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending conditions = {Language = [\"en\"], Country = [\"US\"], Role = [\"admin\"]} ## This rule redirects to an external API, signing requests with a secret[[redirects]] from = \"/search\" to = \"https://api.mysearch.com\" status = 200 force = true # that we always redirect headers = {X-From = \"Netlify\"} signed = \"API_SIGNATURE_TOKEN\" Visit the redirect options doc for more details on configuration options including placeholders, trailing slashes, and more. Check out the rewrites and proxies doc for details on rewrite-specific options. Rule processing orderSection titled “Rule processing order” The redirects engine will process the first matching rule it finds, reading from top to bottom. Rules in the _redirects file are always processed first, followed by rules in the Netlify configuration file. The following example uses _redirects file syntax: # This rule will trigger at /blog/my-old-title/blog/my-old-title /blog/my-new-title # This rule will never trigger because the previous rule triggers first/blog/my-old-title /blog/an-even-better-title Note that for each request, Netlify processes edge functions before redirects. For more information, visit our docs about the edge function declaration processing order. Last 14, 2025 PreviousCustom headersNextRedirect options Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# Redirects from what the browser requests to what we serve/home                //blog/my-post.php    /blog/my-post/news                /blog/cuties              https://www.petsofnetlify.com/authors/c%C3%A9line /authors/about-c%C3%A9line\n```\n\nExample:\n```text\n[[redirects]]  from = \"/old-path\"  to = \"/new-path\"  status = 301  force = false  query = {path = \":path\"}  conditions = {Language = [\"en\"], Country = [\"US\"], Role = [\"admin\"]}\n## This rule redirects to an external API, signing requests with a secret[[redirects]]  from = \"/search\"  to = \"https://api.mysearch.com\"  status = 200  force = true # COMMENT: ensure that we always redirect  headers = {X-From = \"Netlify\"}  signed = \"API_SIGNATURE_TOKEN\"\n```\n\nExample:\n```text\n# This rule will trigger at /blog/my-old-title/blog/my-old-title   /blog/my-new-title\n# This rule will never trigger because the previous rule triggers first/blog/my-old-title   /blog/an-even-better-title\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.245Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":20,"estimatedTokens":1036}}72{"id":"doc-forms_usage_and_billing_netlify_docs-69e23a04","source":"documentation","title":"Forms usage and billing | Netlify Docs","url":"https://docs.netlify.com/manage/forms/usage-and-billing/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Forms Forms Setup Submissions Notifications Spam filters Troubleshooting tips Usage and billing On this page Overview For credit-based plans For legacy pricing plans Change levels More usage and billing resources On this page Overview For credit-based plans For legacy pricing plans Change levels More usage and billing resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Forms / Forms usage and billing Copy page View as Markdown Copy as Markdown View as Markdown Forms billing is metered differently depending on the type of plan you have. For credit-based plansSection titled “For credit-based plans” For credit-based plans, Forms are free and unlimited. Learn more in Billing FAQ for credit-based plans. For legacy pricing plansSection titled “For legacy pricing plans” You can check your Forms service usage under Forms > Usage and configuration > Usage. This shows your current usage level and tracks your usage of the following : This counts the total number of verified form submissions across all forms on your site during this billing period. File tracks the total storage size of all files uploaded through verified form submissions to your site during the current billing period. For legacy plans, forms pricing is metered on a per-site basis and scales with usage. [placeholder to legacy pricing plans] For paid plans, Forms pricing is metered on a per-site basis and scales with usage. When usage reaches a level limit, the site will automatically upgrade to the next level or package. Free tier accounts are also metered based on usage and have a limit. Change levelsSection titled “Change levels” Any team member with the ability to change the configuration for your site can also change levels for services on that site. To do this, go to Forms > Usage and configuration > Usage, and select Change level. Level fees will be prorated and charged at the end of the billing cycle, to the team’s payment method. More usage and billing resourcesSection titled “More usage and billing resources” Billing FAQ for legacy plans Billing for legacy plans Last 14, 2026 PreviousTroubleshooting tipsNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.246Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":917}}73{"id":"doc-redirect_options_netlify_docs-0f94eb5b","source":"documentation","title":"Redirect options | Netlify Docs","url":"https://docs.netlify.com/manage/routing/redirects/redirect-options/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Static Routing & Redirects Static Routing & Redirects Overview Custom headers Redirects Overview Redirect options Rewrites proxies Test redirects locally with Netlify CLI On this page Overview HTTP status codes Custom 404 page handling Force redirects Splats Placeholders Query parameters Trailing slash Domain-level redirects Redirect by country or language Redirect by role Redirect by cookie presence On this page Overview HTTP status codes Custom 404 page handling Force redirects Splats Placeholders Query parameters Trailing slash Domain-level redirects Redirect by country or language Redirect by role Redirect by cookie presence For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending Last 17, 2025 PreviousOverviewNextRewrites proxies Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# Redirect with a 301/home         /              301\n# Redirect with a 302/my-redirect  /              302\n# Show a custom 404 for this path/ecommerce    /store-closed  404\n# Rewrite a path/pass-through /index.html    200\n```\n\nExample:\n```text\n# Redirect with a 301[[redirects]]from = \"/home\"to = \"/\"status = 301\n# Redirect with a 302[[redirects]]from = \"/my-redirect\"to = \"/\"status = 302\n# Show a custom 404 for this path[[redirects]]from = \"/ecommerce\"to = \"/store-closed\"status = 404\n# Rewrite a path[[redirects]]from = \"/pass-through\"to = \"/index.html\"status = 200\n```\n\nExample:\n```text\n/en/* /en/404.html 404/de/* /de/404.html 404\n```\n\nExample:\n```text\n[[redirects]]from = \"/en/*\"to = \"/en/404.html\"status = 404\n[[redirects]]from = \"/de/*\"to = \"/de/404.html\"status = 404\n```\n\nExample:\n```text\n/best-pets/dogs  /best-pets/cats.html 200!\n```\n\nExample:\n```text\n[[redirects]]from = \"/best-pets/dogs\"to = \"/best-pets/cats.html\"status = 200force = true\n```\n\nExample:\n```text\n/news/*  /blog/:splat\n```\n\nExample:\n```text\n[[redirects]]from = \"/news/*\"to = \"/blog/:splat\"\n```\n\nExample:\n```text\n# This will redirect /jobs/customer-ninja-rockstar/jobs/customer-ninja-rockstar  /careers/support-engineer\n# This will redirect all paths under /jobs except the path above/jobs/*                        /careers/:splat\n# This will never trigger, because the rule above will trigger first/jobs/outdated-job-link        /careers/position-filled\n```\n\nExample:\n```text\n# This will redirect /jobs/customer-ninja-rockstar[[redirects]]from = \"/jobs/customer-ninja-rockstar\"to = \"/careers/support-engineer\"\n# This will redirect all paths under /jobs except the path above[[redirects]]from = \"/jobs/*\"to = \"/careers/:splat\"\n# This will never trigger, because the rule above will trigger first[[redirects]]from = \"/jobs/outdated-job-link\"to = \"/careers/position-filled\"\n```\n\nExample:\n```text\n/news/:month/:date/:year/:slug  /blog/:year/:month/:date/:slug\n```\n\nExample:\n```text\n/store id=:id  /blog/:id  301\n```\n\nExample:\n```text\n/articles id=:id tag=:tag /posts/:tag/:id 301\n```\n\nExample:\n```text\n# Both values - ordering from the browser doesn’t matter; this will cover either./path/* param1=:value1 param2=:value2 /otherpath/:value1/:value2/:splat 301\n# One value or the other.  Must match exactly./path/* param1=:value1 /otherpath/:value1/:splat 301/path/* param2=:value2 /otherpath/:value2/:splat 301\n# Base case, when no params are passed.# Our system forwards all query params to the /otherpath URL if this is the only rule.# Otherwise it matches all requests not matched in a prior rule for the same path such as the ones above./path/* /otherpath/:splat 301\n```\n\nExample:\n```text\n# These rules are effectively the same:# either rule alone would trigger on both paths/blog/title-with-a-typo    /blog/typo-free-title/blog/title-with-a-typo/   /blog/typo-free-title\n# This rule will cause an infinite redirect# because the paths are effectively the same/blog/remove-my-slashes/   /blog/remove-my-slashes  301!\n```\n\nExample:\n```text\n# http and https need separate rules if you don’t force_ssl!http://blog.yoursite.com/* https://www.yoursite.com/blog/:splat 301!https://blog.yoursite.com/* https://www.yoursite.com/blog/:splat 301!\n\n# other URLS might proxy or redirect offsitehttps://frontend.yoursite.com/login/* https://backend.yoursite.com/:splat 200\n```\n\nExample:\n```text\n# Redirect users in Australia or New Zealand to /anz.# There CANNOT be spaces in the last parameter: Country=x,y,z or Language=xx,yy/  /anz     302  Country=au,nz# Redirect users in Israel to /israel/  /israel  302  Country=il\n# Redirect users with Hebrew language preference from /israel to /israel/he/israel/*  /israel/he/:splat  302  Language=he\n```\n\nExample:\n```text\n/products /en-us/products 301! Language=en-us/products /en/products 301! Language=en\n```\n\nExample:\n```text\n# Forward requests to /legacy if the browser sends a cookie# named `is_legacy` or `my_other_cookie`/* /legacy/:splat 200 Cookie=is_legacy,my_other_cookie\n```\n\nExample:\n```text\n# Forward requests to /legacy if the browser sends a cookie# named `is_legacy` or `my_other_cookie`[[redirects]]from = \"/*\"to = \"/legacy/:splat\"status = 200conditions = {Cookie = [\"is_legacy\",\"my_other_cookie\"]}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.248Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":20,"totalLines":120,"estimatedTokens":1611}}74{"id":"doc-rewrites_and_proxies_netlify_docs-724d3604","source":"documentation","title":"Rewrites and proxies | Netlify Docs","url":"https://docs.netlify.com/manage/routing/redirects/rewrites-proxies/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Static Routing & Redirects Static Routing & Redirects Overview Custom headers Redirects Overview Redirect options Rewrites proxies Test redirects locally with Netlify CLI On this page Overview Limitations History pushState and single-page apps Shadowing Proxy to another service Custom headers in proxy redirects Signed proxy redirects Proxy to another Netlify site On this page Overview Limitations History pushState and single-page apps Shadowing Proxy to another service Custom headers in proxy redirects Signed proxy redirects Proxy to another Netlify site For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending Custom headers apply to the request, not the response If you are proxying content to your site, custom headers will not be applied to that content. Signed proxy redirectsSection titled “Signed proxy redirects” You can use a JSON Web Signature (JWS) to sign all proxy requests to an external URL. To enable JWS on your requests, Netlify requires a secret token. You can set the token in your site’s environment variables and indicate the variable name as the signed value in the redirect rule. Note that if you have the option to set specific scopes for your environment variables, the scope must include Runtime to be available for signed proxy redirects. Netlify will inject the environment variable value automatically, so you don’t need to take extra steps to substitute the variable value in the configuration file. Once proxy redirects are added, Netlify will send the JWS as an HMAC HS256 encoded x-nf-sign header to another, non-Netlify website with every proxied request. Signed proxy redirects must be specified in the Netlify configuration file. [[redirects]] from = \"/search\" to = \"https://api.mysearch.com\" status = 200 force = true signed = \"API_SIGNATURE_TOKEN_PLACEHOLDER\" The JSON document we sign with this JWS header has this format: { \"deploy_context\": \"production\", \"exp\": 1623876755, \"iss\": \"netlify\", \"netlify_id\": \"1be0f471-6532-45ff-b1b1-f9c66ea24dc1\", \"site_url\": \"https://mysitename.netlify.app\"} Signed proxy redirects for external sites only When proxying from one Netlify application to another, using JWS to sign requests isn’t supported. Proxy to another Netlify siteSection titled “Proxy to another Netlify site” With internal rewrites, you can proxy from one Netlify site to another. If you want to proxy to another Netlify site, we recommend using the site’s .netlify.app subdomain instead of the custom domain in your rewrite rule: /netlify-site/* https://my-other-site.netlify.app/:splat 200 Last 14, 2025 PreviousRedirect optionsNextTest redirects locally with Netlify CLI Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n/*  /index.html  200\n```\n\nExample:\n```text\n[[redirects]]  from = \"/*\"  to = \"/index.html\"  status = 200\n```\n\nExample:\n```text\n/app/*  /app/index.html  200!\n```\n\nExample:\n```text\n/best-pets/dogs  /best-pets/cats.html 200!\n```\n\nExample:\n```text\n/api/*  https://api.example.com/:splat  200\n```\n\nExample:\n```text\n[[redirects]]  from = \"/search\"  to = \"https://api.mysearch.com\"  status = 200  force = true  headers = {X-From = \"Netlify\"}\n```\n\nExample:\n```text\n[[redirects]]  from = \"/search\"  to = \"https://api.mysearch.com\"  status = 200  force = true  signed = \"API_SIGNATURE_TOKEN_PLACEHOLDER\"\n```\n\nExample:\n```text\n{  \"deploy_context\": \"production\",  \"exp\": 1623876755,  \"iss\": \"netlify\",  \"netlify_id\": \"1be0f471-6532-45ff-b1b1-f9c66ea24dc1\",  \"site_url\": \"https://mysitename.netlify.app\"}\n```\n\nExample:\n```text\n/netlify-site/*  https://my-other-site.netlify.app/:splat  200\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.249Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":9,"totalLines":48,"estimatedTokens":1245}}75{"id":"doc-add_domain_redirect_netlify_docs-4238c340","source":"documentation","title":"Add domain redirect | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/add-domain-redirect/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Add domain redirect Copy page View as Markdown Copy as Markdown View as Markdown Add a domain redirect to your site so that you can keep visitor traffic to the correct domain. If you have multiple domains assigned to your site, you can redirect visitors between them or add other custom redirect and rewrite rules based on the domain entered into the browser by your visitors. For more information, visit the docs on domain-level redirects. For additional help in setting up domains redirects, check out these forums old domain to new one Official Support guide on making redirects work Last 15, 2025 PreviousOverviewNextAssign a domain to your site app Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.249Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":775}}76{"id":"doc-manage_domains_for_a_site_or_app_netlify_docs-838ab8c5","source":"documentation","title":"Manage domains for a site or app | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/manage-domains-for-a-site-app/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Manage production domains from the Netlify UI Manage domains for a site Review domains for a team Review a domain’s DNS records Review a domain’s Netlify name servers Manage domains from the API On this page Overview Manage production domains from the Netlify UI Manage domains for a site Review domains for a team Review a domain’s DNS records Review a domain’s Netlify name servers Manage domains from the API For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Manage domains for a site or app Copy page View as Markdown Copy as Markdown View as Markdown Manage domains for a site or app from the Netlify UI or the Netlify API. Manage production domains from the Netlify UISection titled “Manage production domains from the Netlify UI” As a Developer, you can review domains for a team and add or change domains for a site. As an Owner, you can transfer domains between teams you own, or delete DNS records. Manage domains for a siteSection titled “Manage domains for a site” You can find the domains for your production site at Domain management > Production domains. You have several options for managing multiple domains for your production site. To manage domains for an individual site or to your site or app dashboard. Select Domain management from the left sidebar. Select the domain you want to manage. Review domains for a teamSection titled “Review domains for a team” To find a list of domains available to your to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. You’ll find a list of your domains available to your team’s sites. Note that some of these domains may not be assigned to a site yet. For more help reviewing DNS records, check out our docs on Managing DNS records. Review a domain’s DNS recordsSection titled “Review a domain’s DNS records” If applicable, you can check out a domain’s DNS records from your domain dashboard. Go to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. You'll find a list of all domains connected to your team account that are managed by Netlify DNS. To expand DNS records, select a domain from the list. For more help reviewing DNS records, check out our docs on Managing DNS records. Review a domain’s Netlify name serversSection titled “Review a domain’s Netlify name servers” Check out our docs at Netlify name servers. Manage domains from the APISection titled “Manage domains from the API” Check out the Netlify API reference for DNS endpoints for more information on managing domains from the API. You can find the domains associated with your site in the Domain management section of your site configuration. Last 19, 2026 PreviousAutomatic deploy subdomainsNextManage domains for branch deploys Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.250Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1309}}77{"id":"doc-set_up_preview_server_for_content_sites_netlify_-89bd7b74","source":"documentation","title":"Set up Preview Server for content sites | Netlify Docs","url":"https://docs.netlify.com/manage/preview-servers/set-up-preview-server-for-content-sites","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Preview Servers Preview Servers Overview Manage a Preview Server Set up Preview Server for content sites On this page Overview Step app/site locally 1. Run locally with the CLI 2. Confirm latest content renders locally Step your environment variables Step up content refresh 1. Add a refresh endpoint to your site 2. Add a webhook On this page Overview Step app/site locally 1. Run locally with the CLI 2. Confirm latest content renders locally Step your environment variables Step up content refresh 1. Add a refresh endpoint to your site 2. Add a webhook For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending https://api.netlify.com/dev_server_hooks/... Last 14, 2025 PreviousManage a Preview ServerNextSetup Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\ncurl -X POST -d {} https://api.netlify.com/dev_server_hooks/...\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.250Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":563}}78{"id":"doc-manage_domains_overview_netlify_docs-c40e60b8","source":"documentation","title":"Manage domains overview | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Manage domains overview Copy page View as Markdown Copy as Markdown View as Markdown Manage domains that you’ve already registered or bought and customize how your domains are assigned to your site or app deploys. You have many options for managing domains in the Netlify UI. Note that using Netlify DNS gives you even more options. Learn the basics of using the Netlify UI to manage your domains whether or not you're using Netlify a domain to your site or app Manage DNS records Add domain redirect Manage multiple domains Transfer a domain Customize automated domains for Deploy Previews and branch deploys Automatic deploy subdomains Manage domains for branch deploys Manage domains for Deploy Previews Last 18, 2026 PreviousUnderstand domainsNextAdd domain redirect Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.251Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":804}}79{"id":"doc-compare_preview_options_netlify_docs-f1b99307","source":"documentation","title":"Compare preview options | Netlify Docs","url":"https://docs.netlify.com/deploy/compare-preview-options/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview Preview options Preview URLs On this page Overview Preview options Preview URLs For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Compare preview options Copy page View as Markdown Copy as Markdown View as Markdown Compare preview options to choose the right preview for your workflow, stakeholders, and review needs. Different deployments can offer different preview experiences and other options. There are also preview options that are not a deployment on Netlify that you may find helpful in certain cases or at certain points of your workflow. Preview optionsSection titled “Preview options” Preview optionAccessStarts fromOptimized forDeploy PreviewAnyone with Preview URL unless you’re protecting deploysPull request, merge request, agent runReviewing and sharing changes from a pull request, merge request, or agent runBranch deployAnyone with Preview URL unless you’re protecting deploysBranchSteady set of batched changes, such as for an early releaseLocal developmentYouTerminalConfirming code works for framework, solo developmentPreview ServerNetlify teamPreview ServerLive content updates shared between developer & content stakeholders Preview URLsSection titled “Preview URLs” Preview optionPreview URLDeploy PreviewFor previews built from pull/merge ://deploy-preview-1234--my-site.netlify.app For previews built from agent ://agent-69a6140cc823ebba94b8ef32--my-site.netlify.appBranch deployhttps://branch-1234--my-site.netlify.appLocal developmentDepends on your framework. For example, an Astro site can be http://localhost:4321/.Preview Serverhttps://devserver-branchname--my-site.netlify.app Last 30, 2026 PreviousDeploy overviewNextProduction deploy Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.251Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":896}}80{"id":"doc-protect_deploys_netlify_docs-d9412913","source":"documentation","title":"Protect deploys | Netlify Docs","url":"https://docs.netlify.com/deploy/protect-deploys/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview Project visibility Password protection Web traffic rules Rate limiting On this page Overview Project visibility Password protection Web traffic rules Rate limiting For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Protect deploys Copy page View as Markdown Copy as Markdown View as Markdown Control who can access your deploys on Netlify with project visibility, password protection, visitor access controls, Netlify team-based restrictions, blocking web traffic, and more. Project visibilitySection titled “Project visibility” This feature is available on Credit-based Free, Personal, and Pro plans only. On a Free and Personal plan, private projects can only be seen by the Team Owner. On Pro plans, you can add unlimited team members to your project or team to view a project. You can control who can access your project's deploys by making the project private, so that only logged-in members of your Netlify team can view it. If your team has private by default enabled, new projects start private, unless you change the visibility setting. This includes previews, which stay private unless you change the preview visibility setting. You can set visibility defaults at the team level or adjust them per project, with separate settings for production deploys and previews. On Pro plans, you can invite unlimited team members to view a private project's deploys. Learn more in our project visibility docs. Password protectionSection titled “Password protection” You can control who can access your project's deploys by requiring a password. Learn more at our Password Protection docs. Web traffic rulesSection titled “Web traffic rules” You can control who can access your project's deploys by setting up Firewall Traffic Rules. Set a rule to limit access based on a web visitor’s: IP address Country Subregion Learn more at our Firewall Traffic Rules docs. Rate limitingSection titled “Rate limiting” You can control who can access your project's deploys by setting up rate limiting. Learn more at our Rate Limiting docs. Last 28, 2026 PreviousManage deploysNextDeploy notifications Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.252Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1000}}81{"id":"doc-deploy_notifications_netlify_docs-0cc3d5e7","source":"documentation","title":"Deploy notifications | Netlify Docs","url":"https://docs.netlify.com/deploy/deploy-notifications/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview Slack notifications Email notifications HTTP Post Request Payload signature GitHub commit statuses GitHub pull request comments GitHub commit checks GitLab commit statuses GitLab merge request comments Troubleshoot GitLab deploy notifications GitLab deploy notifications stop working Bitbucket notifications Bitbucket commit statuses Bitbucket pull request comments Azure DevOps notifications Azure DevOps commit statuses Azure DevOps pull request comments Notifications for monorepos or repositories building multiple apps Zapier integrations n8n integrations On this page Overview Slack notifications Email notifications HTTP Post Request Payload signature GitHub commit statuses GitHub pull request comments GitHub commit checks GitLab commit statuses GitLab merge request comments Troubleshoot GitLab deploy notifications GitLab deploy notifications stop working Bitbucket notifications Bitbucket commit statuses Bitbucket pull request comments Azure DevOps notifications Azure DevOps commit statuses Azure DevOps pull request comments Notifications for monorepos or repositories building multiple apps Zapier integrations n8n integrations For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending decoded = JWT.decode(signature, \"your signature secret\", true, options) ## decoded : ## [ ## { sha256: \"...\" }, # this is the data in the token ## { alg: \"...\" } # this is the header in the token ## ] decoded.first[:sha256] == Digest::SHA256.hexdigest(body)rescue JWT::DecodeError falseend post \"/netlify-hook\" do body = request.body.read halt 403 unless signed(request, body) json = JSON.parse(body) # do something with the notification payload hereend If your project uses Node.js with Express for backend, you need to compare the incoming request data before it’s transformed to crypto from \"crypto\";import jwt from \"jsonwebtoken\";import express from \"express\"; const app = express(); // parse body and keep the raw contentsapp.use( bodyParser.json({ verify: (req, res, buffer, encoding) => { req.rawBody = buffer; } })); app.post(\"/\", (req, res) => { const signature = req.headers['x-webhook-signature']; const isValid = validateSignature(signature, req.rawBody); res.send(isValid);}); app.listen(3000); const secret = \"your signature secret\"; function validateSignature(token, buffer) { const options = { issuer: \"netlify\", algorithms: [\"HS256\"] }; const decoded = jwt.verify(token, secret, options); const hashedBody = crypto.createHash(\"sha256\").update(buffer).digest(\"hex\"); return decoded.sha256 === hashedBody;} GitHub commit statusesSection titled “GitHub commit statuses” This type of notification sets commit status directly in your GitHub pull requests and commit lists. For successful deploys, this will include a link to the Deploy Preview. For failed deploys, this will include a link to the detail page for the deploy where you can examine the deploy log and deploy the latest branch commit. These notifications are added to all new GitHub-connected Netlify sites by default. You can add, remove, or edit them in Project configuration > Notifications > Deploy notifications. The settings include a field for a custom message, which will replace the “Deploy preview ready!” message that displays by default. GitHub pull request commentsSection titled “GitHub pull request comments” This type of notification adds a comment to your GitHub pull requests indicating the status of the associated deploy and providing a link to the Deploy Preview when ready. If you append more commits to a pull request, this notification will update the comment to indicate status changes. GitHub pull request comment notifications are added to all new GitHub-connected Netlify sites by default. You can add, remove, or edit them in Project configuration > Notifications > Deploy notifications. The settings include a field for a custom message, which will replace the “Deploy preview ready!” message that displays by default. GitHub commit checksSection titled “GitHub commit checks” This type of notification adds rich deploy information from your deploy summary to your GitHub pull requests and commit lists. This includes more detailed information in the Checks tab of your pull requests on GitHub. These notifications are added to all new GitHub-connected Netlify sites by default. You can add, remove, or edit them in Project configuration > Notifications > Deploy notifications. If you don’t find the option for GitHub commit checks in the Add notification menu, you will need to configure your site to use the Netlify GitHub App. GitLab commit statusesSection titled “GitLab commit statuses” Personal access token (PAT) required If your deploy notifications stop working, you may need to add a GitLab PAT to Netlify. Learn more at our Troubleshoot GitLab notifications docs. This type of notification creates commit statuses in your GitLab repositories. You can configure this notification through the Netlify UI using your GitLab personal access token (PAT). Your PAT must have the api scope. Learn more in GitLab’s PAT docs. You can add, remove, or edit access in Project configuration > Notifications > Deploy notifications. GitLab merge request commentsSection titled “GitLab merge request comments” Personal access token (PAT) required If your deploy notifications stop working, you may need to add a GitLab PAT to Netlify. Learn more at our Troubleshoot GitLab notifications docs. This type of notification adds a comment to your GitLab merge requests indicating the status of the associated deploy and providing a link to the Deploy Preview when ready. If you append more commits to a merge request, this notification will update the comment to indicate status changes. You can configure this notification through the Netlify UI using your GitLab personal access token (PAT). Your PAT must have the api scope. Learn more in GitLab’s PAT docs. You can add, remove, or edit access in Project configuration > Notifications > Deploy notifications. Troubleshoot GitLab deploy notificationsSection titled “Troubleshoot GitLab deploy notifications” If you set up your GitLab deploy notifications with a GitLab API access token, you’ll need to edit your notifications settings in the Netlify UI and add a GitLab personal access token (PAT). GitLab 15.0 no longer supports OAuth tokens without an expiration date and introduced a 2-hour expiration window. Learn more about expiring tokens in GitLab’s OAuth docs. Use Git Gateway or collaborative Deploy Previews? Your connection to GitLab for these features may also be impacted by the GitLab 15.0 update. Learn more about how to resolve these issues for Git Gateway or collaborative Deploy Previews. GitLab deploy notifications stop workingSection titled “GitLab deploy notifications stop working” If your GitLab deploy notifications stop working, ensure that you are using a GitLab personal access token (PAT) with the right scopes. On GitLab, generate a new GitLab PAT with the api scope. Learn more in GitLab’s PAT docs. On Netlify, add your GitLab PAT for each desired deploy notification at Project configuration > Notifications > Deploy notifications. Bitbucket notificationsSection titled “Bitbucket notifications” Deploy notifications for Bitbucket allow your team to check out the latest deploy status and Deploy Preview from Bitbucket. Bitbucket commit statusesSection titled “Bitbucket commit statuses” This type of notification sets commit statuses directly in your Bitbucket branches, pull requests, and commit lists. For successful deploys, this will include a link to the Deploy Preview. For failed deploys, this will include a link to the detail page for the deploy where you can examine the deploy log and deploy the latest branch commit. Bitbucket pull request commentsSection titled “Bitbucket pull request comments” This type of notification adds a comment to your Bitbucket pull requests with a Deploy Preview link and deploy status. This comment automatically updates with any new commits to your pull request. Azure DevOps notificationsSection titled “Azure DevOps notifications” Deploy notifications for Azure DevOps allow your team to check out the latest deploy status and Deploy Preview from Azure DevOps. Azure DevOps commit statusesSection titled “Azure DevOps commit statuses” This type of notification adds a Netlify Deploy Preview link to the Commit details page for successfully deployed commits. To set up this notification, you must create an Azure DevOps personal access token (PAT) with & write permissions. Once you have a PAT, configure the notification on Netlify. Go to Project configuration > Notifications > Deploy notifications, select Azure DevOps commit status, and add your PAT. Once configured, you can open a Deploy Preview for a commit with a successful build. To open a Deploy Preview from Azure DevOps, go to the Commit details page, and select the succeeded build status for the desired commit. Azure DevOps pull request commentsSection titled “Azure DevOps pull request comments” This type of notification adds a comment to your Azure DevOps pull requests with a Deploy Preview link and deploy status. This comment automatically updates with any new commits to your pull request. To set up this notification, you must create an Azure DevOps personal access token (PAT) with & write permissions. Once you have a PAT, configure this notification on Netlify. Go to Project configuration > Notifications > Deploy notifications, select Azure DevOps pull request comment, and add your PAT. Notifications for monorepos or repositories building multiple appsSection titled “Notifications for monorepos or repositories building multiple apps” For monorepos or setups where one repository builds multiple applications, you can manage the amount of commit status and commit check notifications for sites linked from GitHub or GitLab. This team-level setting works in tandem with deploy notifications configured individually for each site. Check out our monorepo docs to learn more. Zapier integrationsSection titled “Zapier integrations” Netlify is available on Zapier, where you can connect Netlify with over 1,000 other applications. You can use Zapier “Zaps” to trigger an action in another service on every successful deploy or when a deploy does not complete. You can find out more on our blog, or use one of the templates below to get new Netlify deployments in Status Hero Netlify + Status Hero Use this Zap Make ServiceNow records from new Netlify deploy failures Netlify + ServiceNow Use this Zap Plant trees with Ecologi when new deploys in Netlify succeed Ecologi + Netlify Use this Zap n8n integrationsSection titled “n8n integrations” Netlify is available on n8n, an open source tool that allows you to connect Netlify with other applications. By using one of n8n’s Netlify nodes, you can create your own automated workflow. To get started, you can use the Netlify node, Netlify Trigger node, or you can use the existing workflow notification when deployment fails Netlify Trigger Node Use workflow Last 18, 2026 PreviousProtect deploysNextHeads up display Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nrequire \"digest\"require \"jwt\"require \"sinatra\"\ndef signed(request, body)  signature = request[\"X-Webhook-Signature\"]  return unless signature\n  options = {iss: \"netlify\", verify_iss: true, algorithm: \"HS256\"}  decoded = JWT.decode(signature, \"your signature secret\", true, options)\n  ## decoded :  ## [  ##   { sha256: \"...\" }, # this is the data in the token  ##   { alg: \"...\" } # this is the header in the token  ## ]  decoded.first[:sha256] == Digest::SHA256.hexdigest(body)rescue JWT::DecodeError  falseend\npost \"/netlify-hook\" do  body = request.body.read  halt 403 unless signed(request, body)\n  json = JSON.parse(body)  # do something with the notification payload hereend\n```\n\nExample:\n```text\nimport crypto from \"crypto\";import jwt from \"jsonwebtoken\";import express from \"express\";\nconst app = express();\n// parse body and keep the raw contentsapp.use(  bodyParser.json({    verify: (req, res, buffer, encoding) => {      req.rawBody = buffer;    }  }));\napp.post(\"/\", (req, res) => {  const signature = req.headers['x-webhook-signature'];  const isValid = validateSignature(signature, req.rawBody);  res.send(isValid);});\napp.listen(3000);\nconst secret = \"your signature secret\";\nfunction validateSignature(token, buffer) {  const options = { issuer: \"netlify\", algorithms: [\"HS256\"] };  const decoded = jwt.verify(token, secret, options);  const hashedBody = crypto.createHash(\"sha256\").update(buffer).digest(\"hex\");  return decoded.sha256 === hashedBody;}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.254Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":24,"estimatedTokens":3595}}82{"id":"doc-fix_a_failed_deploy_netlify_docs-d47dd314","source":"documentation","title":"Fix a failed deploy | Netlify Docs","url":"https://docs.netlify.com/resources/troubleshooting/fix-a-failed-deploy/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Troubleshooting Troubleshooting Overview Ask Netlify Fix a failed deploy Error reference Request chain Page not found error guide Troubleshooting FAQ Support Guides Support scope Support On this page Overview How these solution suggestions work Enable solution suggestions Disable solution suggestions More troubleshooting help On this page Overview How these solution suggestions work Enable solution suggestions Disable solution suggestions More troubleshooting help For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Troubleshooting / Fix a failed deploy Copy page View as Markdown Copy as Markdown View as Markdown Netlify’s AI capabilities help diagnose and suggest solutions for deploy failures or build errors so you can get back to shipping code. How these solution suggestions workSection titled “How these solution suggestions work” When a deployment failure happens, your team will find a Why did it fail? button on the failed deploy summary page. This button always appears on failed deploys unless an Owner has disabled the feature for your team. If this feature is enabled for your team and you select the Why did it fail? button, the details about the failure are processed by Netlify’s AI systems to generate guidance for how to resolve the issue. We’re continuously improving the feature to suggest accurate solutions but your team should review them for accuracy. Security for solution suggestionsSection titled “Security for solution suggestions” This feature does not use the information processed to train models or store data outside of Netlify’s systems. The deploy failure details used to generate suggestions subsection of the build log entries in your deploy log at or around the place where the error returns. other metadata, such as the name of your site’s framework to provide more accurate results. Like all Netlify features, usage of this capability is subject to our service agreements referenced in the Terms of Use. Enable solution suggestionsSection titled “Enable solution suggestions” These AI capabilities are only available if they have been enabled for your team. Once enabled, any Developer or Owner on your team can use this AI capability to generate solutions for resolving deploy failures on all sites they have access to in your team. Who can turn this feature on or can enable or disable this feature for their team. Developers can enable this feature for their team unless an Owner has disabled this feature for the team. The Why did it fail? button appears to Developers and Owners unless the feature is disabled. If a Developer selects the Why did it fail? button and the feature is not enabled or disabled for the team, then a prompt appears to enable this feature for the team. Until this feature is enabled on the team, selecting this button will not process the deploy failure details or generate suggestions. As an Owner, to enable deploy failure solution your team, go to Team settings > General > AI enablement Select Configure. Choose Enabled. Disable solution suggestionsSection titled “Disable solution suggestions” Once disabled, the Why did it fail? button will not appear on any of your team’s sites. Only an Owner can enable deploy diagnostics for all sites in your team after the feature is disabled. As an Owner, to disable deploy failure solution your team, go to Team settings > General > AI enablement Select Configure. Choose Disabled. More troubleshooting helpSection titled “More troubleshooting help” Verified Support Guide on using the log to debug your build process Build troubleshooting tips Last 14, 2025 PreviousAsk NetlifyNextError reference Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.256Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1292}}83{"id":"doc-overview_netlify_docs-0ffd9a05","source":"documentation","title":"Overview | Netlify Docs","url":"https://docs.netlify.com/extend/develop-and-share/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Develop & share Develop & share Overview Develop extensions and integrations Develop build plugins Share build plugins On this page Overview Framework adapters General extensions Build plugins On this page Overview Framework adapters General extensions Build plugins For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Develop And Share / Overview Copy page View as Markdown Copy as Markdown View as Markdown As a developer extending Netlify, you can add on to the Netlify platform in several ways— whether it’s for your own use or something you want to make available to others. Extensions vs. integrations You may find resources that use the terms \"extension\" or \"integrations\" interchangably.Generally, the term \"extension\" refers to artifacts created using the Netlify SDK that extend the Netlify platform, while \"integration\" can signal two systems coming together and are possibly not made with the Netlify SDK.Extensions have the following ownership and supported by Netlify or one of our technology partners. Community and supported by customers and other third parties. Framework adaptersSection titled “Framework adapters” If you are a framework author, you can integrate with Netlify using the Frameworks API. Use the API to build a framework adapter and define how a framework deploys sites to Netlify. General extensionsSection titled “General extensions” For all other use cases, we recommend using the Netlify SDK to create an extension. An extension can integrate with other systems, add on to the Netlify platform, or both. For example, you may develop an extension that renders a configuration form in the Netlify UI and uses the input values to connect to and sync data from a content management system to Netlify Connect. You can develop an extension that does the logic during the build-deploy lifecycle for a site Build pluginsSection titled “Build plugins” You can also create a build plugin to extend the functionality of the Netlify Build process but we recommend you use the updated Netlify SDK to create extensions instead. Last 11, 2025 PreviousStripe ProjectsNextDevelop extensions and integrations Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.256Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":918}}84{"id":"doc-troubleshoot_the_netlify_drawer_netlify_docs-eef4d327","source":"documentation","title":"Troubleshoot the Netlify Drawer | Netlify Docs","url":"https://docs.netlify.com/deploy/review-deploys/netlify-drawer-for-feedback/troubleshoot-the-netlify-drawer/","text":"Example:\n```text\n/*  Content-Security-Policy: frame-src 'self' app.netlify.com;\n```\n\nExample:\n```text\n[[headers]]  for = \"/*\"  [headers.values]    Content-Security-Policy = \"frame-src 'self' app.netlify.com;\"\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.257Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":2,"totalLines":11,"estimatedTokens":57}}85{"id":"doc-develop_extensions_and_integrations_netlify_docs-87d19619","source":"documentation","title":"Develop extensions and integrations | Netlify Docs","url":"https://docs.netlify.com/extend/develop-and-share/develop-extensions-and-integrations/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Develop & share Develop & share Overview Develop extensions and integrations Develop build plugins Share build plugins On this page Overview General extensions On this page Overview General extensions For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Develop And Share / Develop extensions and integrations Copy page View as Markdown Copy as Markdown View as Markdown Develop your own extensions and other integrations for use with Netlify. General extensionsSection titled “General extensions” For all other use cases, we recommend using the Netlify SDK to create an extension. An extension can integrate with other systems, add on to the Netlify platform, or both. For example, you may develop an extension that renders a configuration form in the Netlify UI and uses the input values to connect to and sync data from a content management system to Netlify Connect. You can develop an extension that does the logic during the build-deploy lifecycle for a site injects serverless functions and edge functions into a site syncs data from a data source to Netlify Connect authenticates users with an OAuth identity provider creates bespoke extension UI surfaces for your users that we’ll render in the Netlify UI Refer to the Netlify SDK docs to learn how to develop, test, and publish an extension for Netlify. If you’re interested in becoming a partner and collaborating with us on a project to extend Netlify, contact us through our technology partner program. Last 18, 2025 PreviousOverviewNextDevelop build plugins Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.258Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":766}}86{"id":"doc-building_code_agents_overview_netlify_docs-d1762848","source":"documentation","title":"Building code agents overview | Netlify Docs","url":"https://docs.netlify.com/extend/building-code-agents/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Building code agents Building code agents Overview APIs for code agents Become AI partner On this page Overview Benefits of deploying to Netlify Designed for AI workflows API-first architecture Simplified rapid scaling Agent building resources On this page Overview Benefits of deploying to Netlify Designed for AI workflows API-first architecture Simplified rapid scaling Agent building resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Building Code Agents / Building code agents overview Copy page View as Markdown Copy as Markdown View as Markdown If you’re building code agents, assistants, or other AI tools, you can give your customers and agents a better experience and more capabilities by working with Netlify. Benefits of deploying to NetlifySection titled “Benefits of deploying to Netlify” The benefits of deploying to Netlify friction deployments that don’t require users to have Netlify accounts to start Global CDN (content delivery network) so projects stay fast on our infrastructure Custom domain support Secret scanning management Enterprise-grade security If you become an official AI partner, we can also rate limits (we don’t slow you down when growth hits). Help from our best-in-class support for fraud and abuse detection and mitigation. Access to engineering support focused on supporting partners leveraging Netlify to deploy websites. Co-marketing to celebrate and showcase your offerings. Designed for AI workflowsSection titled “Designed for AI workflows” Netlify is designed to support AI workflows, which means you can give your customers and agents more capabilities by working with Netlify. API-first architectureSection titled “API-first architecture” Netlify’s API-first approach allows AI tools to programmatically create, configure, and deploy sites without friction. While most platforms were built primarily for human workflows, Netlify’s architecture naturally accommodates both human developers and AI agents. This architecture translates to the agents can create new sites with unique configurations in seconds Build settings, environment variables, and domain rules can be programmatically defined Deployment build logs can be fed back to AI systems to improve future builds For help with building AI tools, agents, and AI workflows, check out our docs on APIs for code agents. Simplified rapid scalingSection titled “Simplified rapid scaling” Netlify is also designed to simplify rapid scaling. For example, when Bolt needed to scale from hundreds to millions of deployments, our infrastructure handled the growth without requiring complex DevOps expertise. Our edge network to handle traffic spikes without intervention Delivers content from 100+ global points of presence Responds in under 50ms to users worldwide Manages billions of requests with reliable performance Agent building resourcesSection titled “Agent building resources” Get help building your code agents and AI workflows with the following for code agents Becoming an AI partner Netlify Support Netlify & Agent experience Build a MCP Server on Netlify Last 1, 2025 PreviousShare build pluginsNextAPIs for code agents Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.258Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1172}}87{"id":"doc-share_build_plugins_netlify_docs-61bdb08b","source":"documentation","title":"Share Build Plugins | Netlify Docs","url":"https://docs.netlify.com/extend/develop-and-share/share-build-plugins/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Develop & share Develop & share Overview Develop extensions and integrations Develop build plugins Share build plugins On this page Overview Publish to npm On this page Overview Publish to npm For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Develop And Share / Share Build Plugins Copy page View as Markdown Copy as Markdown View as Markdown If you’d like to share your plugin with others, you can publish it to npm. All Netlify Build Plugins in the npm Public Registry can be installed by any Netlify user through file-based installation. Publish to npmSection titled “Publish to npm” To publish a Build Plugin to npm, follow npm’s documentation for contributing packages to the registry. Be sure to add the following properties to your plugin’s package.json should start with netlify-plugin- (such as netlify-plugin-example or @scope/netlify-plugin-example). It should match the plugin name field. It is recommended for the plugin repository to be named like this as well. keywords should contain the netlify and netlify-plugin keywords. The same applies to GitHub topics. This helps users find your plugin. repository and bugs should be defined. Those are displayed to users when an error occurs inside your plugin. Last 14, 2025 PreviousDevelop build pluginsNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.259Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":706}}88{"id":"doc-troubleshoot_the_netlify_drawer_netlify_docs-eb80c73a","source":"documentation","title":"Troubleshoot the Netlify Drawer | Netlify Docs","url":"https://docs.netlify.com/deploy/review-deploys/netlify-drawer-for-feedback/troubleshoot-the-netlify-drawer","text":"Example:\n```text\n/*  Content-Security-Policy: frame-src 'self' app.netlify.com;\n```\n\nExample:\n```text\n[[headers]]  for = \"/*\"  [headers.values]    Content-Security-Policy = \"frame-src 'self' app.netlify.com;\"\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.259Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":2,"totalLines":11,"estimatedTokens":57}}89{"id":"doc-supabase_integration_netlify_docs-1cca2349","source":"documentation","title":"Supabase integration | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/setup-guides/supabase-integration/","text":"Example:\n```text\nimport { createClient } from \"@supabase/supabase-js\";import { Database } from \"./database.types\";\nconst supabase = createClient<Database>(  process.env.SUPABASE_DATABASE_URL,  process.env.SUPABASE_ANON_KEY);\n```\n\nExample:\n```text\nimport { createClient } from \"@supabase/supabase-js\";\nconst supabase = createClient(  process.env.SUPABASE_DATABASE_URL,  process.env.SUPABASE_ANON_KEY);\n```\n\nExample:\n```text\nimport { createClient } from \"@supabase/supabase-js\";import { Database } from \"./database.types\";\nconst supabase = createClient<Database>(  process.env.NEXT_PUBLIC_SUPABASE_URL,  process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY);\n```\n\nExample:\n```text\nimport { createClient } from \"@supabase/supabase-js\";\nconst supabase = createClient(  process.env.NEXT_PUBLIC_SUPABASE_URL,  process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY);\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.260Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":4,"totalLines":25,"estimatedTokens":214}}90{"id":"doc-planetscale_integration_netlify_docs-c97274b1","source":"documentation","title":"PlanetScale integration | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/setup-guides/planetscale-integration/","text":"Example:\n```text\nnpm install @netlify/planetscale @planetscale/database\n```\n\nExample:\n```text\nimport connection from \"@netlify/planetscale\";\nexport default async (req: Request) => {\n  const { email, name } = await req.json();\n  await connection.execute(\"INSERT INTO users (email, name) VALUES (?, ?)\", [    email,    name,  ]);\n  return new Response(\"User created\", { status: 201 })};\n```\n\nExample:\n```text\nnpm install netlify-cli -g\n```\n\nExample:\n```text\nnetlify dev\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.260Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":4,"totalLines":25,"estimatedTokens":122}}91{"id":"doc-netlify_email_integration_netlify_docs-fa3fa5e8","source":"documentation","title":"Netlify Email Integration | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/setup-guides/email-integration/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Install & use Install & use Overview Extensions and integrations Build plugins Setup guides Netlify App for Slack Netlify Email integration Auth0 Contentful integration GPT action LaunchDarkly integration Optimizely Edge Delivery PlanetScale integration Supabase integration Stripe Projects On this page Overview Before you begin Supported email providers Enable Netlify Email Integration for your site Enable with the Netlify UI Enable with netlify.toml Required environment variables Add email templates Add a template file Add HTML to the template Style the template Create a template with MJML Preview email templates Send a test email from the Preview UI Trigger an email from your code Create a function to send the email Call the function from an event Add attachments to your email Limitations On this page Overview Before you begin Supported email providers Enable Netlify Email Integration for your site Enable with the Netlify UI Enable with netlify.toml Required environment variables Add email templates Add a template file Add HTML to the template Style the template Create a template with MJML Preview email templates Send a test email from the Preview UI Trigger an email from your code Create a function to send the email Call the function from an event Add attachments to your email Limitations For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending </h1> <p>We hope you enjoy our super simple emails!</p> <p>Thanks for subscribing!</p> </body></html> Style the templateSection titled “Style the template” You can also add custom styling to your templates. To do this, add inline CSS blocks using the style attribute inside the HTML elements of your template file. <html> <body style=\" font-family: 'Open Sans', 'Helvetica Neue', sans-serif; auto; \" > <div style=\" \" > <h1>{{name}} has RSVP'd</h1> <button style=\"border-radius: 10px;\"> Visit dashboard </button> </div> </body></html> Create a template with MJMLSection titled “Create a template with MJML” The Netlify Email Integration supports templates created with MJML. MJML enables you to create templates that are responsive and compliant across most browsers. To create an email template using MJML, save your template file as index.mjml instead of index.html. Visit the MJML documentation to learn more about styling your template. Preview email templatesSection titled “Preview email templates” You can preview your email templates during the development process by launching the Preview UI. The Preview UI generates the template-specific code snippets you’ll need to send a request to the email handler when you trigger the email. Use the Netlify CLI to launch the Preview UI and generate this code. Ensure you have the latest version of Netlify CLI windownpm install netlify-cli -g Build your project. Terminal windownetlify build Launch Netlify Dev to start a development environment that can run your email windownetlify dev Visit http://localhost:8888/.netlify/functions/emails to launch the Preview UI. The preview endpoint is not available in production and is only made available locally through Netlify Dev. Select your email template from the template list. Send a test email from the Preview UISection titled “Send a test email from the Preview UI” When you launch the preview, you can send a test email directly from the Preview UI. To trigger the test the email template you plan to test from the available templates. Optionally, enter any parameters you’d like to preview. Select Send test email. Enter your subject, to, and from parameters. Select Send, which will send the email from your email provider. Trigger an email from your codeSection titled “Trigger an email from your code” When you preview your email template, Netlify generates two code snippets that you can use to trigger an email: @netlify/emails: snippet that utilizes a package that contains the raw fetch route and an environment variable To trigger an email directly from your project code, copy and paste your preferred snippet into your project and populate the parameters for your email. Create a function to send the emailSection titled “Create a function to send the email” Because the snippet generated in the preview contains an environment variable, NETLIFY_EMAILS_SECRET, we recommend pasting the code snippet into a Netlify Function to avoid sharing sensitive information in client-side code. You can learn more about the format of functions on the get started with functions. The function file should be in your netlify/functions directory. Following the fetch code example below, this example file’s path would be netlify/functions/triggerSubscribeEmail.ts. import type { Handler } from \"@netlify/functions\";import fetch from \"node-fetch\"; const = async function(event) { if (event.body === null) { return { , (\"Payload required\"), }; } const requestBody = JSON.parse(event.body) as { }; //automatically generated snippet from the email preview //sends a request to an email handler for a subscribed email await fetch(`${process.env.URL}/.netlify/functions/emails/subscribed`, { headers: { \"netlify-emails-secret\": process.env.NETLIFY_EMAILS_SECRET as string, }, method: \"POST\", ({ , , subject: \"You've been subscribed\", parameters: { , , }, }), }); return { , (\"Subscribe email sent!\"), };}; export { handler }; Next, you'll add an event in your code to call this function. Call the function from an eventSection titled “Call the function from an event” There are many approaches you can take to triggering an email. For user clicks a button requesting information, subscribing to a newsletter, or updating their profile. A user scrolls to the bottom of a blog post so you trigger an email to send them more information on that post subject or other posts. A data event has reached a certain amount and you would like an email sent to notify your users. Here’s an example of the code to attach the email trigger to a Subscribe button in a Next.js app. In this React example, the parameters for the template are set using user input from the form on the page. With this process, you can populate the parameters of your email templates with any data being passed to your site, like a form or data from API calls to a user database. export default function Subscribe() { const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => { event.preventDefault(); const target = event.target as typeof event.target & { name: { }; email: { }; }; const data = { , }; //call to the Netlify Function you created fetch(\"./.netlify/functions/triggerSubscribeEmail\", { method: \"POST\", ({ , , inviteeEmail: \"info@netlify.com\" }) }); }; return ( <div className=\"subscribe-form-container\"> <form onSubmit={handleSubmit}> <label htmlFor=\"name\">Name</label> <input type=\"text\" id=\"name\" name=\"name\" required /> <label htmlFor=\"email\">Email</label> <input type=\"text\" id=\"email\" name=\"email\" required /> <button type=\"submit\">Subscribe</button> </form> </div> );} When the event is triggered, this invokes the function and the fetch call to an email handler. This handler prompts the email API service you configured to send the email. Add attachments to your emailSection titled “Add attachments to your email” When sending messages, you can also specify any files you’d like to attach. Make sure any files you plan to attach to an email are included when the function that sends the email is built and deployed. For example, to attach a PDF file saved in an assets directory, the project file structure could include a section like this: ├─ netlify/│ └─functions/│ └─ function.js│ └─ assets/│ └─ example.pdf└─package.json In this example, any PDF files in the assets directory would be included with the function using this netlify.toml entry: [functions][function.\"function\"] included_files = [\"./nelify/functions/assets/*.pdf\"] You can learn more in our blog post about including files in serverless functions. Using the snippet generated during the email preview, add the attachments property to the request body. The attachments property is an array that may contain three properties to attach your , filename, and type. Property NameTypeDescriptionRequiredcontentstringBase64 encoded string of the fileYesfilenamestringThe name of the file as it will appear in the emailYestypestringThe MIME type of content you are attachingYes, if Postmark Using the example project setup above, the following handler function parses the PDF file saved in the assets directory. Nested in the body object is an attachments array that lists the content, filename, and type properties for that file. import type { Handler } from \"@netlify/functions\";import fetch from \"node-fetch\";import {readFileSync} from \"fs\";import {resolve} from \"path\"; const = async () => { const file = readFileSync(resolve(\"./assets/example.pdf\"), \".\").toString(\"base64\"); const response = await fetch( `${process.env.URL}/.netlify/functions/emails/forgotten-password`, { headers: { \"netlify-emails-secret\": process.env.NETLIFY_EMAILS_SECRET, }, method: \"POST\", ({ from: \"sender@myemailsender.com\", cc: \"recipient@youremail.com\", to: \"recipient@youremail.com\", subject: \"Password Reset\", attachments: [ { , filename: \"example.pdf\", type: \"pdf\", } ], parameters: { name: \"Test\", } }) } ); const responseBody = await response.json(); return ( , (responseBody) );}; export { handler }; Refer to your email provider’s documentation to verify which types of content are valid for an attachment. Mailgun Postmark Sendgrid LimitationsSection titled “Limitations” Functions that call other functions on password-protected sites will get an error when calling the next function. If you’re using a password-protected site, you’ll likely receive a 401 error from your function that calls the email function. To avoid receiving this error, you need to forward the cookie from the initial function on to the email function. Here is an example of a workaround for this cookie = event.headers[\"Cookie\"] || event.headers[\"cookie\"]; // Send netlify email with fetch const response = await fetch( `${process.env.URL}/.netlify/functions/emails/the-template-name`, { method: \"POST\", headers: { cookie, \"netlify-emails-secret\": process.env.NETLIFY_EMAILS_SECRET as string, }, Last 14, 2025 PreviousNetlify App for SlackNextAuth0 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n[[plugins]]  package = \"@netlify/plugin-emails\"\n```\n\nExample:\n```text\nrepository-root or base directory/├─ emails/│  └─ subscribed/│   └─ index.html└─\n```\n\nExample:\n```text\n<html>  <body>    <h1>Welcome, {{name}}</h1>    <p>We hope you enjoy our super simple emails!</p>    <p>Thanks for subscribing!</p>  </body></html>\n```\n\nExample:\n```text\n<html>  <body    style=\"      font-family: 'Open Sans', 'Helvetica Neue', sans-serif;      margin: 0 auto;    \"  >    <div      style=\"        background-color: white;        display: inline-block;        text-align: center;      \"    >      <h1>{{name}} has RSVP'd</h1>      <button style=\"border-radius: 10px;\">        Visit dashboard      </button>    </div>  </body></html>\n```\n\nExample:\n```text\nnpm install netlify-cli -g\n```\n\nExample:\n```text\nnetlify build\n```\n\nExample:\n```text\nnetlify dev\n```\n\nExample:\n```text\nimport type { Handler } from \"@netlify/functions\";import fetch from \"node-fetch\";\nconst handler: Handler = async function(event) {  if (event.body === null) {    return {      statusCode: 400,      body: JSON.stringify(\"Payload required\"),    };  }\n  const requestBody = JSON.parse(event.body) as {    subscriberName: string;    subscriberEmail: string;    inviteeEmail: string;  };\n  //automatically generated snippet from the email preview  //sends a request to an email handler for a subscribed email  await fetch(`${process.env.URL}/.netlify/functions/emails/subscribed`, {    headers: {      \"netlify-emails-secret\": process.env.NETLIFY_EMAILS_SECRET as string,    },    method: \"POST\",    body: JSON.stringify({      from: requestBody.inviteeEmail,      to: requestBody.subscriberEmail,      subject: \"You've been subscribed\",      parameters: {        name: requestBody.subscriberName,        email: requestBody.subscriberEmail,      },    }),  });\n  return {    statusCode: 200,    body: JSON.stringify(\"Subscribe email sent!\"),  };};\nexport { handler };\n```\n\nExample:\n```text\nexport default function Subscribe() {  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {    event.preventDefault();    const target = event.target as typeof event.target & {      name: { value: string };      email: { value: string };    };\n    const data = {      subscriberName: target.name,      subscriberEmail: target.email    };    //call to the Netlify Function you created    fetch(\"./.netlify/functions/triggerSubscribeEmail\", {      method: \"POST\",      body: JSON.stringify({        subscriberName: data.subscriberName,        subscriberEmail: data.subscriberEmail,        inviteeEmail: \"info@netlify.com\"      })    });  };  return (    <div className=\"subscribe-form-container\">      <form onSubmit={handleSubmit}>        <label htmlFor=\"name\">Name</label>        <input type=\"text\" id=\"name\" name=\"name\" required />        <label htmlFor=\"email\">Email</label>        <input type=\"text\" id=\"email\" name=\"email\" required />        <button type=\"submit\">Subscribe</button>      </form>    </div>  );}\n```\n\nExample:\n```text\n├─ netlify/│  └─functions/│   └─ function.js│   └─ assets/│     └─ example.pdf└─package.json\n```\n\nExample:\n```text\n[functions][function.\"function\"]  included_files = [\"./nelify/functions/assets/*.pdf\"]\n```\n\nExample:\n```text\nimport type { Handler } from \"@netlify/functions\";import fetch from \"node-fetch\";import {readFileSync} from \"fs\";import {resolve} from \"path\";\nconst handler: Handler = async () => {  const file = readFileSync(resolve(\"./assets/example.pdf\"), \".\").toString(\"base64\");  const response = await fetch(    `${process.env.URL}/.netlify/functions/emails/forgotten-password`,    {      headers: {        \"netlify-emails-secret\": process.env.NETLIFY_EMAILS_SECRET,      },      method: \"POST\",      body: JSON.stringify({        from: \"sender@myemailsender.com\",        cc: \"recipient@youremail.com\",        to: \"recipient@youremail.com\",        subject: \"Password Reset\",        attachments: [            {            content: file,            filename: \"example.pdf\",            type: \"pdf\",          }        ],        parameters: {          name: \"Test\",        }      })    }  );\n  const responseBody = await response.json();\n  return (    statusCode: response.status,    body: JSON.stringify(responseBody)  );};\nexport { handler };\n```\n\nExample:\n```text\nconst cookie = event.headers[\"Cookie\"] || event.headers[\"cookie\"];\n  // Send netlify email with fetch  const response = await fetch(    `${process.env.URL}/.netlify/functions/emails/the-template-name`,    {      method: \"POST\",      headers: {        cookie,        \"netlify-emails-secret\": process.env.NETLIFY_EMAILS_SECRET as string,      },\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.263Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":13,"totalLines":79,"estimatedTokens":4085}}92{"id":"doc-extensions_and_integrations_netlify_docs-9e2d4dbd","source":"documentation","title":"Extensions and integrations | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/extensions-and-integrations","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Install & use Install & use Overview Extensions and integrations Build plugins Setup guides Netlify App for Slack Netlify Email integration Auth0 Contentful integration GPT action LaunchDarkly integration Optimizely Edge Delivery PlanetScale integration Supabase integration Stripe Projects On this page Overview Add on to your Netlify site Extension types Available extensions Install an extension Uninstall an extension Other integrations, apps, and tools On this page Overview Add on to your Netlify site Extension types Available extensions Install an extension Uninstall an extension Other integrations, apps, and tools For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Install And Use / Extensions and integrations Copy page View as Markdown Copy as Markdown View as Markdown Expand the capabilities of your site with extensions and integrations available through Netlify. Whether you need to sync data from a content management system (CMS), start a site from a template, or add authentication using a third-party service, Netlify can help you connect to and install solutions. Add on to your Netlify siteSection titled “Add on to your Netlify site” Discover new tools for your site under Extensions in the Netlify UI. In the Directory, you will find extensions published by Netlify, our official partners, and members of the community. Netlify reviews and approves all extensions before we list them in the directory. You can also select Created by your team to find private extensions that your team owns. You might also be able to access an extension through a direct link. If the extension has a private or unlisted badge, the extension is available for use but please note that Netlify has not reviewed it. Make sure to review the author, extension code, and documentation carefully before proceeding. You can also get started with a template with built-in extensions to get up and running faster. Extension typesSection titled “Extension types” There are two categories of extensions in the : extensions built and supported by Netlify or one of our technology partners. You can find documentation for extensions built by Netlify on this docs site and get support for them through Netlify’s official support channels. For support with extensions built by partners, please refer to each extension’s details page for links to documentation and support channels. built by other members of the community. The author is responsible for providing documentation and support for these extensions. For all extensions, you can find high-level documentation along with links to more details and contact information on the extension’s details page in the Netlify UI. Private and unlisted extensions are not reviewed by Netlify As a Netlify user, you may encounter links to extensions that aren’t listed in the extensions directory — identified through a private or unlisted badge. Netlify does not review private and unlisted extensions. You can install and use these extensions on your team but we recommend that you review the author, code, and documentation carefully before you begin. Available extensionsSection titled “Available extensions” The following extensions are available now through the extensions directory in the Netlify UI. Official extensions built by NetlifySection titled “Official extensions built by Netlify” Async Workloads Auth0 by Okta Content Security Policy Contentful integration LaunchDarkly integration Optimizely Edge Delivery extension PlanetScale integration Stripe Projects Supabase integration Turso Official extensions built by our partnersSection titled “Official extensions built by our partners” You can find the following official extensions built by Netlify partners in the Extensions DigitalOcean Jamsocket LambdaTest Nile Squid Cloud Community extensionsSection titled “Community extensions” Search for community extensions by navigating to Extensions in the Netlify UI. Searching for something else? Along with the above extensions, we offer a number of other integrations, apps, and tools that you can install and use with your sites. These aren’t listed in the extensions directory but are available through other parts of the Netlify platform. Install an extensionSection titled “Install an extension” Team Owners can install extensions. In the Netlify UI, navigate to your team’s Extensions page. Search for the extension you wish to install and select it. On the extension’s detail page, select Install. Once installed on your team, follow the extension’s documentation to configure it for your individual sites. Uninstall an extensionSection titled “Uninstall an extension” Team Owners can uninstall extensions. Note that uninstalling an extension will impact any projects that use that extension. In the Netlify UI, navigate to your team’s Extensions page. Select Installed. Find the extension you wish to uninstall and select it. Navigate to the Danger zone section on the extension’s detail page, and then select Uninstall this extension. Other integrations, apps, and toolsSection titled “Other integrations, apps, and tools” Along with the above extensions, there are a number of other options available for expanding the functionality of your sites on the Netlify platform. These include integrations, plugins, apps, and templates. Follow the links below to learn how to install and configure these options for your teams and Source Interface (CSI) modules for Visual DatoCMS Git CMS Sanity Email Integration GPT action Netlify App for Slack Netlify Build Plugins Lighthouse build plugin Netlify Templates Last 29, 2026 PreviousOverviewNextBuild plugins Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.264Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1789}}93{"id":"doc-get_started_with_netlify_visual_editor_netlify_d-cdd125c4","source":"documentation","title":"Get started with Netlify Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/get-started/get-started-overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Setup pathways Visual Editor Support Requirements Site repository requirements Content source requirements Example template sites Troubleshooting help On this page Overview Setup pathways Visual Editor Support Requirements Site repository requirements Content source requirements Example template sites Troubleshooting help For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Get Started / Get started with Netlify Visual Editor Copy page View as Markdown Copy as Markdown View as Markdown Get started with the Netlify Visual Editor by choosing your setup path and checking that your site meets the requirements to use the visual editor. Netlify Visual Editor is an environment for content editors to work with structured content in a visual way. It is designed for composable architectures, and is compatible with any site framework and API-enabled content source. The visual editor is optimized for giving Developers the most flexibility in setting up a visual editing environment and custom workflow for a Content team. This allows Content editors and other custom roles to build new pages with ease and publish content in a streamlined workflow. Learn more about how the visual editor works or learn as you go by getting started. Setup pathwaysSection titled “Setup pathways” There are several ways to start setting up the visual editor. We recommend you set up in different ways based on what you are optimizing for. Optimizing forSite TypeSetup guideFastest way to try out visual editor experience on Netlify with new siteNew site using a pre-configured templateVisual Editor QuickstartConfiguring more than one content source & advanced customizationAn existing site or new template siteSet up visual editor locallyExisting sites deployed on Netlify with simpler customizationExisting sitesVisual editor walkthrough setup guide After your initial setup of the visual editor, we recommend you customize the visual editor for your site and workflow needs. Learn more in the customize editing experience docs. Visual Editor Support RequirementsSection titled “Visual Editor Support Requirements” For the most success getting visual editing working for your site, you should have the framework that runs a development server on a local port using Node.js v16 or later. Content stored in a supported headless CMS or in individual content files separated from code. If your site doesn't meet these requirements, you can likely still get visual editing working with additional code and configuration. Contact us for help. Site repository requirementsSection titled “Site repository requirements” When you set up the visual editor for your site you need to have access to the site repository, including the remote site repository once your site is deployed to Netlify. The visual editor only supports site repository syncing from these Git providers at this BitBucket Your site repository also needs a unique working branch for visual editor changes. The default working branch is preview. Content source requirementsSection titled “Content source requirements” If using an API-based CMS, you must also have a user account with read and write access to that content source. If using file-based content, the content must be defined by a schema that the visual editor can understand. This requires adding content modeling properties to your visual editor configuration file. We'll cover a bit on configuration later in this guide. Learn more about how Visual Editor works with structured content. Example template sitesSection titled “Example template sites” Explore a template site pre-configured for visual editing. Consider starting with the quickstart or local setup guide for a template site that is closer to your site’s needs. Site repositoryContent sourceOptimized forContentOps StarterGit CMS- learning about content types with over 35 content types - try more complex content type scenariosAuto-annotated portfolioGit CMS- learning about auto annotating your site - lots of auto annotated components Troubleshooting helpSection titled “Troubleshooting help” For help getting the visual editor setup, check out troubleshoot visual editor setup. Last 6, 2026 PreviousVisual editor overviewNextVisual editor quickstart Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.264Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1726}}94{"id":"doc-spam_filters_netlify_docs-faf5ede7","source":"documentation","title":"Spam filters | Netlify Docs","url":"https://docs.netlify.com/manage/forms/spam-filters/","text":"Example:\n```text\n<form  name=\"contact\"  method=\"POST\"  netlify-honeypot=\"bot-field\"  data-netlify=\"true\">  <p class=\"hidden\">    <label>      Don’t fill this out if you’re human: <input name=\"bot-field\" type=\"text\" />    </label>  </p>  <p>    <label>      Email: <input type=\"text\" name=\"email\" />    </label>  </p>  <p>    <label>      Message: <textarea name=\"message\"></textarea>    </label>  </p>  <p>    <button type=\"submit\">Send</button>  </p></form>\n```\n\nExample:\n```text\n<form  name=\"contact\"  method=\"POST\"  data-netlify-recaptcha=\"true\"  data-netlify=\"true\">  <p>    <label>      Email: <input type=\"text\" name=\"name\" />    </label>  </p>  <p>    <label>      Message: <textarea name=\"message\"></textarea>    </label>  </p>  <div data-netlify-recaptcha=\"true\"></div>  <p>    <button type=\"submit\">Send</button>  </p></form>\n```\n\nExample:\n```text\n<form  name=\"contact\"  method=\"POST\"  data-netlify-recaptcha=\"true\"  data-netlify=\"true\">  <!-- input fields and custom reCAPTCHA snippet --></form>\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.265Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":3,"totalLines":16,"estimatedTokens":256}}95{"id":"doc-two_way_content_sync_netlify_docs-f69c2cda","source":"documentation","title":"Two-way content sync | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/concepts/two-way-content-sync/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Content flows for visual editor Development processes Visual Editor dev application Differences with cloud setup Work with draft content Content editing methods Content editor Page editor Inline editing Source editing Content sync flows Send changes to the source Reactive content updates Detailed content flow Work with file-based content Automatic content reload Inline editing content flow DOM reloading On this page Overview Content flows for visual editor Development processes Visual Editor dev application Differences with cloud setup Work with draft content Content editing methods Content editor Page editor Inline editing Source editing Content sync flows Send changes to the source Reactive content updates Detailed content flow Work with file-based content Automatic content reload Inline editing content flow DOM reloading For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Concepts / Two-way content sync Copy page View as Markdown Copy as Markdown View as Markdown The Netlify Visual Editor stores content back to the appropriate source, while also listening for changes from each source. The visual editor provides a two-way content-syncing mechanism between all of your content sources. It enables your editors to make changes using the visual editor, while also listening for changes in the content source to ensure you’re previewing the most recent draft content at all times. Content flows for visual editorSection titled “Content flows for visual editor” Understanding the content flows requires prerequisite knowledge on the mechanisms at work while content is being updated. Development processesSection titled “Development processes” As you may have learned in How the visual editor works, running Visual Editor in local development mode means running two Development server that you would typically run while working on your site locally. Visual Editor process running on your machine that enables you to run Visual Editor while in development. Visual Editor dev applicationSection titled “Visual Editor dev application” Although there is some intricacy and nuance in the various components of Visual Editor application, it’s most important to understand the following controls (everything that isn't the preview of your website) are being run from Visual Editor application (create.netlify.com). Visual Editor Dev launches a local server (on port 8090) that combines your development server, along with a script to enable visual editing, and some server-side functionality for storing and retrieving content. (This is the vital piece in content-updating flows shown below.) The preview is just an <iframe> loading the content of Differences with cloud setupSection titled “Differences with cloud setup” The flows we'll show throughout this document assume you're working in local development. Thus, the critical piece is labeled as Stackbit Dev (Visual Editor Dev). To translate this to how content is updated with the cloud setup (not local development mode), replace Visual Editor Dev with a virtual container running in the cloud. The process itself is nearly identical. Work with draft contentSection titled “Work with draft content” To ensure that editors working concurrently see the same content at the same time, Visual Editor relies on a two-way content sync mechanism that stores all changes back to the source, while constantly listening for updates made to the source. As a result, every editor works with content as it exists in the most recent draft state in the source of truth. Need a different workflow? If you have a need to work with content in some other way, we can likely accommodate your workflow. Send us a message to learn more. Content editing methodsSection titled “Content editing methods” Before we get into the flows, let's look at the content-editing methods with Visual more traditional CMS-like method for editing any one of your content models without the preview context. Page editing within the context of a specific page, and with real-time updates to the preview. Inline inline and in-context using highlights on the preview. Source some other method to update content at the source. Each of these actions prompts a specific content update flow that is explained in further detail below. Content editorSection titled “Content editor” The content editor is the most traditional means of editing content with Visual Editor. It prompts the simplest update flow, because there is no preview to update. Learn more about the content editor. Page editorSection titled “Page editor” The page editor is a form-based editor, but appears within the context of the active page in the preview window. The content flow here is slightly more advanced, as it requires that the preview also be updated when the content changes at the source. Inline editingSection titled “Inline editing” Inline editing is the most advanced form of editing. It enables editors to click on content within the preview and edit in place. Visual Editor must then update the content in the page and content editor, while also updating the source and the preview (after the highlight is blurred). Source editingSection titled “Source editing” Finally, you're always free to edit content outside the context of Visual Editor. For example, if you are storing content in Contentful, you can still update content in Contentful. Visual Editor listens for content changes and pulls them into each of the editing techniques above in real time. Some content sources also have other means of updating content, such as through an API. Visual Editor will also pick up these changes to reflect the most recent draft content in the preview and editor panels. Content sync flowsSection titled “Content sync flows” Let's look at Visual Editor’s standard two-way content syncing mechanism, which saves content back to the source, while also listening for changes made from other Visual Editor users or content updates made directly to the source. This method serves both the standard content editor and page editor, with a slight difference, as noted below. Send changes to the sourceSection titled “Send changes to the source” Regardless of whether you're working with the content editor or page editor, here's what happens when you make a change to a form field value in Visual Editor while working Editor notifies Visual Editor dev server of the content change. Visual Editor Dev updates the appropriate content in the content source. Visual Editor app notifies Visual Editor script (via postMessage to the <iframe>), which leads to automatically updating content on your site, optimized for your chosen site framework. There's a bit of detail missing from this process, which we'll fill in below. Reactive content updatesSection titled “Reactive content updates” Visual Editor Dev also listens for content changes coming from the content source. This is how the values within both the form fields (content and page editing) and the preview (page editing only) stay up to date. When content is updated, whether by you, another Visual Editor user, or at the source, here's what Editor Dev identifies the update from the content source (via polling). Visual Editor Dev notifies Visual Editor app of the content change. The app updates the appropriate field values. Like above, Visual Editor app notifies the preview's visual editing script of the change, leading to updated content on the page. Detailed content flowSection titled “Detailed content flow” With that, let's break each of these steps up and look at the entire flow of a content update, originating with a change to a form field. A change is made to a form field. Visual Editor app notifies Visual Editor Dev of the change. Visual Editor Dev's CMS utilities update content in the content source. Visual Editor Dev's content listener polls the content source for changes. After content is updated in the source, Visual Editor Dev retrieves the new content. Visual Editor Dev sends the updated content to Visual Editor app. The app notifies Visual Editor script (in the preview <iframe>) of the change (via postMessage). The script triggers an efficient content reload for your framework (as described in automatic content reload, below). Your dev server reacts to this trigger by retrieving content from the content source. This is the code you've written to fetch and render content for your pages and components. After retrieving that content, your dev server reloads the DOM, making the updated content appear in the <iframe> preview. Work with file-based contentSection titled “Work with file-based content” If using local files as the content source (Git CMS), the content flow is similar, but the effect is slightly are changed directly by Visual Editor Dev, but left uncommitted on your local machine. Visual Editor content change becomes a Git commit on the working branch, and is then pushed to the content source (e.g. GitHub). Automatic content reloadSection titled “Automatic content reload” When Visual Editor updates the content on your page (#5 in the graphic above), this is what we call automatic content reloading. How exactly this works is determined by the ssgName configuration property. For example, if using Next.js, Visual Editor knows to call router.replace() to reload the content without a full page reload. For custom usage or frameworks not yet supported, you can also override this behavior by listening for an event sent by Visual Editor when content updates. Learn more about automatic content reload. Inline editing content flowSection titled “Inline editing content flow” When a change is made inline (rather than a form field), the content flow is nearly identical to the detailed flow discussed above. The only difference (marked as * above) comes at the beginning of the flow. The visual editing script notifies Visual Editor app about the change (again via an iframe message). The rest of the flow then continues as before. DOM reloadingSection titled “DOM reloading” Step #7 may feel odd in this case, given that we shouldn't need to update the preview when the content has already been updated. But there are two reasons why this is Editor doesn't know how to render all changes. Inline text may seem easy, but if the change was to add a button — Visual Editor can prompt the content change, but needs to wait to react to how your site handles the rendering of that change. If another user is editing the site, we also want to show that content has changed, so that they can continue working with the most updated content. Last 14, 2025 PreviousReusable contentNextAnalytics Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.266Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":3317}}96{"id":"doc-reusable_content_netlify_docs-5fa3d716","source":"documentation","title":"Reusable content | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/concepts/reusable-content/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Methods for content reuse Sensible defaults Duplicate content Templated content On this page Overview Methods for content reuse Sensible defaults Duplicate content Templated content For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Concepts / Reusable content Copy page View as Markdown Copy as Markdown View as Markdown Help content editors work faster by providing a starting point for content. Part of the role of a developer on a web project is not just providing editors with a mechanism for getting text on a page, but also helping to maximize their productivity in creating and editing that content. Methods for content reuseSection titled “Methods for content reuse” The most effective way to boost an editor’s productivity is to provide a starting point that is as close as possible to the final product. There are three ways to do sensible defaults (or initial values) Duplicating existing content Creating content templates Sensible defaultsSection titled “Sensible defaults” Sensible defaults help when an editor doesn't know exactly where to start from. They should still have something to start with. For example, if you have a field in the CMS responsible for controlling a button's text, you would want to first require that the field have a value. But, secondarily, you should provide some text as a starting point. For a button, this might be something Me. Visual Editor has its own sensible default value for some fields, but also provides a way for developers to control their own defaults when modeling content. Duplicate contentSection titled “Duplicate content” After an editor has created some content, there should be an easy way that they can then use that content again as needed by duplicating it. For example, if a site has one visually-rich landing page, an editor shouldn't have to start from scratch to create another. While some content management systems have this feature, Visual Editor ensures that editors can duplicate content regardless of the features provided by the CMS through our content presets feature. Templated contentSection titled “Templated content” Another way for editors to work quickly is through the use of template variations that can be used as starting points for pages or for components on those pages. For example, a card component may have several different layouts. Rather than asking an editor to choose the layout each time, they could work faster if they could pick the arrangement of contents first, and then edit to their liking. This is another aspect of the content presets provided by Visual Editor. Last 14, 2025 PreviousContent-driven developmentNextTwo-way content sync Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.267Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1331}}97{"id":"doc-http_method_netlify_docs-85da5e58","source":"documentation","title":"HTTP method | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/observability/reference/http-method/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Common examples Further reference On this page Overview Common examples Further reference For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Observability / Reference / HTTP method Copy page View as Markdown Copy as Markdown View as Markdown Filter requests by the HTTP method. Learn more about HTTP methods in the Web MDN docs. Common examplesSection titled “Common examples” HTTP methodUse caseGETRequest for a resourcePOSTRequest to create a resource, such as a form submissionPUTRequest to update a resource, such as a file uploadDELETERequest to delete a resource, such as a filePATCHRequest to update a resource, such as a fileHEADRequest to retrieve the headers for a resource, commonly used for troubleshooting Further referenceSection titled “Further reference” For a comprehensive list of HTTP methods, check out the IANA HTTP Method Registry. Last 16, 2025 PreviousEdge functionsNextStatus codes Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.269Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":716}}98{"id":"doc-content_type_netlify_docs-2a13931d","source":"documentation","title":"Content type | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/observability/reference/content-type/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Most common content types Framework-specific content types Further reference On this page Overview Most common content types Framework-specific content types Further reference For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Observability / Reference / Content type Copy page View as Markdown Copy as Markdown View as Markdown Filter requests by content type to analyze bandwidth consumption across your project. Identify the highest bandwidth content types, such as image assets, so you can optimize them to improve performance and reduce resource costs. Observability shows you the content type of your project's web requests. Content-Type is a standard HTTP response header that indicates the media type of the returned content. Your request may have no content type when one or more of the following is the response body is empty and you get a response with a 204 No Content status code redirects, which have a 3XX status code internal server errors injected scripts Most common content typesSection titled “Most common content types” We recommend monitoring for the most common content types to understand how your project's production performance and resource usage. Content-TypeUsed forDescriptionapplication/javascriptJavaScript filesOften the largest bandwidth consumer. Monitor for large bundles.text/htmlHTML web pagesCore site contentapplication/jsonJSON data filesCan indicate excessive data loading or prefetching for specific frameworks, such as Next.js data or Gatsby page-data.json. High volume warrants investigation.text/cssCSS stylesheetsStyling filestext/plainPlain text filesVarious text contentimage/webpWebP imagesModern image formatimage/pngPNG imagesIf larger than a few hundred KB, consider using Image CDNimage/jpegJPEG imagesIf larger than a few hundred KB, consider using Image CDNimage/svg+xmlSVG vector graphicsScalable graphicsfont/woff2Web fontsCan be heavy in terms of bandwidthapplication/octet-streamBinary filesAssorted files (e.g., JavaScript source maps, various binary content)image/vnd.microsoft.iconFavicon filesTypically .ico filesvideo/mp4MP4 video filesHigh bandwidth usageapplication/pdfPDF documentsDocument files Framework-specific content typesSection titled “Framework-specific content types” Content-TypeFrameworkDescriptiontext/x-componentNext.js 13+Pre-fetching components to load content before content is requested to improve performance. Built-in for frameworks such as Next.js, Remix, Gatsby, SvelteKit, etc. Astro can use pre-fetching if configured.application/vnd.ms-accessGatsbyGatsby data files (e.g., /j94r24d0-a3fb-4bb0-8d9b-34c35d2fbc2d-data.mdb) for Gatsby sites using SSR that read from the Gatsby data layer during server-side rendering. Further referenceSection titled “Further reference” For a comprehensive list of content-type values, check out the IANA Media Types reference docs. To learn more in general about content type, check out the MDN Web Docs for Content-Type. Last 16, 2025 PreviousOverviewNextCache status Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.270Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1237}}99{"id":"doc-local_development_with_netlify_cli_netlify_docs-fcd7b6ca","source":"documentation","title":"Local development with Netlify CLI | Netlify Docs","url":"https://docs.netlify.com/api-and-cli-guides/cli-guides/local-development","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI API & CLI guides API & CLI guides Overview API guides Get started with API Deploy project from a zip file with API Deploy zip file to production More API guides API reference docs Go client JS client CLI guides Get started with CLI Local development Manage functions Debug with VSCode More CLI guides CLI reference docs On this page Overview Get started with Netlify Dev Project detection Project ports Configuration Run an https server for local development Specify custom ports for Netlify Dev More Netlify Dev resources On this page Overview Get started with Netlify Dev Project detection Project ports Configuration Run an https server for local development Specify custom ports for Netlify Dev More Netlify Dev resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 API And CLI Guides / CLI Guides / Local development with Netlify CLI Copy page View as Markdown Copy as Markdown View as Markdown The Netlify CLI brings the functionality of your Netlify production environment directly to your local machine through the dev command. This CLI functionality is also referred to as Netlify Dev. When you use Netlify Dev, the CLI provides a proxy server that includes edge logic for custom headers and redirects, environment variables, and Netlify Functions. It automatically detects tools and frameworks like Gatsby, Hugo, Eleventy, Next.js, and more to configure a local development server that mimics the Netlify production environment. The sections below describe how to get started with Netlify Dev, how project detection and ports work, and how to customize the configuration. You can also access the command reference for dev for more information. Get started with Netlify DevSection titled “Get started with Netlify Dev” Before you begin, make sure you complete the following if you haven't the Netlify CLI. Authenticate with an access token. Link your local project to a Netlify siteID (also called Project ID in the Netlify UI). To do you're joining an existing project, use netlify clone <repo> to clone and link in one command (recommended) If you're setting up a new site, use netlify init to set up continuous deployment If you've already cloned a repository manually, use netlify link to connect it to a Netlify site Site ID same as Project ID Site ID, the API’s site_id, and the NETLIFY_SITE_ID environment variable all hold the same value, which the Netlify UI labels Project ID. To find it in the Netlify UI, go to Project configuration > General > Project information, and copy the value for Project ID. Learn more about Netlify project identifiers. To start a local development server for the build tool you’re using, run the following command from the root of your linked windownetlify dev By default, Netlify Dev runs your project using the configuration and environment variables set for local development with the Netlify CLI. For environment variables, that means those with values set for dev or all deploy contexts. You can use the --context flag to run your project with a different deploy context’s settings and variables. Terminal windownetlify dev --context production Note that environment variables apply to all scopes when running netlify dev. To run a shell command within the Netlify Dev environment, use windownetlify YOUR_SHELL_COMMAND Project detectionSection titled “Project detection” Netlify Dev attempts to detect the site generator or build command that your project uses and run these on your behalf, while adding other development utilities. If you have a JavaScript project, it uses simple heuristics to search for the best package.json script to run for you, so you can use the full flexibility of npm scripts. You also have the option to override framework detection, if needed. 'Override framework detection' The number of frameworks that Netlify Dev can detect is growing but, if the framework you use is not yet supported, you can instruct Netlify Dev to run the project on your behalf. Configure your project’s build command, port, and publish directory with the [dev] block in your netlify.toml file.# sample dev block in the toml# of these fields are optional and should only be used if you need an override[dev] command = \"yarn start\" # Command to start your dev server targetPort = 3000 # The port for your application server, framework, or site generator port = 8888 # The port that the Netlify Dev will be accessible on publish = \"dist\" # If you use a _redirect file, provide the path to your static content folderIf the CLI detects your project incorrectly or detects multiple frameworks, you can specify a framework option to test only one detector against your project.[dev] framework = \"create-react-app\" # or \"#static\" to force a static serverPossible values of framework: #auto (default) to check all available frameworks. The ID for one of the available frameworks, as specified in the .json file for that framework in the Netlify Build repository. #static for a static file server #custom to use the command option to run an app server and targetPort option to connect to it Project portsSection titled “Project ports” When you use Netlify Dev, you may encounter a few different ports — especially if your project uses a static site generator that has its own dev server, like Gatsby. Keep the following in mind when working with Netlify your project uses a framework that we can detect, Netlify Dev will use the framework's conventional ports, so you don't have to supply them yourself. If multiple detectors match your project, we'll ask you to choose. If your site generator runs on a specific port, such as port 8000, you need to specify the port when you run netlify dev. Netlify Dev will connect to that port and route requests successfully to the site generator along with the rest of the local Netlify environment. If you use an unrecognized site generator or framework, or have a server you want Netlify Dev to connect to, you need to specify the port when you run netlify dev. To confirm which port to use for local development with Netlify Dev, search for this box in your console window ┌────────────────────────────────────────────────────────────────────────┐ │ │ │ [Netlify Dev] Server now ready on http://localhost:8888 │ │ │ └────────────────────────────────────────────────────────────────────────┘ ConfigurationSection titled “Configuration” Netlify Dev works without configuration for the majority of users, but you can customize Netlify Dev settings in the [dev] section of the Netlify configuration file. The following sections outline some common configuration options. For a full list of the available properties, refer to the Netlify Dev section of our file-based configuration doc. Run an https server for local developmentSection titled “Run an https server for local development” By default, netlify dev starts an HTTP server. If you require HTTPS, you can configure a certificate and key file for use by netlify dev in your netlify.toml: [dev] [dev.https] certFile = \"cert.pem\" keyFile = \"key.pem\" Self-signed certificates require extra configuration If you’re using a self-signed certificate, you might need to configure your browser to accept it when running on localhost. To enable this setting for Chrome, visit chrome://flags/#allow-insecure-localhost in your browser. Specify custom ports for Netlify DevSection titled “Specify custom ports for Netlify Dev” Netlify Dev allows you to specify custom ports using the following parameters as flags or in a Netlify configuration file (netlify.toml): port for your application server, framework, or site generator port for the Netlify Dev server that you will open in the browser Netlify Dev tries to acquire these ports but if they are already in use by another application, it will throw an error and let you know. [dev] targetPort = 3000 port = 8888 More Netlify Dev resourcesSection titled “More Netlify Dev resources” Command reference for dev Configuration properties for Netlify Dev in netlify.toml Use Netlify CLI with monorepos Manage Functions with Netlify CLI Last 19, 2025 PreviousGet started with CLINextManage functions Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nnetlify dev\n```\n\nExample:\n```text\nnetlify dev --context production\n```\n\nExample:\n```text\nnetlify dev:exec YOUR_SHELL_COMMAND\n```\n\nExample:\n```text\n# sample dev block in the toml# note: each of these fields are optional and should only be used if you need an override[dev]  command = \"yarn start\" # Command to start your dev server  targetPort = 3000 # The port for your application server, framework, or site generator  port = 8888 # The port that the Netlify Dev will be accessible on  publish = \"dist\" # If you use a _redirect file, provide the path to your static content folder\n```\n\nExample:\n```text\n[dev]  framework = \"create-react-app\" # or \"#static\" to force a static server\n```\n\nExample:\n```text\n┌────────────────────────────────────────────────────────────────────────┐   │                                                              │   │   [Netlify Dev] Server now ready on http://localhost:8888    │   │                                                              │   └────────────────────────────────────────────────────────────────────────┘\n```\n\nExample:\n```text\n[dev]  [dev.https]    certFile = \"cert.pem\"    keyFile = \"key.pem\"\n```\n\nExample:\n```text\n[dev]  targetPort = 3000  port = 8888\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.271Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":8,"totalLines":43,"estimatedTokens":2713}}100{"id":"doc-build_plugins_netlify_docs-5dda12e4","source":"documentation","title":"Build plugins | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/build-plugins","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Install & use Install & use Overview Extensions and integrations Build plugins Setup guides Netlify App for Slack Netlify Email integration Auth0 Contentful integration GPT action LaunchDarkly integration Optimizely Edge Delivery PlanetScale integration Supabase integration Stripe Projects On this page Overview Install a plugin UI installation File-based installation Automatic installation Manage plugin versions Remove a plugin Create a plugin Get help More Build Plugins resources On this page Overview Install a plugin UI installation File-based installation Automatic installation Manage plugin versions Remove a plugin Create a plugin Get help More Build Plugins resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Install And Use / Build plugins Copy page View as Markdown Copy as Markdown View as Markdown Learn how to install and use Netlify Build Plugins. Start here For the latest extended services to Netlify, we recommend you start by checking out and installing Netlify extensions.Learn more about Netlify extensions. Build Plugins expand what your Netlify builds are capable of. For example, you can use plugins up builds by optimizing and debugging your build cache import and convert data from external sources check for broken links in a site after building analyze and optimize site asset handling for better runtime performance generate content like sitemaps, RSS feeds, and search indexes Install a pluginSection titled “Install a plugin” To get a sampling of what plugins can do, navigate to Project configuration > Build & deploy > Build plugins for your site. You’ll find different types of plugins, including plugins from our partners and plugins from the community. Plugins can be installed directly from the Netlify UI. They can also be installed using the Netlify configuration file, which allows more configuration options. Netlify automatically installs plugins or runtimes recommended for certain frontend frameworks when you link a repository for a new project. Use a compatible Node.js version For optimum compatibility while developing or running plugins, we recommend using the default version of Node.js installed by Netlify. However, you can also specify a different version for your project's setup, if needed. UI installationSection titled “UI installation” In the Netlify UI, navigate to Project configuration > Build & deploy > Build plugins for your project. Search or browse for the plugin you want. Select Enable. Follow the installation guidance in the Netlify UI to install the plugin on a site. You may be prompted to add build environment variables required by the plugin. To use your new plugin, visit the Deploys tab for your site and select Trigger deploy. Consider the context UI-installed plugins run in all deploy contexts. To limit the context for the plugin, consider using file-based installation instead. Required environment variablesSection titled “Required environment variables” Though many plugins listed in the Netlify UI require no configuration for default operation, some may require you to set one or more build environment variables for your site during or after installation. Refer to the plugin’s documentation, linked from Options menu in the plugin’s listing. File-based installationSection titled “File-based installation” File-based plugin installation allows advanced plugin configuration. You can use file-based installation for either of the local plugins that you write and store in your repository accessing a wide selection of plugins published by the community on npm In both cases, you configure settings in netlify.toml. For a plugin published to npm, you also add it as a dependency. Then you can test or run the plugin as part of a build. Configure settingsSection titled “Configure settings” To run a plugin during your build, add it to a Netlify configuration file stored in your site’s base directory. A plugin configured globally with [[plugins]] runs in all deploy contexts, but you can also configure a plugin by deploy context. Here’s a sample configuration with two plugins installed in all deploy contexts. # Configuration for a plugin published to npm[[plugins]]package = \"netlify-plugin-lighthouse\" [plugins.inputs] output_path = \"reports/lighthouse.html\" # Configuration for a local plugin[[plugins]]package = \"/plugins/netlify-plugin-hello-world\" Each [[plugins]] entry accepts two (required): for a plugin installed from npm, the npm package name of the plugin. for a local plugin, the absolute path to a directory containing the plugin’s index.js and manifest.yml files. The package value for a local plugin must start with . or /. settings that the plugin author may specify as required or available for configuring the plugin. To specify inputs per deploy context, refer to configure by deploy context. For npm-published plugins, you can find these details in each plugin’s package documentation on the npm Public Registry. Sometimes order matters Different plugins run during different stages of your build. When multiple plugins are set to run in the same stage, they will run in the order they are listed in the Netlify configuration file. An npm-published plugin’s README should indicate if order is important to that plugin’s functionality. Configure by deploy contextSection titled “Configure by deploy context” Using specific settings in your Netlify configuration file, you can limit a build plugin to run in a certain deploy context only, or you can configure a plugin’s inputs settings differently per context. Here’s an example configuration that runs the Sitemap plugin in the context of production deploys only. # Use double brackets since `plugins` is an array of tables.[[context.production.plugins]]package = \"@netlify/plugin-sitemap\" And here’s an example configuration that runs the Cypress plugin differently based on deploy contexts. # Use Cypress plugin for this site.# This section, by itself, configures the plugin# for all deploy contexts (production, branch deploys, Deploy Previews).[[plugins]]package = \"netlify-plugin-cypress\" [plugins.inputs] record = true # Don’t record Cypress tests in Deploy Previews.# Since this entry is more specific, it overrides the entry above.# `context.deploy-preview.plugins` and `package` must be included.[[context.deploy-preview.plugins]]package = \"netlify-plugin-cypress\" # Use single brackets since `inputs` is an object property [context.deploy-preview.plugins.inputs] record = false This configuration records test results and artifacts on the Cypress Dashboard for production and branch deploys only, not Deploy Previews. UI-installed plugins run on all contexts To limit a plugin to certain deploy contexts, ensure that you’ve configured the plugin for your site using file-based installation only and not UI installation. Next stepsSection titled “Next steps” If you’re installing a local plugin, you can run and test it after configuration. Otherwise, you’ll add a dependency to package.json. Add dependencySection titled “Add dependency” For a plugin from npm, there’s an additional step beyond editing the Netlify configuration file. You must use npm, yarn, or another Node.js package manager to add the plugin to devDependencies in your site’s package.json. Evaluate the plugin code Plugins available on npm but not yet listed in the Netlify UI have not been reviewed or approved by Netlify staff. We strongly recommend you review the plugin code and author for security concerns before installing. From your project’s base directory, use a command like this to add the Yarn Terminal window# Replace `BUILD_PLUGIN_NAME` with a real plugin name,# like `netlify-plugin-lighthouse`npm install -D BUILD_PLUGIN_NAME Terminal window# Replace `BUILD_PLUGIN_NAME` with a real plugin name,# like `netlify-plugin-lighthouse`yarn add -D BUILD_PLUGIN_NAME Run and testSection titled “Run and test” When you save your changes to your repository and push them to your Git provider, the build that’s triggered on Netlify will run with plugins installed for that deploy context. If you would like to test a plugin before running it in a production build, you can use a branch deploy or Deploy Preview, or you can run the build locally with Netlify CLI. Automatic installationSection titled “Automatic installation” When you link a repository for a new site, Netlify runs a build detection utility to determine whether your site uses a particular frontend framework. Certain frameworks have recommended Build Plugins or runtimes. These help extend the functionality of the Netlify Build process to support key framework-specific features. Recommended plugins and runtimes may have site conditions requirements, such as a minimum Node.js version. If your new site uses a framework with recommended plugins or runtimes, Netlify checks whether these are already installed in a Netlify configuration file. If not, Netlify automatically installs them. These automatically installed plugins run in all deploy contexts. For an existing site that’s already linked to Netlify, you can choose to install framework-specific recommended plugins yourself. Manage plugin versionsSection titled “Manage plugin versions” Netlify encourages plugin authors to regularly update functionality and release new versions using semantic versioning. Minor plugin version updates introduce only backward compatible new features, while major plugin version updates can introduce breaking changes. Refer to the plugin’s changelog, linked from the Options menu for the plugin listing in the Netlify UI, for version details. The steps for managing plugin versions for your site depend on the plugin installation method. For plugins installed in the UI or installed automatically, Netlify updates your site for minor plugin version releases automatically. To manage major plugin updates for a site, take the following to Project configuration > Build & deploy > Build plugins for your project Search or browse to find the plugin you want to manage. Select Options > Change version. Select the desired major version. Select Change version to save. Subsequent builds will use the plugin version that you’ve chosen and confirmed. For plugins installed through file-based installation, you can manage versions in your site’s package.json file under devDependencies. Remove a pluginSection titled “Remove a plugin” The steps for removing a plugin depend on how it was installed or whether it is an Essential Gatsby or Next.js Runtime plugin. For plugins installed in the UI or installed your selected project, go to Project configuration > Build & deploy > Build plugins. Find the plugin you want to remove. In the plugin’s card select Disable. Subsequent builds will not use the uninstalled plugin and environment variables entered for this integration will not be deleted. For plugins installed through file-based your site’s netlify.toml. Delete or comment out the plugin’s configuration fields. When you push your committed changes, the resulting build will run without the plugin. If you’re removing an npm-published plugin and want to avoid installing code you won’t use, you can uninstall the plugin package using npm. Plugin not uninstalling correctly? Check for conflicting configurations It’s possible to configure a plugin both in the Netlify UI and your site’s netlify.toml — though the configuration file takes precedence. If you follow the above steps to remove a plugin from netlify.toml and the plugin is still installed, make sure it’s not also configured in the Netlify UI, and vice versa. Removing the plugin from one does not automatically remove it from the other. For the Essential Gatsby and Next.js Runtime v4 your selected site, go to Project configuration > Build & deploy. In Build settings, find your plugin in the Runtime field and select Remove. Create a pluginSection titled “Create a plugin” Once you’ve had a chance to try out plugins, you may want to make one of your own. To learn how, visit the create plugins doc. A new way to build deep integrations and extensions Visit the Netlify SDK docs to learn about new tools and options for extending and integrating with Netlify. With the SDK, you can make an extension that interacts with more parts of the Netlify platform than a build plugin can. This new toolset also provides a streamlined experience for both developers and users. Get helpSection titled “Get help” Netlify Build Plugins are created by our partners and developers at Netlify and in the community. If you need help with a plugin, contact the plugin author by submitting an issue on the plugin repository. For plugins in the Netlify UI, you can find a link to the plugin issues under the Options menu for the plugin listing. If a plugin author doesn’t respond to an issue within a week, you can request deactivation of the plugin from the Netlify UI. For more general questions, or to discuss Build Plugins with other members of the community, visit the Netlify Support Forums. More Build Plugins resourcesSection titled “More Build Plugins resources” Create Build Plugins using build events Share Build Plugins Use the Netlify Blobs API in a build plugin Last 14, 2025 PreviousExtensions and integrationsNextNetlify App for Slack Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# Configuration for a plugin published to npm[[plugins]]package = \"netlify-plugin-lighthouse\"\n  [plugins.inputs]  output_path = \"reports/lighthouse.html\"\n# Configuration for a local plugin[[plugins]]package = \"/plugins/netlify-plugin-hello-world\"\n```\n\nExample:\n```text\n# Use double brackets since `plugins` is an array of tables.[[context.production.plugins]]package = \"@netlify/plugin-sitemap\"\n```\n\nExample:\n```text\n# Use Cypress plugin for this site.# This section, by itself, configures the plugin# for all deploy contexts (production, branch deploys, Deploy Previews).[[plugins]]package = \"netlify-plugin-cypress\"  [plugins.inputs]  record = true\n# Don’t record Cypress tests in Deploy Previews.# Since this entry is more specific, it overrides the entry above.# `context.deploy-preview.plugins` and `package` must be included.[[context.deploy-preview.plugins]]package = \"netlify-plugin-cypress\"  # Use single brackets since `inputs` is an object property  [context.deploy-preview.plugins.inputs]  record = false\n```\n\nExample:\n```text\n# Replace `BUILD_PLUGIN_NAME` with a real plugin name,# like `netlify-plugin-lighthouse`npm install -D BUILD_PLUGIN_NAME\n```\n\nExample:\n```text\n# Replace `BUILD_PLUGIN_NAME` with a real plugin name,# like `netlify-plugin-lighthouse`yarn add -D BUILD_PLUGIN_NAME\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.273Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":5,"totalLines":31,"estimatedTokens":4021}}101{"id":"doc-notifications_netlify_docs-7ec5884a","source":"documentation","title":"Notifications | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/notifications/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Accounts & Billing Accounts & Billing Overview Manage your personal user settings Manage a Netlify team and team members Overview About collaboration workflows Manage team members Manage project access Roles and permissions Team-owned sites Team audit log Manage an organization Billing Overview Manage payments Change your pricing plan Resume paused projects Credit-based plans How credits work Credit-based pricing plans How credits work for enterprise plans Pricing for AI features Buy credit packs Configure auto recharge Monitor usage for credit-based plans Billing FAQ for credit-based plans Legacy plans Billing for legacy plans Legacy pricing plans Billing FAQ for legacy plans Notifications On this page Overview Slack notifications Deploy notifications Form notifications Build settings notifications Usage and billing notifications On this page Overview Slack notifications Deploy notifications Form notifications Build settings notifications Usage and billing notifications For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Notifications Copy page View as Markdown Copy as Markdown View as Markdown Netlify provides a variety of custom and default notifications to help you monitor your sites. Slack notificationsSection titled “Slack notifications” Set up Slack notifications for your team or site’s activity with the Netlify App for Slack, which allows you to track changes can create subscriptions with this app to track changes zone and domain events Netlify team configuration changes Netlify team membership events Deploy state changes. You can refine these events by deploy context or deploy state Environment variable events Form submissions Site configuration changes Netlify Drawer activity Deploy notificationsSection titled “Deploy notifications” Set up deploy notifications to track a specific site’s deploy activity. Send deploy notifications to email, a pull/merge request, or an external web service. Note that you can also get notified of deploy state changes in Slack. For example, you can send notifications for these deploy started Deploy succeeded Deploy failed Deploy deleted Deploy locked Deploy unlocked Previously successful deploy failed Previously failed deploy succeeded For a full list of deploy events supported by Deploy notifications, check out the Deploy notifications docs. Form notificationsSection titled “Form notifications” Form submission notifications inform you about new verified form submissions. You can configure notifications for individual forms or for all forms on your site. Note that you can also get notified of form submissions in Slack. Build settings notificationsSection titled “Build settings notifications” If you stop or activate builds for your site, Netlify will notify all site members by email. Usage and billing notificationsSection titled “Usage and billing notifications” By default, Netlify sends site add-on usage notifications when any site add-on is enabled, as usage for a metered feature approaches level limits, and more. These are sent to the billing email you set for your team. Last 4, 2025 PreviousBilling FAQ for legacy plansNextHow projects work Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.275Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1174}}102{"id":"doc-redirects_and_rewrites_netlify_docs-bb5569be","source":"documentation","title":"Redirects and rewrites | Netlify Docs","url":"https://docs.netlify.com/manage/routing/redirects/overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Static Routing & Redirects Static Routing & Redirects Overview Custom headers Redirects Overview Redirect options Rewrites proxies Test redirects locally with Netlify CLI On this page Overview Syntax for the _redirects file Syntax for the Netlify configuration file Rule processing order On this page Overview Syntax for the _redirects file Syntax for the Netlify configuration file Rule processing order For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending conditions = {Language = [\"en\"], Country = [\"US\"], Role = [\"admin\"]} ## This rule redirects to an external API, signing requests with a secret[[redirects]] from = \"/search\" to = \"https://api.mysearch.com\" status = 200 force = true # that we always redirect headers = {X-From = \"Netlify\"} signed = \"API_SIGNATURE_TOKEN\" Visit the redirect options doc for more details on configuration options including placeholders, trailing slashes, and more. Check out the rewrites and proxies doc for details on rewrite-specific options. Rule processing orderSection titled “Rule processing order” The redirects engine will process the first matching rule it finds, reading from top to bottom. Rules in the _redirects file are always processed first, followed by rules in the Netlify configuration file. The following example uses _redirects file syntax: # This rule will trigger at /blog/my-old-title/blog/my-old-title /blog/my-new-title # This rule will never trigger because the previous rule triggers first/blog/my-old-title /blog/an-even-better-title Note that for each request, Netlify processes edge functions before redirects. For more information, visit our docs about the edge function declaration processing order. Last 14, 2025 PreviousCustom headersNextRedirect options Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# Redirects from what the browser requests to what we serve/home                //blog/my-post.php    /blog/my-post/news                /blog/cuties              https://www.petsofnetlify.com/authors/c%C3%A9line /authors/about-c%C3%A9line\n```\n\nExample:\n```text\n[[redirects]]  from = \"/old-path\"  to = \"/new-path\"  status = 301  force = false  query = {path = \":path\"}  conditions = {Language = [\"en\"], Country = [\"US\"], Role = [\"admin\"]}\n## This rule redirects to an external API, signing requests with a secret[[redirects]]  from = \"/search\"  to = \"https://api.mysearch.com\"  status = 200  force = true # COMMENT: ensure that we always redirect  headers = {X-From = \"Netlify\"}  signed = \"API_SIGNATURE_TOKEN\"\n```\n\nExample:\n```text\n# This rule will trigger at /blog/my-old-title/blog/my-old-title   /blog/my-new-title\n# This rule will never trigger because the previous rule triggers first/blog/my-old-title   /blog/an-even-better-title\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.276Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":20,"estimatedTokens":1036}}103{"id":"doc-overview_netlify_docs-ef94ad1d","source":"documentation","title":"Overview | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/observability/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Get started Use cases Use case videos Availability Quick insights Traffic insights Bandwidth insights Compute insights Blocked requests Understand request counts Differences from web analytics tools Impact of CDN or proxy services Search & filter options Search options Filter options Observability vs. Log drains Limits and other restrictions Other restrictions On this page Overview Get started Use cases Use case videos Availability Quick insights Traffic insights Bandwidth insights Compute insights Blocked requests Understand request counts Differences from web analytics tools Impact of CDN or proxy services Search & filter options Search options Filter options Observability vs. Log drains Limits and other restrictions Other restrictions For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Observability / Overview Copy page View as Markdown Copy as Markdown View as Markdown Netlify Observability offers near real-time visibility into your project's production performance and resource usage. Monitor requests, bandwidth, runtime behavior, functions, and Edge Functions to understand how your web project operates in production, fix errors, and optimize web performance. Get startedSection titled “Get started” From your project overview, select Logs & metrics > Observability. To expand details for a request, select a request. Use casesSection titled “Use cases” Observability is designed to give you real-world insights into how your web project is working in production. Common use caseDescriptionQuestions exploredTroubleshoot issuesIdentify frequently requested 404 URLs and diagnose unexpected behavior.How common are these errors? On which pages? Is this driven by real user traffic or bots and crawlers?Analyze traffic patternsDetect AI crawler activity and bot traffic.What kinds of site visitors or requests is your site getting?Optimize performanceIdentify which resources are using the most bandwidth. Find cache misses on critical endpoints, assets consuming excessive bandwidth, over-invoked functions, and edge logic running in unintended regions.Which resources are using the most bandwidth? What’s driving up serverless function usage? Note that Observability shows you how your project is working in production but does not show you credits usage. To understand your credits and billing, check out our usage and billing docs. Use case videosSection titled “Use case videos” Learn how to use Observability to troubleshoot issues, analyze traffic patterns, and optimize performance from the following tutorial videos. AvailabilitySection titled “Availability” This feature is available on Credit-based plans, including Free, Personal, and Pro, Business, and Enterprise plans. Observability is available for Credit-based plans and Enterprise plans. If you have a Legacy pricing plan, you can get a sneak peek at your observability data by checking out the widget from your Project Overview. Credit-based planTime filter availableFreePast 24 hoursPersonalPast 24 hoursProPast 7 days Enterprise planTime filter availableAny Enterprise planPast 30 days Note that if you have a Credit-based plan or an Enterprise plan, then Function Metrics will no longer be available to you as it is replaced by Observability. On plans that do not have Observability, Function Metrics continues to be available. If you’re interested in switching to a Credit-based plan or upgrading to a higher Credit-based plan, check out Change your pricing plan. Quick insightsSection titled “Quick insights” Use the Quick actions menu to quickly check for insights with a set of pre-selected filters across traffic, bandwidth, and compute. Traffic insightsSection titled “Traffic insights” Selected filters forDescriptionBrowser traffic onlyExclude common bots and automated toolsTop URLsWhich URLs are getting the most requests?Top client typesWhich client types are making the most requests?Top URLs not foundURLs with the most 404sTop URLs with errorsWhich URLs return the most errors?Top AI searchesPages crawled on-demand to answer user prompts Bandwidth insightsSection titled “Bandwidth insights” Selected filters forDescriptionBandwidth by URLWhich routes use the most bandwidth?Bandwidth by client typeWhich client types are using your bandwidth?Bandwidth by content typeWhich types of content are using your bandwidth? Compute insightsSection titled “Compute insights” Selected filters forDescriptionTop functionsWhich Netlify Functions are invoked the most?Slowest URLsWhich URLs are the slowest to respond?Top client types invoking functionsWhich client types invoke the most functions? Blocked requestsSection titled “Blocked requests” You can also learn more about the types of requests that are blocked by Netlify’s security features. Netlify’s Observability will not show you certain kinds of blocked requests, such as requests blocked by a CDN, proxy service, or Netlify’s automated DDoS protection. Learn more about blocked requests. Understand request countsSection titled “Understand request counts” Netlify Observability shows raw server-side HTTP request data. This may differ from metrics in other tools you use, which measure different aspects of your site's traffic. Differences from web analytics toolsSection titled “Differences from web analytics tools” Web analytics tools like Google Analytics measure traffic differently than our observability tools filter out bot traffic to show only human visitors. Our dashboard shows all requests, including bots. Page views vs. tools count single-page app (SPA) navigation as separate page views, even though they don't trigger new requests. Our dashboard only counts actual HTTP requests. Client-side vs. server-side tools run in the browser and can't see failed requests (404s) or redirects (301s, 302s) because the page never fully loads. Our dashboard tracks all requests at the server level, including errors and redirects. Visitors and tools use heuristics and cookies to estimate unique visitors and sessions. Our dashboard doesn't track these metrics—it shows raw HTTP request data and how our platform handles them. Impact of CDN or proxy servicesSection titled “Impact of CDN or proxy services” If you use a CDN or proxy service (like Cloudflare or Akamai) in front of your site, blocked or cached traffic may never reach our platform. The dashboard only measures requests that actually arrive at our servers. Search & filter optionsSection titled “Search & filter options” The following search and filter options allow you to create custom views of your project's observability data. Search optionsSection titled “Search options” Use Observability's search field to filter web requests by the request URL (including domain or query params) The user-agent string Client IP address (if the request went through a trusted proxy—the IP is what the proxy reports as \"forwarded for\") The request ID—each response from Netlify includes a header with a unique ID for that request Any text in function and edge function logs Filter optionsSection titled “Filter options” Observability filters allow you to group requests by different criteria to gain insights into your project's behavior. FiltersDescriptionStatus codesWeb standards-defined filter to group requests by HTTP status codes.Status groupCustom Netlify filter to group status codes. Instead of using the HTTP standard status classes (such as informational for 1xx, successful for 2xx, redirect for 3xx, client error for 4xx, and server error for 5xx), Netlify groups status codes into 5 , Redirect, Not Found, Client Error, and Server Error.HTTP methodWeb standards-defined filter to group requests by HTTP method, including GET, POST, PUT, DELETE, etc.Content typeWeb standards-defined filter to group requests by content type, including text/html, application/json, application/xml, etc.Cache statusCustom Netlify filter to group requests by cache status based on Netlify caching.User agent categoryCustom Netlify filter to group requests by user agent category, including bot, crawler, etc.Function nameCustom Netlify filter to group requests by function name for functions in netlify/functions.Edge function nameCustom Netlify filter to group requests by edge function name for edge functions in netlify/edge-functions.Block reasonCustom Netlify filter to group requests by the reason Netlify blocked a request, including rate limited, firewall traffic rules, web application firewall (WAF), password protection, and more. Observability vs. Log drainsSection titled “Observability vs. Log drains” FeatureObservabilityLog DrainsPrimary purposeReal-time debugging and performance analysisLong-term log retention and cross-platform aggregationInterfaceNetlify-native dashboardThird-party tools (Datadog, Splunk, etc.)ConfigurationEnabled by defaultRequires endpoint setup and authenticationData availableRequest-level traffic, cache status, regional latency, function executionRaw log , functions, edge functions, deploys, WAF rulesData retentionShort-term (varies by plan)Determined by external providerCorrelationBuilt-in request tracing and timeline viewDepends on external tool capabilitiesCost modelIncluded with Netlify planExternal tool pricing appliesCross-project analysisSingle-site view onlyAggregate multiple sites and servicesAlertingNot availableConfigure in external toolCompliance & auditLimited retentionSupports compliance workflows and SIEM integration Limits and other restrictionsSection titled “Limits and other restrictions” If you need alerting, long-term data retention, or custom dashboards, we recommend setting up a log drain to connect to a third-party monitoring tool with longer log retention. Learn more about log drain support. Other restrictionsSection titled “Other restrictions” Requests blocked by automated mechanisms that the user cannot control or configure in any way (and that are not visible elsewhere to users) do not appear in Observability. Requests blocked by Advanced Web Security (by WAF, Firewall Traffic Rules, or Rate Limiting rules defined by the customer) do appear. Calls to AI Gateway from Agent Runners are not shown in Observability Credits usage is not shown in Observability but you can find your credit usage in your billing dashboard. Monitoring your project in the Observability dashboard does not add any new usage charges. Learn more in Monitor usage for credit-based plans. There is currently no programmatic access to observability data. Granular caching information Debugging specific issues at depth, e.g., Incremental Static Regeneration (ISR) behavior with Next.js, often requires granular caching information not shown today. Observability is not available for Legacy pricing plans and replaces Function Metrics. Last 9, 2026 PreviousOverviewNextContent type Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.277Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":3179}}104{"id":"doc-find_a_project_netlify_docs-421684f2","source":"documentation","title":"Find a project | Netlify Docs","url":"https://docs.netlify.com/manage/projects/find-a-project/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Projects Projects How projects work Customize project name & image Find a project Organize projects Add new project Update project with Agent Runners Connect project to repo Monitor project activity Transfer a project Disable project Resume paused projects On this page Overview Use sort to search Use filters to search On this page Overview Use sort to search Use filters to search For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Projects / Find a project Copy page View as Markdown Copy as Markdown View as Markdown Learn ways to find a project from your Netlify dashboard. Pro tip Give your projects meaningful names to make them easier to find. Learn more in our docs on customizing your project name. Use sort to searchSection titled “Use sort to search” Anyone on your Netlify team with access to your project can use the projects sort options from the Netlify dashboard to find a project. You can sort by most recently published, last updated, and more. Use filters to searchSection titled “Use filters to search” Anyone on your Netlify team with access to your project can use the projects filter from the Netlify dashboard to find your project. From your Project overview dashboard, select Projects, then under the projects search box, choose Edit filters and choose your filters. You can filter your projects by whether you created the project, by whether the project is protected by a password, a project label, and more. To filter your team‘s site list by label, select a label on one of the sites in the list. You can also filter sites by selecting Filter by label and choosing the appropriate label. Last 9, 2026 PreviousCustomize project name & imageNextOrganize projects Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.278Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":809}}105{"id":"doc-branch_deploys_netlify_docs-dd81b8cf","source":"documentation","title":"Branch deploys | Netlify Docs","url":"https://docs.netlify.com/deploy/deploy-types/branch-deploys/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview Branch deploy controls On this page Overview Branch deploy controls For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Deploy Types / Branch deploys Copy page View as Markdown Copy as Markdown View as Markdown Branch deploy controlsSection titled “Branch deploy controls” You can set up a branch deploy for a specific branch or for all new branches in your repository through your project configuration. By default, Netlify will not generate a branch deploy unless a Developer or Owner has set up branch deploys for your site. Missing collaboration tools on your branch deploy? If you have an existing branch deploy that does not show the Netlify Drawer, try merging new changes into your branch to generate a refreshed branch deploy. For more help, check our troubleshooting docs. Set up a branch deploy for specific branchesSection titled “Set up a branch deploy for specific branches” To set up a branch deploy for one or more specific branches, such as staging or to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. Select Let me add individual branches and enter the name of each branch you want to deploy. You can also enter branch names you haven’t created yet in your repository. To deploy all branches with a specific prefix, add an asterisk to the end of your branch name, e.g. features/*. To confirm, select Save. Set up branch deploys for all new branchesSection titled “Set up branch deploys for all new branches” To automatically generate branch deploys for every new branch pushed to your remote site to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. Next to Branch deploys, select All. This excludes the designated production branch for your repository. To confirm, select Save. Turn off all branch deploys for your siteSection titled “Turn off all branch deploys for your site” To turn off all branch deploys for your to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. For Branch deploys, select None. To confirm, select Save. Protect all branch deploys with a passwordSection titled “Protect all branch deploys with a password” You can control who can access your site's branch deploys by requiring a password. Learn more at our Password Protection docs. Use branch subdomains for branch deploysSection titled “Use branch subdomains for branch deploys” You can assign custom branch subdomains to your branch deploys using your site's primary custom domain. Learn more about custom branch subdomains for branch deploys. Last 18, 2026 PreviousProduction deployNextDeploy Previews Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.279Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1154}}106{"id":"doc-understand_domains_netlify_docs-07e4ce8f","source":"documentation","title":"Understand domains | Netlify Docs","url":"https://docs.netlify.com/manage/domains/domains-fundamentals/understand-domains/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Supported custom domains Default Netlify subdomain Example domains for deploys Custom domain examples Netlify subdomain examples On this page Overview Supported custom domains Default Netlify subdomain Example domains for deploys Custom domain examples Netlify subdomain examples For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Domains Fundamentals / Understand domains Copy page View as Markdown Copy as Markdown View as Markdown Learn the fundamentals of working with domains on Netlify. A domain name is the URL or web address where visitors find your site. To access your deploys on Netlify, you can set up a custom domain or use the default Netlify subdomain. Supported custom domainsSection titled “Supported custom domains” Custom domains allow you to make your sites accessible at your own domain names, such as www.yourcustomdomain.com or docs.example.dev. All top-level domains are supported for your custom domain. Netlify supports custom domains for your production site, Deploy Previews, and branch deploys. For your production site, Netlify supports a primary site domain, domain aliases, and domain-based redirects. For Deploy Previews, you can customize your domain after the Deploy Preview prefix deploy-preview-# with an automatic deploy subdomain. For For branch deploys, you can customize your domain after your branch name with automatic deploy subdomains or branch subdomains. For For more example custom domains, check out the chart below. Default Netlify subdomainSection titled “Default Netlify subdomain” Unless you’ve set up a basic password protection or authentication, a production site/app on Netlify is accessible from its Netlify subdomain, which takes the form [name-of-your-site].netlify.app. Note that you can change the name of your site to change this Netlify subdomain. For example, if your site is named brave-curie-12345, then by default your site is available at https://brave-curie-12345.netlify.app/. Learn more about other types of default Netlify subdomains for other types of deploys in the chart below. Example domains for deploysSection titled “Example domains for deploys” Your site deploys can have different domain patterns based on the type of site deploy. Custom domain examplesSection titled “Custom domain examples” Site deploy typeCustom domainUse caseProduction deploycompany.comCan set a primary domain for your production site.Deploy Previewdeploy-preview-42.early-access.company.comCan set a custom domain for Deploy Previews with an automatic deploy subdomain.Branch deploy for a branch named stagingBranch Automatic deploy or staging.internal-events.comCan set a custom domain for your branch deploys with an automatic deploy subdomain or branch subdomains. Netlify subdomain examplesSection titled “Netlify subdomain examples” By default, your site deploys are available at a URL using the Netlify subdomain mysitename.netlify.app. The Netlify subdomain URLs will always work even if you set up a custom domain for your site. Site deploy typeNetlify subdomainUse caseProduction deploy URLmysitename.netlify.appTypically a placeholder URL, ideal for internal development before assigning a custom domain for site visitors.Deploy Previewdeploy-preview-42--mysitename.netlify.appUnique URL for previewing and collaborating on each pull/merge request.Branch deploy for a branch named stagingstaging--mysitename.netlify.app a branch subdomain set up, the URL can be staging.yourcustomdomain.com.Long-standing URL ideal for internal testing, QA teams, and ongoing development. To set up branch deploys, check out branch deploy controls.Atomic deploy1234abcd12acde000111cdef--mysitename.netlify.appUnique URL for a specific successful deploy. Also called deploy permalinks or just permalinks. Unlike the other site deploys, the web content at this URL never changes. A new deploy permalink is generated for each successful deploy of your site. Last 1, 2025 PreviousDomains glossaryNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.279Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1578}}107{"id":"doc-add_domain_redirect_netlify_docs-a1c18bbc","source":"documentation","title":"Add domain redirect | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/add-domain-redirect","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Add domain redirect Copy page View as Markdown Copy as Markdown View as Markdown Add a domain redirect to your site so that you can keep visitor traffic to the correct domain. If you have multiple domains assigned to your site, you can redirect visitors between them or add other custom redirect and rewrite rules based on the domain entered into the browser by your visitors. For more information, visit the docs on domain-level redirects. For additional help in setting up domains redirects, check out these forums old domain to new one Official Support guide on making redirects work Last 15, 2025 PreviousOverviewNextAssign a domain to your site app Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.280Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":775}}108{"id":"doc-transfer_a_domain_netlify_docs-29438a52","source":"documentation","title":"Transfer a domain | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/transfer-a-domain","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Transfer domains between teams Transfer domains between registrars On this page Overview Transfer domains between teams Transfer domains between registrars For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Transfer a domain Copy page View as Markdown Copy as Markdown View as Markdown Netlify offers these options for transferring a domain. Transfer domains between teamsSection titled “Transfer domains between teams” To transfer domains between teams, you must be a Team or Organization Owner. If you already have a domain in your team’s DNS page, you can transfer the domain and all of its settings to any other team where you are an Owner or Developer. To do this, select the domain you wish to transfer, then go to Collaboration > Transfer ownership, near the bottom of the page. Transfer domains between registrarsSection titled “Transfer domains between registrars” Netlify cannot accept inbound domain transfer requests from other registrars. However, if you have a domain registered elsewhere, you can still take advantage of Netlify DNS by delegating your domain to Netlify. You can also transfer domain registrations and DNS zones between your teams on Netlify. Visit the domain transfer instructions for details. If you would like to transfer a Netlify-registered domain to another registrar, please contact support for assistance. Note that ICANN regulations do not permit transfers within 60 days of registration. Last 15, 2025 PreviousManage multiple domainsNextHTTPS SSL Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.281Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":965}}109{"id":"doc-stripe_projects_netlify_docs-93db1a1c","source":"documentation","title":"Stripe Projects | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/setup-guides/stripe-projects/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Install & use Install & use Overview Extensions and integrations Build plugins Setup guides Netlify App for Slack Netlify Email integration Auth0 Contentful integration GPT action LaunchDarkly integration Optimizely Edge Delivery PlanetScale integration Supabase integration Stripe Projects On this page Overview Use cases Get started Authentication with Stripe Projects Learn more On this page Overview Use cases Get started Authentication with Stripe Projects Learn more For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Install And Use / Setup Guides / Stripe Projects Copy page View as Markdown Copy as Markdown View as Markdown Deploy your Stripe Project to Netlify and streamline your development workflow by provisioning and managing all your site's services from a single command line interface. OverviewSection titled “Overview” Stripe Projects simplifies provisioning and managing services for your app or site directly from the command line with the Stripe Projects CLI. This enables you or your AI agent to quickly set up and manage your project without leaving the command line. You or your agent can deploy your project to Netlify and keep it synced with other services your project needs. Use casesSection titled “Use cases” Provisioning and managing services for your app or site directly from the command line Keeping services up to date as your app evolves Connecting supported third-party services to your project without manually copying credentials between dashboards Easily adding payment processing capabilities to your application Learn more about the use cases that Stripe Projects helps with at Stripe Projects use cases recap. Get startedSection titled “Get started” These docs assume you are setting up a new Stripe Project and deploying it to Netlify. For the most up-to-date setup steps, supported services, and configuration options, check out Stripe’s Projects overview Create a Stripe account and install the Stripe CLI. Install or update the Netlify CLI. From your local project’s directory, create and initialize your app/site with Stripe projects init YOUR_PROJECT_NAME Link your existing Netlify account or create a new one, and create a new Netlify projects add netlify/project At this point, Stripe Projects has created a Netlify project linked to your account, but no content has been deployed to it yet. To deploy, prompt your AI agent to build your application and deploy it to Netlify. Once it does, your site will be live with the Stripe API key (and any other credentials Stripe Projects set up) already wired into your Netlify project’s environment variables — no manual configuration needed. Authentication with Stripe ProjectsSection titled “Authentication with Stripe Projects” While the Stripe CLI design allows for authentication using the email address of the Stripe account owner or the current user making API calls, Netlify only authenticates users using the user email address that is performing the CLI actions and not the Stripe Account owner. This ensures the 's integration with Stripe Projects does not authenticate on behalf of the Stripe account owner Stripe users creating accounts with Netlify do not create accounts that authenticate with a different user's email After you connect Stripe Projects to your Netlify project, credentials for any services Stripe Projects helps to set up are written to a .env file at the root of your project. If any of these credentials are used by your project, you will need to use the Netlify CLI or UI to manage these environment variables. Learn moreSection titled “Learn more” Stripe Projects documentation Extensions and integrations on Netlify Last 30, 2026 PreviousSupabase integrationNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nstripe projects init YOUR_PROJECT_NAME\n```\n\nExample:\n```text\nstripe projects add netlify/project\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.281Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":13,"estimatedTokens":1342}}110{"id":"doc-configure_an_automatic_subdomain_for_deploys_net-e9f9d419","source":"documentation","title":"Configure an automatic subdomain for deploys | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/configure-an-automatic-subdomain-for-deploys","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Use cases Domain requirements Example deploy URLs Automatic deploy subdomains for Deploy Previews Set an automatic deploy subdomain for Deploy Previews Automatic deploy subdomains for branch deploys Prerequisites Set an automatic deploy subdomain for branch deploys Choose a unique URL for your branch deploys Limitations for sites with existing branch subdomains Use a new custom domain for your automatic deploy subdomain Use the Netlify API to set automatic deploy subdomains Custom certificate requirements Remove an automatic deploy subdomain On this page Overview Use cases Domain requirements Example deploy URLs Automatic deploy subdomains for Deploy Previews Set an automatic deploy subdomain for Deploy Previews Automatic deploy subdomains for branch deploys Prerequisites Set an automatic deploy subdomain for branch deploys Choose a unique URL for your branch deploys Limitations for sites with existing branch subdomains Use a new custom domain for your automatic deploy subdomain Use the Netlify API to set automatic deploy subdomains Custom certificate requirements Remove an automatic deploy subdomain For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / Configure an automatic subdomain for deploys Copy page View as Markdown Copy as Markdown View as Markdown With automatic deploy subdomains, you can set up automatically branded URLs for Deploy Previews or branch deploys — unifying your site’s preview environments, auth flows, third-party services, and other site versions with a shared custom domain. Automatic deploy subdomains are a type of custom domain that you can set for all Deploy Previews or all branch deploys. Use casesSection titled “Use cases” When you set up an automatic deploy subdomain for all of your Deploy Previews or branch deploys, you branded deploy URLs that don’t include the Netlify subdomain. For example, build greater trust with your stakeholders by sharing deploy-preview-42.company.com instead of deploy-preview-42--mysitename.netlify.app. Use third-party services the way you do for your production site, such as auth flow services that rely on a custom domain. Ensure deploys are “trusted” and in the “allowed domain list” for any third-party scripts or services that require this. Meet internal security requirements while leveraging Netlify’s Deploy Previews and branch deploys to preview and collaborate on changes before they go live. Once you configure an automatic deploy subdomain, Netlify uses this custom domain for your Deploy Previews and/or branch deploys by default within the Netlify UI, the API, CLI, and deploy notifications. Domain requirementsSection titled “Domain requirements” The custom domain you set as your automatic deploy subdomain must be managed by Netlify DNS and available to your team. By default, domains managed by Netlify DNS can be applied to your Deploy Previews or branch deploys. For example, if you already delegated company.com to Netlify DNS, then subdomains of company.com, such as early-access.company.com, are also delegated to Netlify DNS by default. That means you can use early-access.company.com as your automatic deploy subdomain. If you want to use a custom domain that Netlify DNS does not already manage, add the custom domain to your Netlify team and configure it to be managed by Netlify DNS. Learn more in these domain setup steps. Want to use a subdomain without bringing the apex domain to Netlify DNS? You can bring a subdomain to Netlify DNS without the apex domain. For example, you can delegate docs.company.com to Netlify DNS without also delegating company.com. Learn more about stand-alone subdomain support. Example deploy URLsSection titled “Example deploy URLs” Site deploysNetlify subdomainAutomatic deploy subdomainDeploy Previewdeploy-preview-42--mysitename.netlify.appdeploy-preview-42.company-internal-testing.comBranch deploy, e.g. staging branchstaging--mysitename.netlify.appstaging.company-internal-testing.comAtomic deploy permalinkUses the Netlify subdomain and a deploy ID, such as 1234abcd12acde000111cdef--mysitename.netlify.app.N/A When you set an automatic deploy subdomain for all Deploy Previews or all branch deploys, your deploys are still accessible at the Netlify subdomain, such as deploy-preview-42--mysitename.netlify.app or staging--mysitename.netlify.app. Using High-Performance Edge? If your site is on the High-Performance Edge, then automatic deploy subdomains are served from the High-Performance Edge. However, Netlify subdomains (*.netlify.app) are always served from the standard network. Your deploy permalinks, which offer unique URLs for successful deploys of your site, will continue to use the Netlify subdomain. Unlike other deploy URLs, deploy permalinks do not update with new Git commits. Instead, Netlify generates new deploy permalinks for each successful deploy of your site. Not sure if you want to use Deploy Previews or branch deploys? Deploy Previews are scoped to a pull/merge request while branch deploys are scoped to a branch. Branch deploys can offer a longer-standing URL than Deploy Previews since they are based on the branch name and not the pull/merge request. Learn more about the difference between these deploys in these docs. Automatic deploy subdomains for Deploy PreviewsSection titled “Automatic deploy subdomains for Deploy Previews” Deploy Previews are automatically enabled for all sites using continuous integration with Netlify. If your site doesn’t have Netlify continuous integration set up, check out these docs. Set an automatic deploy subdomain for Deploy PreviewsSection titled “Set an automatic deploy subdomain for Deploy Previews” To set up an automatic deploy subdomain for your site’s Deploy to Domain management > Automatic deploy subdomains. Select Edit custom domains. Next to Deploy Previews, select Add custom domain. Under Domain, you’ll find domains managed by Netlify DNS. Select your chosen custom domain. Optionally, enter an additional subdomain, such as early-access or qa. Want to use a different domain? If you can’t find the domain you want to add in the drop-down menu, check out these docs for adding a new custom domain. Review the preview of the deploy URL for your Deploy Previews. To confirm, select Save. Once saved, Netlify updates the domain for all open Deploy Previews. If you applied a custom domain that is not already live as your primary site domain (or does not already have a security certificate), then your new deploy URL may take up to 24 hours to resolve and work with HTTPS. Automatic deploy subdomains for branch deploysSection titled “Automatic deploy subdomains for branch deploys” Branch deploys are often used for maintaining a separate version of your site for QA, internal testing, or even to manage different versions of site content for different audiences or product versions. If you are already using branch subdomains, check out our branch subdomain comparison docs to understand the key differences between these subdomains and how they can work together. If you set up an automatic deploy subdomain for branch deploys on your site, then each branch deploy will generate the same automatic deploy subdomain and include your branch deploy’s unique branch name. PrerequisitesSection titled “Prerequisites” To set up an automatic deploy subdomain for your site’s branch deploys, you must first enable branch deploys for your site. To enable branch deploys for your site, go to Project configuration > Build & deploy > Branches and deploy contexts. Select Configure. Next to Branch deploys, set up branch deploys for a specific branch or for all non-production branches. To confirm, select Save. Once branch deploys are enabled, create a new branch and push a commit to this branch in your connected site repo. Netlify will automatically generate a branch deploy, which you can preview in your site’s deploy list. Created a deploy with the CLI? If you created a deploy using the Netlify CLI’s --alias flag, then be aware that these deploys are not branch deploys and do not support branch subdomains or automatic deploy subdomains. We recommend you avoid using --alias with any of your branch names. Set an automatic deploy subdomain for branch deploysSection titled “Set an automatic deploy subdomain for branch deploys” To set up an automatic deploy subdomain for your site’s branch to Domain management > Automatic deploy subdomains. Select Edit custom domains. Next to Branch deploys, select Add custom domain. Under Domain, you’ll find domains managed by Netlify DNS. Select your chosen custom domain. Optionally, enter an additional subdomain, such as early-access or qa. Want to use a different domain? If you can’t find the domain you want to add in the drop-down menu, check out these docs for adding a new custom domain. Review the preview of the deploy URL for your branch deploys. To confirm, select Save. Once saved, Netlify updates the domain for all active branch deploys. If you applied a custom domain that is not already live as your primary site domain (or does not already have a security certificate), then your new deploy URL may take up to 24 hours to resolve and work with HTTPS. Choose a unique URL for your branch deploysSection titled “Choose a unique URL for your branch deploys” It is possible to configure automatic subdomains for branch deploys so that a branch subdomain conflicts with another site’s production domain. Since Deploy Previews are appended with the pull/merge request number, their automatic subdomains are unlikely to conflict with other domains. For A has a primary site domain of staging.company.com for the production site. Site B has an automated domain of staging.company.com for its staging branch. When there is a conflict, domains listed in your Production domains settings will take precedence over other internal domains. So in this example, staging.company.com will resolve to the content of site A. To prevent accidental domain duplication, you might choose to add another subdomain level to your branch subdomains that is not used in production, such as internal in staging.internal.company.com. If you get a domain conflict, you can rename the branch. For example, you can rename the branch from staging to qa. Then, the next time you deploy this branch, it would use the qa.company.com domain. Limitations for sites with existing branch subdomainsSection titled “Limitations for sites with existing branch subdomains” Once you add an automatic deploy subdomain for branch deploys, you cannot edit or change existing manual branch subdomains. You also cannot manually add new branch subdomains, but existing branch subdomains will still work. If you configured branch subdomains before enabling automatic deploy subdomains, both the branch subdomains and automatic deploy subdomains will resolve and be available. If both are set up, the Netlify UI, CLI, API, and deploy notifications will link to the automatic deploy subdomain by default. To make changes to your branch subdomain, you must remove the automatic deploy subdomain first. If you want to compare using branch subdomains with automatic deploy subdomains, check out our comparison docs for applying a custom domain to a branch deploy. Use a new custom domain for your automatic deploy subdomainSection titled “Use a new custom domain for your automatic deploy subdomain” By default, you can choose primary site domains that are also managed by Netlify DNS as your automatic deploy subdomain. You can also add additional subdomains to these domains, such as early-access or qa. If you want to use a custom domain that is not listed in the Netlify UI, you must first delegate this domain to Netlify DNS. Want to use a subdomain without bringing the apex domain to Netlify DNS? You can bring a subdomain to Netlify DNS without the apex domain. For example, you can delegate docs.company.com to Netlify DNS without also delegating company.com. Learn more about stand-alone subdomain support. To delegate an existing domain you own to Netlify to your project dashboard, on the left, choose Domain management. Under Automatic deploy subdomains, check Add custom domain. Optionally, you can add a subdomain to your custom domain, such as early-access, internal, or docs. Under Domain, choose a custom domain or add a new custom domain with the option Configure Netlify DNS for a custom domain. Enter new domain and confirm with Set up with Netlify DNS. Point your domain's name servers to Netlify. To use Netlify DNS, go to your domain registrar and change your domain's name servers to the following custom hostnames assigned to your DNS zone. Confirm with I've done this, proceed. Select Save. Your changes may need more time to take effect depending on your DNS updates. Some DNS updates can take up to 24 hours to take effect and some changes take even longer. Once your changes take effect, your Deploy Preview or branch deploy URLs will automatically update to use the new domain and/or subdomain. Use the Netlify API to set automatic deploy subdomainsSection titled “Use the Netlify API to set automatic deploy subdomains” You can set automatic deploy subdomains when you create a site using the Netlify API. In your createSite request, use the following query parameters to pass the values to use for the branch_deploy_custom_domain Note that when you create or update a site with an automatic deploy subdomain, the build environment variable DEPLOY_PRIME_URL will update for all relevant deploys. Learn more about DEPLOY_PRIME_URL. Custom certificate requirementsSection titled “Custom certificate requirements” If you use a custom certificate for your site’s domains, that certificate must explicitly include any new subdomains used for automatic deploy subdomains. The standard wildcard syntax, such as *.company.com, does not cover this new subdomain. For example, your custom certificate will not work as expected in this have early-access.company.com as your automatic deploy subdomain, where early-access is the optional new subdomain you added in the Netlify UI you have a custom certificate with *.company.com as your wildcard domain but not *.early-access.company.com In this scenario, you must update your certificate to include the domains *.company.com, *.early-access.company.com so that early-access.company.com will work as expected. Remove an automatic deploy subdomainSection titled “Remove an automatic deploy subdomain” To remove an automatic deploy subdomain from your Deploy Previews or branch to Domain management > Automatic deploy subdomains. Select Edit custom domains. Next to Branch deploys or Deploy Previews, clear the Add custom domain checkbox. To confirm, select Save. Last 18, 2026 PreviousBring a domain to NetlifyNextConfigure external DNS Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.283Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":4282}}111{"id":"doc-overview_netlify_docs-4c590ac0","source":"documentation","title":"Overview | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Install & use Install & use Overview Extensions and integrations Build plugins Setup guides Netlify App for Slack Netlify Email integration Auth0 Contentful integration GPT action LaunchDarkly integration Optimizely Edge Delivery PlanetScale integration Supabase integration Stripe Projects On this page Overview Finding an extension or integration Installing an extension or integration Installing Netlify Apps Installing a build plugin On this page Overview Finding an extension or integration Installing an extension or integration Installing Netlify Apps Installing a build plugin For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Install And Use / Overview Copy page View as Markdown Copy as Markdown View as Markdown Learn how to install and use extensions, integrations, and more. If you're looking for help installing and using an AI tool or agent, check out our Build with AI docs. Finding an extension or integrationSection titled “Finding an extension or integration” If you’re looking for a service, we recommend starting with the Extensions directory in the Netlify team dashboard at Extensions. Installing an extension or integrationSection titled “Installing an extension or integration” For next steps, you can follow in the in-app help or go to the Extensions install docs. Installing Netlify AppsSection titled “Installing Netlify Apps” The top two apps that Netlify manages are the Netlify App for Slack and the Netlify App for GitHub. For next steps on installing the Netlify app for Slack, you can follow in the in-app help or go to the Netlify apps install docs. Installing a build pluginSection titled “Installing a build plugin” Build plugins are the predecessor to extensions and are still available in the Netlify UI. For next steps, you can follow in the in-app help or go to the Build plugins install docs. Last 11, 2025 PreviousVercel to Netlify migration checklistNextExtensions and integrations Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.288Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":868}}112{"id":"doc-deploy_notifications_netlify_docs-0321951b","source":"documentation","title":"Deploy notifications | Netlify Docs","url":"https://docs.netlify.com/deploy/deploy-notifications","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview Slack notifications Email notifications HTTP Post Request Payload signature GitHub commit statuses GitHub pull request comments GitHub commit checks GitLab commit statuses GitLab merge request comments Troubleshoot GitLab deploy notifications GitLab deploy notifications stop working Bitbucket notifications Bitbucket commit statuses Bitbucket pull request comments Azure DevOps notifications Azure DevOps commit statuses Azure DevOps pull request comments Notifications for monorepos or repositories building multiple apps Zapier integrations n8n integrations On this page Overview Slack notifications Email notifications HTTP Post Request Payload signature GitHub commit statuses GitHub pull request comments GitHub commit checks GitLab commit statuses GitLab merge request comments Troubleshoot GitLab deploy notifications GitLab deploy notifications stop working Bitbucket notifications Bitbucket commit statuses Bitbucket pull request comments Azure DevOps notifications Azure DevOps commit statuses Azure DevOps pull request comments Notifications for monorepos or repositories building multiple apps Zapier integrations n8n integrations For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending decoded = JWT.decode(signature, \"your signature secret\", true, options) ## decoded : ## [ ## { sha256: \"...\" }, # this is the data in the token ## { alg: \"...\" } # this is the header in the token ## ] decoded.first[:sha256] == Digest::SHA256.hexdigest(body)rescue JWT::DecodeError falseend post \"/netlify-hook\" do body = request.body.read halt 403 unless signed(request, body) json = JSON.parse(body) # do something with the notification payload hereend If your project uses Node.js with Express for backend, you need to compare the incoming request data before it’s transformed to crypto from \"crypto\";import jwt from \"jsonwebtoken\";import express from \"express\"; const app = express(); // parse body and keep the raw contentsapp.use( bodyParser.json({ verify: (req, res, buffer, encoding) => { req.rawBody = buffer; } })); app.post(\"/\", (req, res) => { const signature = req.headers['x-webhook-signature']; const isValid = validateSignature(signature, req.rawBody); res.send(isValid);}); app.listen(3000); const secret = \"your signature secret\"; function validateSignature(token, buffer) { const options = { issuer: \"netlify\", algorithms: [\"HS256\"] }; const decoded = jwt.verify(token, secret, options); const hashedBody = crypto.createHash(\"sha256\").update(buffer).digest(\"hex\"); return decoded.sha256 === hashedBody;} GitHub commit statusesSection titled “GitHub commit statuses” This type of notification sets commit status directly in your GitHub pull requests and commit lists. For successful deploys, this will include a link to the Deploy Preview. For failed deploys, this will include a link to the detail page for the deploy where you can examine the deploy log and deploy the latest branch commit. These notifications are added to all new GitHub-connected Netlify sites by default. You can add, remove, or edit them in Project configuration > Notifications > Deploy notifications. The settings include a field for a custom message, which will replace the “Deploy preview ready!” message that displays by default. GitHub pull request commentsSection titled “GitHub pull request comments” This type of notification adds a comment to your GitHub pull requests indicating the status of the associated deploy and providing a link to the Deploy Preview when ready. If you append more commits to a pull request, this notification will update the comment to indicate status changes. GitHub pull request comment notifications are added to all new GitHub-connected Netlify sites by default. You can add, remove, or edit them in Project configuration > Notifications > Deploy notifications. The settings include a field for a custom message, which will replace the “Deploy preview ready!” message that displays by default. GitHub commit checksSection titled “GitHub commit checks” This type of notification adds rich deploy information from your deploy summary to your GitHub pull requests and commit lists. This includes more detailed information in the Checks tab of your pull requests on GitHub. These notifications are added to all new GitHub-connected Netlify sites by default. You can add, remove, or edit them in Project configuration > Notifications > Deploy notifications. If you don’t find the option for GitHub commit checks in the Add notification menu, you will need to configure your site to use the Netlify GitHub App. GitLab commit statusesSection titled “GitLab commit statuses” Personal access token (PAT) required If your deploy notifications stop working, you may need to add a GitLab PAT to Netlify. Learn more at our Troubleshoot GitLab notifications docs. This type of notification creates commit statuses in your GitLab repositories. You can configure this notification through the Netlify UI using your GitLab personal access token (PAT). Your PAT must have the api scope. Learn more in GitLab’s PAT docs. You can add, remove, or edit access in Project configuration > Notifications > Deploy notifications. GitLab merge request commentsSection titled “GitLab merge request comments” Personal access token (PAT) required If your deploy notifications stop working, you may need to add a GitLab PAT to Netlify. Learn more at our Troubleshoot GitLab notifications docs. This type of notification adds a comment to your GitLab merge requests indicating the status of the associated deploy and providing a link to the Deploy Preview when ready. If you append more commits to a merge request, this notification will update the comment to indicate status changes. You can configure this notification through the Netlify UI using your GitLab personal access token (PAT). Your PAT must have the api scope. Learn more in GitLab’s PAT docs. You can add, remove, or edit access in Project configuration > Notifications > Deploy notifications. Troubleshoot GitLab deploy notificationsSection titled “Troubleshoot GitLab deploy notifications” If you set up your GitLab deploy notifications with a GitLab API access token, you’ll need to edit your notifications settings in the Netlify UI and add a GitLab personal access token (PAT). GitLab 15.0 no longer supports OAuth tokens without an expiration date and introduced a 2-hour expiration window. Learn more about expiring tokens in GitLab’s OAuth docs. Use Git Gateway or collaborative Deploy Previews? Your connection to GitLab for these features may also be impacted by the GitLab 15.0 update. Learn more about how to resolve these issues for Git Gateway or collaborative Deploy Previews. GitLab deploy notifications stop workingSection titled “GitLab deploy notifications stop working” If your GitLab deploy notifications stop working, ensure that you are using a GitLab personal access token (PAT) with the right scopes. On GitLab, generate a new GitLab PAT with the api scope. Learn more in GitLab’s PAT docs. On Netlify, add your GitLab PAT for each desired deploy notification at Project configuration > Notifications > Deploy notifications. Bitbucket notificationsSection titled “Bitbucket notifications” Deploy notifications for Bitbucket allow your team to check out the latest deploy status and Deploy Preview from Bitbucket. Bitbucket commit statusesSection titled “Bitbucket commit statuses” This type of notification sets commit statuses directly in your Bitbucket branches, pull requests, and commit lists. For successful deploys, this will include a link to the Deploy Preview. For failed deploys, this will include a link to the detail page for the deploy where you can examine the deploy log and deploy the latest branch commit. Bitbucket pull request commentsSection titled “Bitbucket pull request comments” This type of notification adds a comment to your Bitbucket pull requests with a Deploy Preview link and deploy status. This comment automatically updates with any new commits to your pull request. Azure DevOps notificationsSection titled “Azure DevOps notifications” Deploy notifications for Azure DevOps allow your team to check out the latest deploy status and Deploy Preview from Azure DevOps. Azure DevOps commit statusesSection titled “Azure DevOps commit statuses” This type of notification adds a Netlify Deploy Preview link to the Commit details page for successfully deployed commits. To set up this notification, you must create an Azure DevOps personal access token (PAT) with & write permissions. Once you have a PAT, configure the notification on Netlify. Go to Project configuration > Notifications > Deploy notifications, select Azure DevOps commit status, and add your PAT. Once configured, you can open a Deploy Preview for a commit with a successful build. To open a Deploy Preview from Azure DevOps, go to the Commit details page, and select the succeeded build status for the desired commit. Azure DevOps pull request commentsSection titled “Azure DevOps pull request comments” This type of notification adds a comment to your Azure DevOps pull requests with a Deploy Preview link and deploy status. This comment automatically updates with any new commits to your pull request. To set up this notification, you must create an Azure DevOps personal access token (PAT) with & write permissions. Once you have a PAT, configure this notification on Netlify. Go to Project configuration > Notifications > Deploy notifications, select Azure DevOps pull request comment, and add your PAT. Notifications for monorepos or repositories building multiple appsSection titled “Notifications for monorepos or repositories building multiple apps” For monorepos or setups where one repository builds multiple applications, you can manage the amount of commit status and commit check notifications for sites linked from GitHub or GitLab. This team-level setting works in tandem with deploy notifications configured individually for each site. Check out our monorepo docs to learn more. Zapier integrationsSection titled “Zapier integrations” Netlify is available on Zapier, where you can connect Netlify with over 1,000 other applications. You can use Zapier “Zaps” to trigger an action in another service on every successful deploy or when a deploy does not complete. You can find out more on our blog, or use one of the templates below to get new Netlify deployments in Status Hero Netlify + Status Hero Use this Zap Make ServiceNow records from new Netlify deploy failures Netlify + ServiceNow Use this Zap Plant trees with Ecologi when new deploys in Netlify succeed Ecologi + Netlify Use this Zap n8n integrationsSection titled “n8n integrations” Netlify is available on n8n, an open source tool that allows you to connect Netlify with other applications. By using one of n8n’s Netlify nodes, you can create your own automated workflow. To get started, you can use the Netlify node, Netlify Trigger node, or you can use the existing workflow notification when deployment fails Netlify Trigger Node Use workflow Last 18, 2026 PreviousProtect deploysNextHeads up display Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nrequire \"digest\"require \"jwt\"require \"sinatra\"\ndef signed(request, body)  signature = request[\"X-Webhook-Signature\"]  return unless signature\n  options = {iss: \"netlify\", verify_iss: true, algorithm: \"HS256\"}  decoded = JWT.decode(signature, \"your signature secret\", true, options)\n  ## decoded :  ## [  ##   { sha256: \"...\" }, # this is the data in the token  ##   { alg: \"...\" } # this is the header in the token  ## ]  decoded.first[:sha256] == Digest::SHA256.hexdigest(body)rescue JWT::DecodeError  falseend\npost \"/netlify-hook\" do  body = request.body.read  halt 403 unless signed(request, body)\n  json = JSON.parse(body)  # do something with the notification payload hereend\n```\n\nExample:\n```text\nimport crypto from \"crypto\";import jwt from \"jsonwebtoken\";import express from \"express\";\nconst app = express();\n// parse body and keep the raw contentsapp.use(  bodyParser.json({    verify: (req, res, buffer, encoding) => {      req.rawBody = buffer;    }  }));\napp.post(\"/\", (req, res) => {  const signature = req.headers['x-webhook-signature'];  const isValid = validateSignature(signature, req.rawBody);  res.send(isValid);});\napp.listen(3000);\nconst secret = \"your signature secret\";\nfunction validateSignature(token, buffer) {  const options = { issuer: \"netlify\", algorithms: [\"HS256\"] };  const decoded = jwt.verify(token, secret, options);  const hashedBody = crypto.createHash(\"sha256\").update(buffer).digest(\"hex\");  return decoded.sha256 === hashedBody;}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.290Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":24,"estimatedTokens":3595}}113{"id":"doc-develop_build_plugins_netlify_docs-fdb1dc7f","source":"documentation","title":"Develop Build Plugins | Netlify Docs","url":"https://docs.netlify.com/extend/develop-and-share/develop-build-plugins","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Develop & share Develop & share Overview Develop extensions and integrations Develop build plugins Share build plugins On this page Overview ES modules Plug into events Anatomy of a plugin Local plugins Plugin values constants inputs netlifyConfig packageJson Environment variables Plugin methods Utilities Error reporting Logging Asynchronous code Dynamic events On this page Overview ES modules Plug into events Anatomy of a plugin Local plugins Plugin values constants inputs netlifyConfig packageJson Environment variables Plugin methods Utilities Error reporting Logging Asynchronous code Dynamic events For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending // index.js module.exports = { onPreBuild: () => { console.log(\"Hello world from onPreBuild event!\"); },} The plugin defined above will output Hello world from onPreBuild event! right before the site’s build command is run. The index.js file runs in a regular Node.js environment and can use any Node.js core methods and modules. Environment variables, redirects, headers, and build configuration can be accessed and modified with netlifyConfig. Store both files together in a single folder. You can store this folder with your site code to run as a local plugin, or you can publish the plugin to npm. Use a compatible Node.js version For optimum compatibility while developing or running plugins, we recommend using the default version of Node.js installed by Netlify. However, you can also specify a different version for your project's setup, if needed. Local pluginsSection titled “Local plugins” You can run your own custom plugins from within your site repository without publishing to npm. To do this, save your plugin index.js and manifest.yml files into a folder in the repository. Then, using the file-based installation method, specify the absolute path to your plugin folder in the package field. The following example installs a local plugin stored in /plugins/netlify-plugin-hello-world: # netlify.toml [[plugins]]package = \"/plugins/netlify-plugin-hello-world\" Take care with formatting Each plugin you add to the netlify.toml file must have its own [[plugins]] line. For a local plugin, the package value must start with . or /. With a local plugin declared, you can verify it’s loading correctly by using the Netlify CLI to run the build locally. Plugin valuesSection titled “Plugin values” When a plugin runs, it can receive certain : values generated by the plugin event configured by the plugin user site’s Netlify configuration contents of the site’s package.json file environment available in the Netlify build environment constantsSection titled “constants” Each event handler includes a constants key. ES modules Common JS // index.js export const onPreBuild = function({ constants }) { console.log(constants);} // index.js module.exports = { onPreBuild: ({ constants }) => { console.log(constants); },} The constants key contains the following : path to the Netlify configuration file. undefined if none was used. that contains the deploy-ready HTML files and assets generated by the build. Its value is always defined, but the target might not have been created yet. where function source code lives. undefined if no netlify/functions directory exists in the base directory and if not specified by the user. where built serverless functions are placed before deployment. Its value is always defined, but the target might not have been created yet. indicating whether the build was run locally or on Netlify. of Netlify Build as a major.minor.patch string. site ID. Along with these constants, plugins can also access any of the environment variables that are available in the build environment. inputsSection titled “inputs” If your plugin requires additional values from the user, you can specify these requirements in an inputs array in the plugin’s manifest.yml file: # manifest.yml : - to save the generated HTML Lighthouse report - deploy if minimum threshold scores are not met - value mapping of thresholds that will fail the build when not passed When you or a user install the plugin, the input names are used as keys with user-supplied values in the site netlify.toml file: # netlify.toml [[plugins]]package = \"./plugins/netlify-plugin-lighthouse\" [plugins.inputs] output_path = \"reports/lighthouse.html\" fail_deploy_on_score_thresholds = \"true\" [plugins.inputs.thresholds] performance = 0.9 accessibility = 0.9 best-practices = 0.9 seo = 0.9 pwa = 0.9 These inputs values are passed into the plugin when the event handlers are being executed. To access them in your plugin code you can use the following modules Common JS // index.js export const onPreBuild = function({ inputs }) { console.log(inputs.output_path); console.log(inputs.thresholds);} // index.js module.exports = { onPreBuild: ({ inputs }) => { console.log(inputs.output_path); console.log(inputs.thresholds); },} Plugin inputs cannot be set through the Netlify UI Currently, users cannot set inputs when installing plugins from the Netlify UI. If you would like your plugin to be listed under Project configuration > Build & deploy > Build plugins, we recommend setting zero-config defaults where possible, falling back to accepting values from build environment variables if needed. Input validationSection titled “Input validation” Plugin inputs can be validated using the inputs property in the plugin manifest.yml file: # manifest.yml : - to save the generated HTML Lighthouse report default: \"reports/lighthouse.html\" - deploy if minimum threshold scores are not met - value mapping of thresholds that will fail the build when not passed The inputs property is an array of objects with the following {string}: name of the input. Required. description {string}: description of the input. required {boolean} default {any}: default value. Always use inputs for validation We recommended using the inputs property to validate your plugin inputs and assign default values. This works more consistently and efficiently than coding your own validation inside event handlers. netlifyConfigSection titled “netlifyConfig” When an event handler executes, a site’s Netlify configuration is normalized by @netlify/config and passed as a netlifyConfig object. Normalization includes applying context-specific or branch-specific settings and combining settings from netlify.toml with build settings configured in the Netlify UI. After normalization, plugins can access and modify most netlifyConfig properties during a site’s build. These include redirects, headers, and build configuration. If a site doesn’t use netlify.toml or build settings selections in the Netlify UI, netlifyConfig and its properties contain default build settings. Here’s a list of modifiable : array of redirects with their modifiable options of headers with their modifiable options with options for modifying functions functions.directory: string that includes the path to a site’s functions directory of edge functions with their modifiable options build.command: string that includes a site’s build command build.environment: object that contains a subset of a site’s environment variables build.edge_functions: string that includes the path to a site’s edge functions directory build.processing: object that includes options for post processing HTML And here’s a plugin code sample that modifies several of the above properties. ES modules Common JS // index.js export const onPreBuild = function({ netlifyConfig }) { const newCommand = `node YOUR_SCRIPT.js`; // Run a script after the build command netlifyConfig.build.command = netlifyConfig.build.command ? `${netlifyConfig.build.command} && ${newCommand}` : newCommand; // Modify build command's environment variables netlifyConfig.build.environment.DATABASE_URI = getDatabaseUri(); // Add redirects netlifyConfig.redirects.push({ from: \"/ORIGIN_PATH\", to: \"/DESTINATION_PATH\", }); // Add headers netlifyConfig.headers.push({ for: \"/YOUR_PATH\", values: { YOUR_HEADER_NAME: \"YOUR_HEADER_VALUE\" }, }); // Add edge functions netlifyConfig.edge_functions ? netlifyConfig.edge_functions.push({ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' }) : (netlifyConfig.edge_functions = [{ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' }])} // index.js module.exports = { onPreBuild({ netlifyConfig }) { const newCommand = `node YOUR_SCRIPT.js`; // Run a script after the build command netlifyConfig.build.command = netlifyConfig.build.command ? `${netlifyConfig.build.command} && ${newCommand}` : newCommand; // Modify build command's environment variables netlifyConfig.build.environment.DATABASE_URI = getDatabaseUri(); // Add redirects netlifyConfig.redirects.push({ from: \"/ORIGIN_PATH\", to: \"/DESTINATION_PATH\", }); // Add headers netlifyConfig.headers.push({ for: \"/YOUR_PATH\", values: { YOUR_HEADER_NAME: \"YOUR_HEADER_VALUE\" }, }); // Add edge functions netlifyConfig.edge_functions ? netlifyConfig.edge_functions.push({ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' }) : (netlifyConfig.edge_functions = [{ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' }]) },}; packageJsonSection titled “packageJson” Each plugin event handler includes a packageJson argument. When an event handler executes, the contents of the package.json in a site’s base directory get passed to a plugin. The data fields are normalized to prevent plugin errors. If the site has no package.json, the argument is an empty object. To access the packageJson object in your plugin code, use the following modules Common JS // index.js export const onPreBuild = function({ packageJson }) { console.log(packageJson);} // index.js module.exports = { onPreBuild: ({ packageJson }) => { console.log(packageJson); },} Environment variablesSection titled “Environment variables” Plugins can access build environment variables two different : includes all Netlify build environment variables and any variables you declare using the Netlify UI or TOML. We recommend you use this when you only need to get values during the build process. netlifyConfig.build.environment: includes only the variables you declare using the Netlify UI or TOML. We recommend you use this when you need to modify values during the build process. Visit our Forums for a verified Support Guide on how to access environment variables during your site build. Plugin methodsSection titled “Plugin methods” We’ve provided a number of utilities and API methods to assist you in writing plugins. UtilitiesSection titled “Utilities” Several utilities are provided with the utils argument to event : used to report errors or cancel builds to display information in the deploy summary to cache files between builds to run commands and processes to retrieve Git-related information such as the list of modified/created/deleted files ES modules Common JS // index.js export const onPreBuild = async function({ utils: { build, status, cache, run, git } }) { await run.command(\"eslint src/ test/\");} // index.js module.exports = { ({ utils: { build, status, cache, run, git } }) => { await run.command(\"eslint src/ test/\"); },} Error reportingSection titled “Error reporting” Exceptions thrown inside event handlers are reported in logs as bugs. Instead of using the onError event to handle exceptions, plugins should rely on try/catch/finally blocks and use utils.build: ES modules Common JS // index.js export const onPreBuild = function({ utils }) { try { badMethod(); } catch (error) { utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\"); }} // index.js module.exports = { onPreBuild: ({ utils }) => { try { badMethod(); } catch (error) { utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\"); } },} The following methods are available depending on the error’s (\"YOUR_MESSAGE\"): method that fails the build - the build in your dashboard would show “Failed”. Use this to indicate something went wrong. utils.build.failPlugin(\"YOUR_MESSAGE\"): method that fails the plugin but not the build. utils.build.cancelBuild(\"YOUR_MESSAGE\"): method that cancels the build - the dashboard would show “Cancelled” for that build. Use this to indicate that the build is being cancelled as planned. utils.build.failBuild(), utils.build.failPlugin() and utils.build.cancelBuild() can specify an options object with the following : original Error instance. Its stack trace will be preserved and its error message will be appended to the \"YOUR_MESSAGE\" argument. ES modules Common JS // index.js export const onPreBuild = function({ utils }) { try { badMethod(); } catch (error) { utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error }); }} // index.js module.exports = { onPreBuild: ({ utils }) => { try { badMethod(); } catch (error) { utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error }); } },} LoggingSection titled “Logging” Anything logged to the console will be printed in the build logs. ES modules Common JS // index.js export const onPreBuild = function() { console.log(\"This is printed in the build logs\");} // index.js module.exports = { onPreBuild() { console.log(\"This is printed in the build logs\"); },} If you’d prefer to make the information more visible, utils.status.show() can be used to display them in the deploy summary instead. ES modules Common JS // index.js export const onPreBuild = function({ utils }) { utils.status.show({ // Optional. Default to the plugin’s name followed by a generic title. title: \"Main title\", // Required. summary: \"Message below the title\", // Optional. Empty by default. text: \"Detailed information shown in a collapsible section\", });} // index.js module.exports = { onPreBuild({ utils }) { utils.status.show({ // Optional. Default to the plugin’s name followed by a generic title. title: \"Main title\", // Required. summary: \"Message below the title\", // Optional. Empty by default. text: \"Detailed information shown in a collapsible section\", }); },} Only one status is shown per plugin. Calling utils.status.show() twice overrides the previous status. This is meant for successful information. Errors should be reported with utils.build.* instead. Asynchronous codeSection titled “Asynchronous code” Asynchronous code can be achieved by using async modules Common JS // index.js export const onPreBuild = async function({ utils }) { try { await doSomethingAsync(); } catch (error) { utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error }); }} // index.js module.exports = { ({ utils }) => { try { await doSomethingAsync(); } catch (error) { utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error }); } },} Any thrown Error or rejected Promise that is not handled by utils.build will be shown in the build logs as a plugin bug. ES modules Common JS // index.js export const onPreBuild = async function({ utils }) { // Any error thrown inside this function will be shown // in the build logs as a plugin bug. await doSomethingAsync();} // index.js module.exports = { ({ utils }) => { // Any error thrown inside this function will be shown // in the build logs as a plugin bug. await doSomethingAsync(); },} Plugins end as soon as their methods end. Therefore you should await any asynchronous operation. The following examples show invalid code and the way to fix it. ES modules Common JS // index.js// Example of how to use callbacks. const { promisify } = require(\"util\"); // VALID use this.// This callback will be awaited.export const onPostBuild = async function({ utils }) { const response = await promisify(doSomethingAsync)(); console.log(response);} // INVALID not use this.// This callback will not be awaited.export const onPostBuild = function({ utils }) { doSomethingAsync((error, response) => { console.log(response); })} // index.js// Example of how to use callbacks. const { promisify } = require(\"util\"); module.exports = { // VALID use this. // This callback will be awaited. ({ utils }) => { const response = await promisify(doSomethingAsync)(); console.log(response); }, // INVALID not use this. // This callback will not be awaited. onPreBuild: ({ utils }) => { doSomethingAsync((error, response) => { console.log(response); }) },} ES modules Common JS // index.js// Example of how to use events. const pEvent = require(\"p-event\"); // VALID use this.// This event will be awaited.export const onPreBuild = async function({ utils }) { const emitter = doSomethingAsync(); emitter.start(); const response = await pEvent(emitter, \"response\"); console.log(response);} // INVALID not use this.// This event will not be awaited.export const onPreBuild = function({ utils }) { const emitter = doSomethingAsync(); emitter.on(\"response\", response => { console.log(response) }); emitter.start()} // index.js// Example of how to use events. const pEvent = require(\"p-event\"); module.exports = { // VALID use this. // This event will be awaited. ({ utils }) => { const emitter = doSomethingAsync(); emitter.start(); const response = await pEvent(emitter, \"response\"); console.log(response); }, // INVALID not use this. // This event will not be awaited. onPreBuild: ({ utils }) => { const emitter = doSomethingAsync(); emitter.on(\"response\", response => { console.log(response) }); emitter.start(); },} ES modules Common JS // index.js// Example of how to use `Array.forEach()`. // VALID use this.// This callback will be awaited.export const onPostBuild = async function({ utils }) { await Promise.all( array.map(async () => { await doSomethingAsync() }), );} // INVALID not use this.// This callback will not be awaited.export const onPostBuild = function({ utils }) { array.forEach(async () => { await doSomethingAsync(); });} // index.js// Example of how to use `Array.forEach()`. module.exports = { // VALID use this. // This callback will be awaited. ({ utils }) => { await Promise.all( array.map(async () => { await doSomethingAsync(); }), ); }, // INVALID not use this. // This callback will not be awaited. onPreBuild: ({ utils }) => { array.forEach(async () => { await doSomethingAsync(); }); },} Dynamic eventsSection titled “Dynamic events” Some plugins trigger different events depending on the user’s inputs. This can be achieved by returning the plugin object from a function instead. ES modules Common JS // index.js export default function helloWorldPlugin(inputs) { if (inputs.before) { return { onPreBuild: () => { console.log(\"Hello world from onPreBuild event!\"); }, } } else { return { onPostBuild: () => { console.log(\"Hello world from onPostBuild event!\"); }, } }}; // index.js module.exports = function helloWorldPlugin(inputs) { if (inputs.before) { return { onPreBuild: () => { console.log(\"Hello world from onPreBuild event!\"); }, } } else { return { onPostBuild: () => { console.log(\"Hello world from onPostBuild event!\"); }, } }} Last 31, 2026 PreviousDevelop extensions and integrationsNextShare build plugins Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# manifest.yml\nname: netlify-plugin-hello-world\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function() {  console.log(\"Hello world from onPreBuild event!\");}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: () => {    console.log(\"Hello world from onPreBuild event!\");  },}\n```\n\nExample:\n```text\n# netlify.toml\n[[plugins]]package = \"/plugins/netlify-plugin-hello-world\"\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ constants }) {  console.log(constants);}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: ({ constants }) => {    console.log(constants);  },}\n```\n\nExample:\n```text\n# manifest.yml\nname: netlify-plugin-lighthouseinputs:  - name: output_path    description: Path to save the generated HTML Lighthouse report  - name: fail_deploy_on_score_thresholds    description: Fail deploy if minimum threshold scores are not met  - name: thresholds    description: Key value mapping of thresholds that will fail the build when not passed\n```\n\nExample:\n```text\n# netlify.toml\n[[plugins]]package = \"./plugins/netlify-plugin-lighthouse\"\n  [plugins.inputs]    output_path = \"reports/lighthouse.html\"    fail_deploy_on_score_thresholds = \"true\"\n  [plugins.inputs.thresholds]    performance = 0.9    accessibility = 0.9    best-practices = 0.9    seo = 0.9    pwa = 0.9\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ inputs }) {  console.log(inputs.output_path);  console.log(inputs.thresholds);}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: ({ inputs }) => {    console.log(inputs.output_path);    console.log(inputs.thresholds);  },}\n```\n\nExample:\n```text\n# manifest.yml\nname: netlify-plugin-lighthouseinputs:  - name: output_path    required: false    description: Path to save the generated HTML Lighthouse report    default: \"reports/lighthouse.html\"  - name: fail_deploy_on_score_thresholds    required: false    description: Fail deploy if minimum threshold scores are not met  - name: thresholds    required: false    description: Key value mapping of thresholds that will fail the build when not passed\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ netlifyConfig }) {  const newCommand = `node YOUR_SCRIPT.js`;\n  // Run a script after the build command  netlifyConfig.build.command = netlifyConfig.build.command    ? `${netlifyConfig.build.command} && ${newCommand}`    : newCommand;\n  // Modify build command's environment variables  netlifyConfig.build.environment.DATABASE_URI = getDatabaseUri();\n  // Add redirects  netlifyConfig.redirects.push({    from: \"/ORIGIN_PATH\",    to: \"/DESTINATION_PATH\",  });\n  // Add headers  netlifyConfig.headers.push({    for: \"/YOUR_PATH\",    values: { YOUR_HEADER_NAME: \"YOUR_HEADER_VALUE\" },  });\n  // Add edge functions  netlifyConfig.edge_functions    ? netlifyConfig.edge_functions.push({ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' })    : (netlifyConfig.edge_functions = [{ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' }])}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild({ netlifyConfig }) {    const newCommand = `node YOUR_SCRIPT.js`;\n    // Run a script after the build command    netlifyConfig.build.command = netlifyConfig.build.command      ? `${netlifyConfig.build.command} && ${newCommand}`      : newCommand;\n    // Modify build command's environment variables    netlifyConfig.build.environment.DATABASE_URI = getDatabaseUri();\n    // Add redirects    netlifyConfig.redirects.push({      from: \"/ORIGIN_PATH\",      to: \"/DESTINATION_PATH\",    });\n    // Add headers    netlifyConfig.headers.push({      for: \"/YOUR_PATH\",      values: { YOUR_HEADER_NAME: \"YOUR_HEADER_VALUE\" },    });\n    // Add edge functions    netlifyConfig.edge_functions      ? netlifyConfig.edge_functions.push({ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' })      : (netlifyConfig.edge_functions = [{ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' }])  },};\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ packageJson }) {  console.log(packageJson);}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: ({ packageJson }) => {    console.log(packageJson);  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = async function({ utils: { build, status, cache, run, git } }) {  await run.command(\"eslint src/ test/\");}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: async ({ utils: { build, status, cache, run, git } }) => {    await run.command(\"eslint src/ test/\");  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ utils }) {  try {    badMethod();  } catch (error) {    utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\");  }}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: ({ utils }) => {    try {      badMethod();    } catch (error) {      utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\");    }  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ utils }) {  try {    badMethod();  } catch (error) {    utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error });  }}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: ({ utils }) => {    try {      badMethod();    } catch (error) {      utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error });    }  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function() {  console.log(\"This is printed in the build logs\");}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild() {    console.log(\"This is printed in the build logs\");  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ utils }) {  utils.status.show({    // Optional. Default to the plugin’s name followed by a generic title.    title: \"Main title\",    // Required.    summary: \"Message below the title\",    // Optional. Empty by default.    text: \"Detailed information shown in a collapsible section\",  });}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild({ utils }) {    utils.status.show({      // Optional. Default to the plugin’s name followed by a generic title.      title: \"Main title\",      // Required.      summary: \"Message below the title\",      // Optional. Empty by default.      text: \"Detailed information shown in a collapsible section\",    });  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = async function({ utils }) {  try {    await doSomethingAsync();  } catch (error) {    utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error });  }}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: async ({ utils }) => {    try {      await doSomethingAsync();    } catch (error) {      utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error });    }  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = async function({ utils }) {\n  // Any error thrown inside this function will be shown  // in the build logs as a plugin bug.\n  await doSomethingAsync();}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: async ({ utils }) => {\n    // Any error thrown inside this function will be shown    // in the build logs as a plugin bug.\n    await doSomethingAsync();  },}\n```\n\nExample:\n```text\n// index.js// Example of how to use callbacks.\nconst { promisify } = require(\"util\");\n// VALID EXAMPLE: please use this.// This callback will be awaited.export const onPostBuild = async function({ utils }) {  const response = await promisify(doSomethingAsync)();\n  console.log(response);}\n// INVALID EXAMPLE: do not use this.// This callback will not be awaited.export const onPostBuild = function({ utils }) {  doSomethingAsync((error, response) => {    console.log(response);  })}\n```\n\nExample:\n```text\n// index.js// Example of how to use callbacks.\nconst { promisify } = require(\"util\");\nmodule.exports = {\n  // VALID EXAMPLE: please use this.  // This callback will be awaited.  onPostBuild: async ({ utils }) => {    const response = await promisify(doSomethingAsync)();\n    console.log(response);  },\n  // INVALID EXAMPLE: do not use this.  // This callback will not be awaited.  onPreBuild: ({ utils }) => {    doSomethingAsync((error, response) => {      console.log(response);    })  },}\n```\n\nExample:\n```text\n// index.js// Example of how to use events.\nconst pEvent = require(\"p-event\");\n// VALID EXAMPLE: please use this.// This event will be awaited.export const onPreBuild = async function({ utils }) {  const emitter = doSomethingAsync();\n  emitter.start();\n  const response = await pEvent(emitter, \"response\");\n  console.log(response);}\n// INVALID EXAMPLE: do not use this.// This event will not be awaited.export const onPreBuild = function({ utils }) {  const emitter = doSomethingAsync();\n  emitter.on(\"response\", response => {    console.log(response)  });\n  emitter.start()}\n```\n\nExample:\n```text\n// index.js// Example of how to use events.\nconst pEvent = require(\"p-event\");\nmodule.exports = {  // VALID EXAMPLE: please use this.  // This event will be awaited.  onPreBuild: async ({ utils }) => {    const emitter = doSomethingAsync();\n    emitter.start();\n    const response = await pEvent(emitter, \"response\");\n    console.log(response);  },\n  // INVALID EXAMPLE: do not use this.  // This event will not be awaited.  onPreBuild: ({ utils }) => {    const emitter = doSomethingAsync();\n    emitter.on(\"response\", response => {      console.log(response)    });\n    emitter.start();  },}\n```\n\nExample:\n```text\n// index.js// Example of how to use `Array.forEach()`.\n// VALID EXAMPLE: please use this.// This callback will be awaited.export const onPostBuild = async function({ utils }) {  await Promise.all(    array.map(async () => {      await doSomethingAsync()    }),  );}\n// INVALID EXAMPLE: do not use this.// This callback will not be awaited.export const onPostBuild = function({ utils }) {  array.forEach(async () => {    await doSomethingAsync();  });}\n```\n\nExample:\n```text\n// index.js// Example of how to use `Array.forEach()`.\nmodule.exports = {  // VALID EXAMPLE: please use this.  // This callback will be awaited.  onPostBuild: async ({ utils }) => {    await Promise.all(      array.map(async () => {        await doSomethingAsync();      }),    );  },\n  // INVALID EXAMPLE: do not use this.  // This callback will not be awaited.  onPreBuild: ({ utils }) => {    array.forEach(async () => {      await doSomethingAsync();    });  },}\n```\n\nExample:\n```text\n// index.js\nexport default function helloWorldPlugin(inputs) {  if (inputs.before) {    return {      onPreBuild: () => {        console.log(\"Hello world from onPreBuild event!\");      },    }  } else {    return {      onPostBuild: () => {        console.log(\"Hello world from onPostBuild event!\");      },    }  }};\n```\n\nExample:\n```text\n// index.js\nmodule.exports = function helloWorldPlugin(inputs) {  if (inputs.before) {    return {      onPreBuild: () => {        console.log(\"Hello world from onPreBuild event!\");      },    }  } else {    return {      onPostBuild: () => {        console.log(\"Hello world from onPostBuild event!\");      },    }  }}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.293Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":37,"totalLines":264,"estimatedTokens":7809}}114{"id":"doc-develop_build_plugins_netlify_docs-d0454241","source":"documentation","title":"Develop Build Plugins | Netlify Docs","url":"https://docs.netlify.com/extend/develop-and-share/develop-build-plugins/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Develop & share Develop & share Overview Develop extensions and integrations Develop build plugins Share build plugins On this page Overview ES modules Plug into events Anatomy of a plugin Local plugins Plugin values constants inputs netlifyConfig packageJson Environment variables Plugin methods Utilities Error reporting Logging Asynchronous code Dynamic events On this page Overview ES modules Plug into events Anatomy of a plugin Local plugins Plugin values constants inputs netlifyConfig packageJson Environment variables Plugin methods Utilities Error reporting Logging Asynchronous code Dynamic events For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending // index.js module.exports = { onPreBuild: () => { console.log(\"Hello world from onPreBuild event!\"); },} The plugin defined above will output Hello world from onPreBuild event! right before the site’s build command is run. The index.js file runs in a regular Node.js environment and can use any Node.js core methods and modules. Environment variables, redirects, headers, and build configuration can be accessed and modified with netlifyConfig. Store both files together in a single folder. You can store this folder with your site code to run as a local plugin, or you can publish the plugin to npm. Use a compatible Node.js version For optimum compatibility while developing or running plugins, we recommend using the default version of Node.js installed by Netlify. However, you can also specify a different version for your project's setup, if needed. Local pluginsSection titled “Local plugins” You can run your own custom plugins from within your site repository without publishing to npm. To do this, save your plugin index.js and manifest.yml files into a folder in the repository. Then, using the file-based installation method, specify the absolute path to your plugin folder in the package field. The following example installs a local plugin stored in /plugins/netlify-plugin-hello-world: # netlify.toml [[plugins]]package = \"/plugins/netlify-plugin-hello-world\" Take care with formatting Each plugin you add to the netlify.toml file must have its own [[plugins]] line. For a local plugin, the package value must start with . or /. With a local plugin declared, you can verify it’s loading correctly by using the Netlify CLI to run the build locally. Plugin valuesSection titled “Plugin values” When a plugin runs, it can receive certain : values generated by the plugin event configured by the plugin user site’s Netlify configuration contents of the site’s package.json file environment available in the Netlify build environment constantsSection titled “constants” Each event handler includes a constants key. ES modules Common JS // index.js export const onPreBuild = function({ constants }) { console.log(constants);} // index.js module.exports = { onPreBuild: ({ constants }) => { console.log(constants); },} The constants key contains the following : path to the Netlify configuration file. undefined if none was used. that contains the deploy-ready HTML files and assets generated by the build. Its value is always defined, but the target might not have been created yet. where function source code lives. undefined if no netlify/functions directory exists in the base directory and if not specified by the user. where built serverless functions are placed before deployment. Its value is always defined, but the target might not have been created yet. indicating whether the build was run locally or on Netlify. of Netlify Build as a major.minor.patch string. site ID. Along with these constants, plugins can also access any of the environment variables that are available in the build environment. inputsSection titled “inputs” If your plugin requires additional values from the user, you can specify these requirements in an inputs array in the plugin’s manifest.yml file: # manifest.yml : - to save the generated HTML Lighthouse report - deploy if minimum threshold scores are not met - value mapping of thresholds that will fail the build when not passed When you or a user install the plugin, the input names are used as keys with user-supplied values in the site netlify.toml file: # netlify.toml [[plugins]]package = \"./plugins/netlify-plugin-lighthouse\" [plugins.inputs] output_path = \"reports/lighthouse.html\" fail_deploy_on_score_thresholds = \"true\" [plugins.inputs.thresholds] performance = 0.9 accessibility = 0.9 best-practices = 0.9 seo = 0.9 pwa = 0.9 These inputs values are passed into the plugin when the event handlers are being executed. To access them in your plugin code you can use the following modules Common JS // index.js export const onPreBuild = function({ inputs }) { console.log(inputs.output_path); console.log(inputs.thresholds);} // index.js module.exports = { onPreBuild: ({ inputs }) => { console.log(inputs.output_path); console.log(inputs.thresholds); },} Plugin inputs cannot be set through the Netlify UI Currently, users cannot set inputs when installing plugins from the Netlify UI. If you would like your plugin to be listed under Project configuration > Build & deploy > Build plugins, we recommend setting zero-config defaults where possible, falling back to accepting values from build environment variables if needed. Input validationSection titled “Input validation” Plugin inputs can be validated using the inputs property in the plugin manifest.yml file: # manifest.yml : - to save the generated HTML Lighthouse report default: \"reports/lighthouse.html\" - deploy if minimum threshold scores are not met - value mapping of thresholds that will fail the build when not passed The inputs property is an array of objects with the following {string}: name of the input. Required. description {string}: description of the input. required {boolean} default {any}: default value. Always use inputs for validation We recommended using the inputs property to validate your plugin inputs and assign default values. This works more consistently and efficiently than coding your own validation inside event handlers. netlifyConfigSection titled “netlifyConfig” When an event handler executes, a site’s Netlify configuration is normalized by @netlify/config and passed as a netlifyConfig object. Normalization includes applying context-specific or branch-specific settings and combining settings from netlify.toml with build settings configured in the Netlify UI. After normalization, plugins can access and modify most netlifyConfig properties during a site’s build. These include redirects, headers, and build configuration. If a site doesn’t use netlify.toml or build settings selections in the Netlify UI, netlifyConfig and its properties contain default build settings. Here’s a list of modifiable : array of redirects with their modifiable options of headers with their modifiable options with options for modifying functions functions.directory: string that includes the path to a site’s functions directory of edge functions with their modifiable options build.command: string that includes a site’s build command build.environment: object that contains a subset of a site’s environment variables build.edge_functions: string that includes the path to a site’s edge functions directory build.processing: object that includes options for post processing HTML And here’s a plugin code sample that modifies several of the above properties. ES modules Common JS // index.js export const onPreBuild = function({ netlifyConfig }) { const newCommand = `node YOUR_SCRIPT.js`; // Run a script after the build command netlifyConfig.build.command = netlifyConfig.build.command ? `${netlifyConfig.build.command} && ${newCommand}` : newCommand; // Modify build command's environment variables netlifyConfig.build.environment.DATABASE_URI = getDatabaseUri(); // Add redirects netlifyConfig.redirects.push({ from: \"/ORIGIN_PATH\", to: \"/DESTINATION_PATH\", }); // Add headers netlifyConfig.headers.push({ for: \"/YOUR_PATH\", values: { YOUR_HEADER_NAME: \"YOUR_HEADER_VALUE\" }, }); // Add edge functions netlifyConfig.edge_functions ? netlifyConfig.edge_functions.push({ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' }) : (netlifyConfig.edge_functions = [{ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' }])} // index.js module.exports = { onPreBuild({ netlifyConfig }) { const newCommand = `node YOUR_SCRIPT.js`; // Run a script after the build command netlifyConfig.build.command = netlifyConfig.build.command ? `${netlifyConfig.build.command} && ${newCommand}` : newCommand; // Modify build command's environment variables netlifyConfig.build.environment.DATABASE_URI = getDatabaseUri(); // Add redirects netlifyConfig.redirects.push({ from: \"/ORIGIN_PATH\", to: \"/DESTINATION_PATH\", }); // Add headers netlifyConfig.headers.push({ for: \"/YOUR_PATH\", values: { YOUR_HEADER_NAME: \"YOUR_HEADER_VALUE\" }, }); // Add edge functions netlifyConfig.edge_functions ? netlifyConfig.edge_functions.push({ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' }) : (netlifyConfig.edge_functions = [{ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' }]) },}; packageJsonSection titled “packageJson” Each plugin event handler includes a packageJson argument. When an event handler executes, the contents of the package.json in a site’s base directory get passed to a plugin. The data fields are normalized to prevent plugin errors. If the site has no package.json, the argument is an empty object. To access the packageJson object in your plugin code, use the following modules Common JS // index.js export const onPreBuild = function({ packageJson }) { console.log(packageJson);} // index.js module.exports = { onPreBuild: ({ packageJson }) => { console.log(packageJson); },} Environment variablesSection titled “Environment variables” Plugins can access build environment variables two different : includes all Netlify build environment variables and any variables you declare using the Netlify UI or TOML. We recommend you use this when you only need to get values during the build process. netlifyConfig.build.environment: includes only the variables you declare using the Netlify UI or TOML. We recommend you use this when you need to modify values during the build process. Visit our Forums for a verified Support Guide on how to access environment variables during your site build. Plugin methodsSection titled “Plugin methods” We’ve provided a number of utilities and API methods to assist you in writing plugins. UtilitiesSection titled “Utilities” Several utilities are provided with the utils argument to event : used to report errors or cancel builds to display information in the deploy summary to cache files between builds to run commands and processes to retrieve Git-related information such as the list of modified/created/deleted files ES modules Common JS // index.js export const onPreBuild = async function({ utils: { build, status, cache, run, git } }) { await run.command(\"eslint src/ test/\");} // index.js module.exports = { ({ utils: { build, status, cache, run, git } }) => { await run.command(\"eslint src/ test/\"); },} Error reportingSection titled “Error reporting” Exceptions thrown inside event handlers are reported in logs as bugs. Instead of using the onError event to handle exceptions, plugins should rely on try/catch/finally blocks and use utils.build: ES modules Common JS // index.js export const onPreBuild = function({ utils }) { try { badMethod(); } catch (error) { utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\"); }} // index.js module.exports = { onPreBuild: ({ utils }) => { try { badMethod(); } catch (error) { utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\"); } },} The following methods are available depending on the error’s (\"YOUR_MESSAGE\"): method that fails the build - the build in your dashboard would show “Failed”. Use this to indicate something went wrong. utils.build.failPlugin(\"YOUR_MESSAGE\"): method that fails the plugin but not the build. utils.build.cancelBuild(\"YOUR_MESSAGE\"): method that cancels the build - the dashboard would show “Cancelled” for that build. Use this to indicate that the build is being cancelled as planned. utils.build.failBuild(), utils.build.failPlugin() and utils.build.cancelBuild() can specify an options object with the following : original Error instance. Its stack trace will be preserved and its error message will be appended to the \"YOUR_MESSAGE\" argument. ES modules Common JS // index.js export const onPreBuild = function({ utils }) { try { badMethod(); } catch (error) { utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error }); }} // index.js module.exports = { onPreBuild: ({ utils }) => { try { badMethod(); } catch (error) { utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error }); } },} LoggingSection titled “Logging” Anything logged to the console will be printed in the build logs. ES modules Common JS // index.js export const onPreBuild = function() { console.log(\"This is printed in the build logs\");} // index.js module.exports = { onPreBuild() { console.log(\"This is printed in the build logs\"); },} If you’d prefer to make the information more visible, utils.status.show() can be used to display them in the deploy summary instead. ES modules Common JS // index.js export const onPreBuild = function({ utils }) { utils.status.show({ // Optional. Default to the plugin’s name followed by a generic title. title: \"Main title\", // Required. summary: \"Message below the title\", // Optional. Empty by default. text: \"Detailed information shown in a collapsible section\", });} // index.js module.exports = { onPreBuild({ utils }) { utils.status.show({ // Optional. Default to the plugin’s name followed by a generic title. title: \"Main title\", // Required. summary: \"Message below the title\", // Optional. Empty by default. text: \"Detailed information shown in a collapsible section\", }); },} Only one status is shown per plugin. Calling utils.status.show() twice overrides the previous status. This is meant for successful information. Errors should be reported with utils.build.* instead. Asynchronous codeSection titled “Asynchronous code” Asynchronous code can be achieved by using async modules Common JS // index.js export const onPreBuild = async function({ utils }) { try { await doSomethingAsync(); } catch (error) { utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error }); }} // index.js module.exports = { ({ utils }) => { try { await doSomethingAsync(); } catch (error) { utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error }); } },} Any thrown Error or rejected Promise that is not handled by utils.build will be shown in the build logs as a plugin bug. ES modules Common JS // index.js export const onPreBuild = async function({ utils }) { // Any error thrown inside this function will be shown // in the build logs as a plugin bug. await doSomethingAsync();} // index.js module.exports = { ({ utils }) => { // Any error thrown inside this function will be shown // in the build logs as a plugin bug. await doSomethingAsync(); },} Plugins end as soon as their methods end. Therefore you should await any asynchronous operation. The following examples show invalid code and the way to fix it. ES modules Common JS // index.js// Example of how to use callbacks. const { promisify } = require(\"util\"); // VALID use this.// This callback will be awaited.export const onPostBuild = async function({ utils }) { const response = await promisify(doSomethingAsync)(); console.log(response);} // INVALID not use this.// This callback will not be awaited.export const onPostBuild = function({ utils }) { doSomethingAsync((error, response) => { console.log(response); })} // index.js// Example of how to use callbacks. const { promisify } = require(\"util\"); module.exports = { // VALID use this. // This callback will be awaited. ({ utils }) => { const response = await promisify(doSomethingAsync)(); console.log(response); }, // INVALID not use this. // This callback will not be awaited. onPreBuild: ({ utils }) => { doSomethingAsync((error, response) => { console.log(response); }) },} ES modules Common JS // index.js// Example of how to use events. const pEvent = require(\"p-event\"); // VALID use this.// This event will be awaited.export const onPreBuild = async function({ utils }) { const emitter = doSomethingAsync(); emitter.start(); const response = await pEvent(emitter, \"response\"); console.log(response);} // INVALID not use this.// This event will not be awaited.export const onPreBuild = function({ utils }) { const emitter = doSomethingAsync(); emitter.on(\"response\", response => { console.log(response) }); emitter.start()} // index.js// Example of how to use events. const pEvent = require(\"p-event\"); module.exports = { // VALID use this. // This event will be awaited. ({ utils }) => { const emitter = doSomethingAsync(); emitter.start(); const response = await pEvent(emitter, \"response\"); console.log(response); }, // INVALID not use this. // This event will not be awaited. onPreBuild: ({ utils }) => { const emitter = doSomethingAsync(); emitter.on(\"response\", response => { console.log(response) }); emitter.start(); },} ES modules Common JS // index.js// Example of how to use `Array.forEach()`. // VALID use this.// This callback will be awaited.export const onPostBuild = async function({ utils }) { await Promise.all( array.map(async () => { await doSomethingAsync() }), );} // INVALID not use this.// This callback will not be awaited.export const onPostBuild = function({ utils }) { array.forEach(async () => { await doSomethingAsync(); });} // index.js// Example of how to use `Array.forEach()`. module.exports = { // VALID use this. // This callback will be awaited. ({ utils }) => { await Promise.all( array.map(async () => { await doSomethingAsync(); }), ); }, // INVALID not use this. // This callback will not be awaited. onPreBuild: ({ utils }) => { array.forEach(async () => { await doSomethingAsync(); }); },} Dynamic eventsSection titled “Dynamic events” Some plugins trigger different events depending on the user’s inputs. This can be achieved by returning the plugin object from a function instead. ES modules Common JS // index.js export default function helloWorldPlugin(inputs) { if (inputs.before) { return { onPreBuild: () => { console.log(\"Hello world from onPreBuild event!\"); }, } } else { return { onPostBuild: () => { console.log(\"Hello world from onPostBuild event!\"); }, } }}; // index.js module.exports = function helloWorldPlugin(inputs) { if (inputs.before) { return { onPreBuild: () => { console.log(\"Hello world from onPreBuild event!\"); }, } } else { return { onPostBuild: () => { console.log(\"Hello world from onPostBuild event!\"); }, } }} Last 31, 2026 PreviousDevelop extensions and integrationsNextShare build plugins Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# manifest.yml\nname: netlify-plugin-hello-world\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function() {  console.log(\"Hello world from onPreBuild event!\");}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: () => {    console.log(\"Hello world from onPreBuild event!\");  },}\n```\n\nExample:\n```text\n# netlify.toml\n[[plugins]]package = \"/plugins/netlify-plugin-hello-world\"\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ constants }) {  console.log(constants);}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: ({ constants }) => {    console.log(constants);  },}\n```\n\nExample:\n```text\n# manifest.yml\nname: netlify-plugin-lighthouseinputs:  - name: output_path    description: Path to save the generated HTML Lighthouse report  - name: fail_deploy_on_score_thresholds    description: Fail deploy if minimum threshold scores are not met  - name: thresholds    description: Key value mapping of thresholds that will fail the build when not passed\n```\n\nExample:\n```text\n# netlify.toml\n[[plugins]]package = \"./plugins/netlify-plugin-lighthouse\"\n  [plugins.inputs]    output_path = \"reports/lighthouse.html\"    fail_deploy_on_score_thresholds = \"true\"\n  [plugins.inputs.thresholds]    performance = 0.9    accessibility = 0.9    best-practices = 0.9    seo = 0.9    pwa = 0.9\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ inputs }) {  console.log(inputs.output_path);  console.log(inputs.thresholds);}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: ({ inputs }) => {    console.log(inputs.output_path);    console.log(inputs.thresholds);  },}\n```\n\nExample:\n```text\n# manifest.yml\nname: netlify-plugin-lighthouseinputs:  - name: output_path    required: false    description: Path to save the generated HTML Lighthouse report    default: \"reports/lighthouse.html\"  - name: fail_deploy_on_score_thresholds    required: false    description: Fail deploy if minimum threshold scores are not met  - name: thresholds    required: false    description: Key value mapping of thresholds that will fail the build when not passed\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ netlifyConfig }) {  const newCommand = `node YOUR_SCRIPT.js`;\n  // Run a script after the build command  netlifyConfig.build.command = netlifyConfig.build.command    ? `${netlifyConfig.build.command} && ${newCommand}`    : newCommand;\n  // Modify build command's environment variables  netlifyConfig.build.environment.DATABASE_URI = getDatabaseUri();\n  // Add redirects  netlifyConfig.redirects.push({    from: \"/ORIGIN_PATH\",    to: \"/DESTINATION_PATH\",  });\n  // Add headers  netlifyConfig.headers.push({    for: \"/YOUR_PATH\",    values: { YOUR_HEADER_NAME: \"YOUR_HEADER_VALUE\" },  });\n  // Add edge functions  netlifyConfig.edge_functions    ? netlifyConfig.edge_functions.push({ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' })    : (netlifyConfig.edge_functions = [{ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' }])}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild({ netlifyConfig }) {    const newCommand = `node YOUR_SCRIPT.js`;\n    // Run a script after the build command    netlifyConfig.build.command = netlifyConfig.build.command      ? `${netlifyConfig.build.command} && ${newCommand}`      : newCommand;\n    // Modify build command's environment variables    netlifyConfig.build.environment.DATABASE_URI = getDatabaseUri();\n    // Add redirects    netlifyConfig.redirects.push({      from: \"/ORIGIN_PATH\",      to: \"/DESTINATION_PATH\",    });\n    // Add headers    netlifyConfig.headers.push({      for: \"/YOUR_PATH\",      values: { YOUR_HEADER_NAME: \"YOUR_HEADER_VALUE\" },    });\n    // Add edge functions    netlifyConfig.edge_functions      ? netlifyConfig.edge_functions.push({ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' })      : (netlifyConfig.edge_functions = [{ path: '/YOUR_PATH', function: 'YOUR_EDGE_FUNCTION' }])  },};\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ packageJson }) {  console.log(packageJson);}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: ({ packageJson }) => {    console.log(packageJson);  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = async function({ utils: { build, status, cache, run, git } }) {  await run.command(\"eslint src/ test/\");}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: async ({ utils: { build, status, cache, run, git } }) => {    await run.command(\"eslint src/ test/\");  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ utils }) {  try {    badMethod();  } catch (error) {    utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\");  }}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: ({ utils }) => {    try {      badMethod();    } catch (error) {      utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\");    }  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ utils }) {  try {    badMethod();  } catch (error) {    utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error });  }}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: ({ utils }) => {    try {      badMethod();    } catch (error) {      utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error });    }  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function() {  console.log(\"This is printed in the build logs\");}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild() {    console.log(\"This is printed in the build logs\");  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = function({ utils }) {  utils.status.show({    // Optional. Default to the plugin’s name followed by a generic title.    title: \"Main title\",    // Required.    summary: \"Message below the title\",    // Optional. Empty by default.    text: \"Detailed information shown in a collapsible section\",  });}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild({ utils }) {    utils.status.show({      // Optional. Default to the plugin’s name followed by a generic title.      title: \"Main title\",      // Required.      summary: \"Message below the title\",      // Optional. Empty by default.      text: \"Detailed information shown in a collapsible section\",    });  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = async function({ utils }) {  try {    await doSomethingAsync();  } catch (error) {    utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error });  }}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: async ({ utils }) => {    try {      await doSomethingAsync();    } catch (error) {      utils.build.failBuild(\"YOUR_FAILURE_MESSAGE\", { error });    }  },}\n```\n\nExample:\n```text\n// index.js\nexport const onPreBuild = async function({ utils }) {\n  // Any error thrown inside this function will be shown  // in the build logs as a plugin bug.\n  await doSomethingAsync();}\n```\n\nExample:\n```text\n// index.js\nmodule.exports = {  onPreBuild: async ({ utils }) => {\n    // Any error thrown inside this function will be shown    // in the build logs as a plugin bug.\n    await doSomethingAsync();  },}\n```\n\nExample:\n```text\n// index.js// Example of how to use callbacks.\nconst { promisify } = require(\"util\");\n// VALID EXAMPLE: please use this.// This callback will be awaited.export const onPostBuild = async function({ utils }) {  const response = await promisify(doSomethingAsync)();\n  console.log(response);}\n// INVALID EXAMPLE: do not use this.// This callback will not be awaited.export const onPostBuild = function({ utils }) {  doSomethingAsync((error, response) => {    console.log(response);  })}\n```\n\nExample:\n```text\n// index.js// Example of how to use callbacks.\nconst { promisify } = require(\"util\");\nmodule.exports = {\n  // VALID EXAMPLE: please use this.  // This callback will be awaited.  onPostBuild: async ({ utils }) => {    const response = await promisify(doSomethingAsync)();\n    console.log(response);  },\n  // INVALID EXAMPLE: do not use this.  // This callback will not be awaited.  onPreBuild: ({ utils }) => {    doSomethingAsync((error, response) => {      console.log(response);    })  },}\n```\n\nExample:\n```text\n// index.js// Example of how to use events.\nconst pEvent = require(\"p-event\");\n// VALID EXAMPLE: please use this.// This event will be awaited.export const onPreBuild = async function({ utils }) {  const emitter = doSomethingAsync();\n  emitter.start();\n  const response = await pEvent(emitter, \"response\");\n  console.log(response);}\n// INVALID EXAMPLE: do not use this.// This event will not be awaited.export const onPreBuild = function({ utils }) {  const emitter = doSomethingAsync();\n  emitter.on(\"response\", response => {    console.log(response)  });\n  emitter.start()}\n```\n\nExample:\n```text\n// index.js// Example of how to use events.\nconst pEvent = require(\"p-event\");\nmodule.exports = {  // VALID EXAMPLE: please use this.  // This event will be awaited.  onPreBuild: async ({ utils }) => {    const emitter = doSomethingAsync();\n    emitter.start();\n    const response = await pEvent(emitter, \"response\");\n    console.log(response);  },\n  // INVALID EXAMPLE: do not use this.  // This event will not be awaited.  onPreBuild: ({ utils }) => {    const emitter = doSomethingAsync();\n    emitter.on(\"response\", response => {      console.log(response)    });\n    emitter.start();  },}\n```\n\nExample:\n```text\n// index.js// Example of how to use `Array.forEach()`.\n// VALID EXAMPLE: please use this.// This callback will be awaited.export const onPostBuild = async function({ utils }) {  await Promise.all(    array.map(async () => {      await doSomethingAsync()    }),  );}\n// INVALID EXAMPLE: do not use this.// This callback will not be awaited.export const onPostBuild = function({ utils }) {  array.forEach(async () => {    await doSomethingAsync();  });}\n```\n\nExample:\n```text\n// index.js// Example of how to use `Array.forEach()`.\nmodule.exports = {  // VALID EXAMPLE: please use this.  // This callback will be awaited.  onPostBuild: async ({ utils }) => {    await Promise.all(      array.map(async () => {        await doSomethingAsync();      }),    );  },\n  // INVALID EXAMPLE: do not use this.  // This callback will not be awaited.  onPreBuild: ({ utils }) => {    array.forEach(async () => {      await doSomethingAsync();    });  },}\n```\n\nExample:\n```text\n// index.js\nexport default function helloWorldPlugin(inputs) {  if (inputs.before) {    return {      onPreBuild: () => {        console.log(\"Hello world from onPreBuild event!\");      },    }  } else {    return {      onPostBuild: () => {        console.log(\"Hello world from onPostBuild event!\");      },    }  }};\n```\n\nExample:\n```text\n// index.js\nmodule.exports = function helloWorldPlugin(inputs) {  if (inputs.before) {    return {      onPreBuild: () => {        console.log(\"Hello world from onPreBuild event!\");      },    }  } else {    return {      onPostBuild: () => {        console.log(\"Hello world from onPostBuild event!\");      },    }  }}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.296Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":37,"totalLines":264,"estimatedTokens":7809}}115{"id":"doc-optimizely_edge_delivery_extension_netlify_docs-6ef7acf4","source":"documentation","title":"Optimizely Edge Delivery extension | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/setup-guides/optimizely-edge-delivery/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Install & use Install & use Overview Extensions and integrations Build plugins Setup guides Netlify App for Slack Netlify Email integration Auth0 Contentful integration GPT action LaunchDarkly integration Optimizely Edge Delivery PlanetScale integration Supabase integration Stripe Projects On this page Overview How it works Before you begin Get started with Optimizely Edge Delivery Modify your configuration Disable the extension on your site Uninstall the extension On this page Overview How it works Before you begin Get started with Optimizely Edge Delivery Modify your configuration Disable the extension on your site Uninstall the extension For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Install And Use / Setup Guides / Optimizely Edge Delivery extension Copy page View as Markdown Copy as Markdown View as Markdown Optimizely enables teams to manage and optimize their digital content using experimentation features. How it worksSection titled “How it works” After you install the Optimizely Edge Delivery extension for your team and enable it on your Netlify site, the extension automatically injects edge functions into your site during the build process. The edge function is named optimizely-edge-delivery_run-experiment. The edge function leverages the Optimizely Edge Delivery SDK, which allows you to run experiments at the edge without relying on a client-side script. Before you beginSection titled “Before you begin” To integrate Optimizely with your Netlify site, make sure you have the Optimizely account a deployed site on Netlify Get started with Optimizely Edge DeliverySection titled “Get started with Optimizely Edge Delivery” As a Team Owner, you can install the Optimizely Edge Delivery extension for your team to to the Optimizely Edge Delivery extension details page. On the details page, select Install. From your team’s Sites list, select the site you plan to use with Optimizely, and navigate to Project configuration > Build & deploy > Optimizely Edge Delivery. Select Enable and follow the prompts to configure and enable Optimizely. Select Save. Select Redeploy The extension automatically creates site environment variables for the configuration values you NETLIFY_OPTIMIZELY_EDGE_DELIVERY_ENABLED NETLIFY_OPTIMIZELY_EDGE_DELIVERY_SNIPPET_ID You can review these variables at any time by navigating to Project configuration > Environment variables. Modify your configurationSection titled “Modify your configuration” To update the Optimizely Edge Delivery configuration settings for your the Netlify UI, navigate to Project configuration > Build & deploy > Optimizely Edge Delivery for the site you want to edit. Update your configuration. Select Save. Select Redeploy Alternatively, you can update the environment variables directly and then redeploy. Disable the extension on your siteSection titled “Disable the extension on your site” To disable the Optimizely Edge Delivery extension for your the Netlify UI, navigate to Project configuration > Build & deploy > Optimizely Edge Delivery for the site you want to disable the Optimizely Edge Delivery extension. Select Disable. Redeploy your site, navigate to Deploys select Trigger deploy with the clear cache option. Alternatively, you can remove the environment variables directly and then redeploy. Uninstall the extensionSection titled “Uninstall the extension” As a Team Owner, to uninstall the Optimizely Edge Delivery to the Optimizely Edge Delivery extension details page. On the details page, navigate to the Danger zone section, and then select Uninstall this extension. Last 14, 2025 PreviousLaunchDarkly integrationNextPlanetScale integration Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.297Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1299}}116{"id":"doc-extensions_and_integrations_netlify_docs-0e1d97d8","source":"documentation","title":"Extensions and integrations | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/extensions-and-integrations/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Install & use Install & use Overview Extensions and integrations Build plugins Setup guides Netlify App for Slack Netlify Email integration Auth0 Contentful integration GPT action LaunchDarkly integration Optimizely Edge Delivery PlanetScale integration Supabase integration Stripe Projects On this page Overview Add on to your Netlify site Extension types Available extensions Install an extension Uninstall an extension Other integrations, apps, and tools On this page Overview Add on to your Netlify site Extension types Available extensions Install an extension Uninstall an extension Other integrations, apps, and tools For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Install And Use / Extensions and integrations Copy page View as Markdown Copy as Markdown View as Markdown Expand the capabilities of your site with extensions and integrations available through Netlify. Whether you need to sync data from a content management system (CMS), start a site from a template, or add authentication using a third-party service, Netlify can help you connect to and install solutions. Add on to your Netlify siteSection titled “Add on to your Netlify site” Discover new tools for your site under Extensions in the Netlify UI. In the Directory, you will find extensions published by Netlify, our official partners, and members of the community. Netlify reviews and approves all extensions before we list them in the directory. You can also select Created by your team to find private extensions that your team owns. You might also be able to access an extension through a direct link. If the extension has a private or unlisted badge, the extension is available for use but please note that Netlify has not reviewed it. Make sure to review the author, extension code, and documentation carefully before proceeding. You can also get started with a template with built-in extensions to get up and running faster. Extension typesSection titled “Extension types” There are two categories of extensions in the : extensions built and supported by Netlify or one of our technology partners. You can find documentation for extensions built by Netlify on this docs site and get support for them through Netlify’s official support channels. For support with extensions built by partners, please refer to each extension’s details page for links to documentation and support channels. built by other members of the community. The author is responsible for providing documentation and support for these extensions. For all extensions, you can find high-level documentation along with links to more details and contact information on the extension’s details page in the Netlify UI. Private and unlisted extensions are not reviewed by Netlify As a Netlify user, you may encounter links to extensions that aren’t listed in the extensions directory — identified through a private or unlisted badge. Netlify does not review private and unlisted extensions. You can install and use these extensions on your team but we recommend that you review the author, code, and documentation carefully before you begin. Available extensionsSection titled “Available extensions” The following extensions are available now through the extensions directory in the Netlify UI. Official extensions built by NetlifySection titled “Official extensions built by Netlify” Async Workloads Auth0 by Okta Content Security Policy Contentful integration LaunchDarkly integration Optimizely Edge Delivery extension PlanetScale integration Stripe Projects Supabase integration Turso Official extensions built by our partnersSection titled “Official extensions built by our partners” You can find the following official extensions built by Netlify partners in the Extensions DigitalOcean Jamsocket LambdaTest Nile Squid Cloud Community extensionsSection titled “Community extensions” Search for community extensions by navigating to Extensions in the Netlify UI. Searching for something else? Along with the above extensions, we offer a number of other integrations, apps, and tools that you can install and use with your sites. These aren’t listed in the extensions directory but are available through other parts of the Netlify platform. Install an extensionSection titled “Install an extension” Team Owners can install extensions. In the Netlify UI, navigate to your team’s Extensions page. Search for the extension you wish to install and select it. On the extension’s detail page, select Install. Once installed on your team, follow the extension’s documentation to configure it for your individual sites. Uninstall an extensionSection titled “Uninstall an extension” Team Owners can uninstall extensions. Note that uninstalling an extension will impact any projects that use that extension. In the Netlify UI, navigate to your team’s Extensions page. Select Installed. Find the extension you wish to uninstall and select it. Navigate to the Danger zone section on the extension’s detail page, and then select Uninstall this extension. Other integrations, apps, and toolsSection titled “Other integrations, apps, and tools” Along with the above extensions, there are a number of other options available for expanding the functionality of your sites on the Netlify platform. These include integrations, plugins, apps, and templates. Follow the links below to learn how to install and configure these options for your teams and Source Interface (CSI) modules for Visual DatoCMS Git CMS Sanity Email Integration GPT action Netlify App for Slack Netlify Build Plugins Lighthouse build plugin Netlify Templates Last 29, 2026 PreviousOverviewNextBuild plugins Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.298Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1789}}117{"id":"doc-apis_for_code_agents_netlify_docs-d464860b","source":"documentation","title":"APIs for code agents | Netlify Docs","url":"https://docs.netlify.com/extend/building-code-agents/apis-for-code-agents/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Building code agents Building code agents Overview APIs for code agents Become AI partner On this page Overview API guides Request guides and examples More resources On this page Overview API guides Request guides and examples More resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Building Code Agents / APIs for code agents Copy page View as Markdown Copy as Markdown View as Markdown As a developer building code agents, learn how to build and include Netlify’s capabilities into your AI workflows using Netlify's REST API. Netlify’s existing REST API is designed to support you in building code agents so that your AI workflows can help your users deploy, secure, and manage their projects beyond an initial prototype. API guidesSection titled “API guides” Check out our API guides for code a PAT for Netlify OAuthLearn how to use the Netlify REST API so you can act on behalf of your users.Surface deploy and function logsLearn how to make use of the information found in Netlify's logs.Add a custom domain with the APILearn how to assign a custom domain to your deployment.Deploy a full-stack app to NetlifyLearn best practices for deploying a full-stack app. We recommend this AI workflow, which deploys the app as a zip file to Netlify.Deploy a static site to NetlifyLearn best practices for deploying a static site. We recommend this example AI workflow, which deploys a static site as a zip file to Netlify. Request guides and examplesSection titled “Request guides and examples” If you want to recommend a guide, let us know in this Suggest a guide form. If you want to recommend a live working example, let us know in an issue in the Examples repo. More resourcesSection titled “More resources” If you’re just getting started with the Netlify REST API, you can check REST API reference Get started guide for Netlify REST API Last 4, 2026 PreviousOverviewNextBecome AI partner Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.299Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":861}}118{"id":"doc-launchdarkly_integration_netlify_docs-e74ef805","source":"documentation","title":"LaunchDarkly integration | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/setup-guides/launchdarkly-integration/","text":"Example:\n```text\nnpm i @netlify/launchdarkly-server-sdk\n```\n\nExample:\n```text\nyarn add @netlify/launchdarkly-server-sdk\n```\n\nExample:\n```text\nimport { init as initLD } from \"@netlify/launchdarkly-server-sdk\";\nexport default {  async fetch(request: Request, env: Bindings): Promise<Response> {    const clientSideID = \"my-client-side-id\";    const flagKey = \"enableMyNewFeature\";    const context = { kind: \"user\", key: \"my-user-key-1\" };\n    const client = initLD(clientSideID);    await client.waitForInitialization();    const flagValue = await client.variation(flagKey, context, false);\n    return new Response(`${flagKey}: ${flagValue}`);  }};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.300Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":3,"totalLines":19,"estimatedTokens":167}}119{"id":"doc-form_submissions_netlify_docs-a5af700e","source":"documentation","title":"Form submissions | Netlify Docs","url":"https://docs.netlify.com/manage/forms/submissions/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Forms Forms Setup Submissions Notifications Spam filters Troubleshooting tips Usage and billing On this page Overview Form submissions UI Submission summary display Export form submissions to CSV Change a form submission’s state Delete a form submission Delete a form API endpoints File uploads Manage sensitive form data Automatic sanitization Form-triggered functions On this page Overview Form submissions UI Submission summary display Export form submissions to CSV Change a form submission’s state Delete a form submission Delete a form API endpoints File uploads Manage sensitive form data Automatic sanitization Form-triggered functions For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Forms / Form submissions Copy page View as Markdown Copy as Markdown View as Markdown This document covers features you can use to manage your form submissions and recommendations for sensitive data. To learn how you can be made aware of new form submissions, visit our form notifications page. Form submissions UISection titled “Form submissions UI” You can find all submissions to your Netlify forms in your site’s Forms tab. Select a form name from the Active forms list to access the submissions for that form. By default, only verified submissions are listed. You can switch to spam submissions using a menu above the list. Note If you’ve disabled form detection, Netlify will not process any new or changed forms in your HTML files during deploys. You can still access form submissions for any preexisting and unchanged forms, but any newly deployed or updated forms won’t support new submissions while form detection is disabled. Submission summary displaySection titled “Submission summary display” Each form submission in the list displays a summary to help you identify it. The summary is generated based on your form's HTML structure in the following priority and body your form has a title and/or body field, these are combined in the summary. First field with no title or body field exists, the summary displays the value from the first field that contains data. For file upload fields, the filename is shown. The title and body are identified by field type, not field : The first text <input> element that is not hidden and not an email-related field. Email-related fields are those with type=\"email\" or names matching email, mail, from, twitter, or sender (case-insensitive). If no matching input is found, Netlify falls back to looking for a field named exactly title or subject (case-insensitive). first <textarea> element in the form, regardless of its name. This means the order of fields in your HTML affects which values appear in the summary. Export form submissions to CSVSection titled “Export form submissions to CSV” You can export verified form submissions to a CSV file. From the Forms tab, select the form you want to export, then select Download as CSV near the top of the form detail page. Change a form submission’s stateSection titled “Change a form submission’s state” You can change the state of a submission from spam to verified or vice versa. To do so, check the box next to each submission title to select one or multiple submissions and then use the Mark as spam or Mark as verified button. Delete a form submissionSection titled “Delete a form submission” You can delete both verified submissions and spam submissions. To do so, check the box next to each submission title to select one or multiple submissions. After you select the submissions, a red Delete submission button will become available. When you select Delete submission, you’ll be prompted to confirm the deleting action. Once you confirm, your selected submissions will be deleted permanently. Delete a formSection titled “Delete a form” You can delete a form and all of its submissions by selecting Delete form. You’ll be prompted to confirm the deleting action. Once you confirm, future submissions to the form will result in a 404 error and previous submissions will no longer be available. You may want to export form submissions to CSV before you delete your form. API endpointsSection titled “API endpoints” You can use the API to get verified/spam submissions, delete submissions, delete forms, and more. File uploadsSection titled “File uploads” When a form is submitted with one or more file uploads, a link to each uploaded file will be included in the form submission details. These are accessible in the Netlify app, in email notifications, in CSV exports, and from our API. After you delete a form, the file uploads are still available by their direct URL for 24 hours because of the way caching works for forms by default. Manage sensitive form dataSection titled “Manage sensitive form data” Form submission data is securely stored in our user database. If your form collects personally identifiable information (PII), we recommend that you actively manage the data by exporting form submissions and deleting them regularly. Forms that include file uploads with personally identifiable information should use the Very Good Security integration to protect this data. Automatic sanitizationSection titled “Automatic sanitization” Our form handling automatically sanitizes form submissions to keep your site and business secure. Any code that gets submitted through Netlify Forms, such as <script> tags or anything else that could be harmful, is neutralized. Take for example the following code: <script>alert('Surprise!');</script> If someone tries to submit this through your form, we transform the code into the following to make it harmless: &lt;script&gt;alert('Surprise!')&lt;/script&gt; Form-triggered functionsSection titled “Form-triggered functions” You can integrate your forms with Netlify Functions by triggering a serverless function when a form submission is verified. Find out more in the Functions docs. Last 17, 2025 PreviousSetupNextNotifications Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n<script>alert('Surprise!');</script>\n```\n\nExample:\n```text\n&lt;script&gt;alert('Surprise!')&lt;/script&gt;\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.301Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":13,"estimatedTokens":1888}}120{"id":"doc-build_plugins_netlify_docs-0a337954","source":"documentation","title":"Build plugins | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/build-plugins/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Install & use Install & use Overview Extensions and integrations Build plugins Setup guides Netlify App for Slack Netlify Email integration Auth0 Contentful integration GPT action LaunchDarkly integration Optimizely Edge Delivery PlanetScale integration Supabase integration Stripe Projects On this page Overview Install a plugin UI installation File-based installation Automatic installation Manage plugin versions Remove a plugin Create a plugin Get help More Build Plugins resources On this page Overview Install a plugin UI installation File-based installation Automatic installation Manage plugin versions Remove a plugin Create a plugin Get help More Build Plugins resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Install And Use / Build plugins Copy page View as Markdown Copy as Markdown View as Markdown Learn how to install and use Netlify Build Plugins. Start here For the latest extended services to Netlify, we recommend you start by checking out and installing Netlify extensions.Learn more about Netlify extensions. Build Plugins expand what your Netlify builds are capable of. For example, you can use plugins up builds by optimizing and debugging your build cache import and convert data from external sources check for broken links in a site after building analyze and optimize site asset handling for better runtime performance generate content like sitemaps, RSS feeds, and search indexes Install a pluginSection titled “Install a plugin” To get a sampling of what plugins can do, navigate to Project configuration > Build & deploy > Build plugins for your site. You’ll find different types of plugins, including plugins from our partners and plugins from the community. Plugins can be installed directly from the Netlify UI. They can also be installed using the Netlify configuration file, which allows more configuration options. Netlify automatically installs plugins or runtimes recommended for certain frontend frameworks when you link a repository for a new project. Use a compatible Node.js version For optimum compatibility while developing or running plugins, we recommend using the default version of Node.js installed by Netlify. However, you can also specify a different version for your project's setup, if needed. UI installationSection titled “UI installation” In the Netlify UI, navigate to Project configuration > Build & deploy > Build plugins for your project. Search or browse for the plugin you want. Select Enable. Follow the installation guidance in the Netlify UI to install the plugin on a site. You may be prompted to add build environment variables required by the plugin. To use your new plugin, visit the Deploys tab for your site and select Trigger deploy. Consider the context UI-installed plugins run in all deploy contexts. To limit the context for the plugin, consider using file-based installation instead. Required environment variablesSection titled “Required environment variables” Though many plugins listed in the Netlify UI require no configuration for default operation, some may require you to set one or more build environment variables for your site during or after installation. Refer to the plugin’s documentation, linked from Options menu in the plugin’s listing. File-based installationSection titled “File-based installation” File-based plugin installation allows advanced plugin configuration. You can use file-based installation for either of the local plugins that you write and store in your repository accessing a wide selection of plugins published by the community on npm In both cases, you configure settings in netlify.toml. For a plugin published to npm, you also add it as a dependency. Then you can test or run the plugin as part of a build. Configure settingsSection titled “Configure settings” To run a plugin during your build, add it to a Netlify configuration file stored in your site’s base directory. A plugin configured globally with [[plugins]] runs in all deploy contexts, but you can also configure a plugin by deploy context. Here’s a sample configuration with two plugins installed in all deploy contexts. # Configuration for a plugin published to npm[[plugins]]package = \"netlify-plugin-lighthouse\" [plugins.inputs] output_path = \"reports/lighthouse.html\" # Configuration for a local plugin[[plugins]]package = \"/plugins/netlify-plugin-hello-world\" Each [[plugins]] entry accepts two (required): for a plugin installed from npm, the npm package name of the plugin. for a local plugin, the absolute path to a directory containing the plugin’s index.js and manifest.yml files. The package value for a local plugin must start with . or /. settings that the plugin author may specify as required or available for configuring the plugin. To specify inputs per deploy context, refer to configure by deploy context. For npm-published plugins, you can find these details in each plugin’s package documentation on the npm Public Registry. Sometimes order matters Different plugins run during different stages of your build. When multiple plugins are set to run in the same stage, they will run in the order they are listed in the Netlify configuration file. An npm-published plugin’s README should indicate if order is important to that plugin’s functionality. Configure by deploy contextSection titled “Configure by deploy context” Using specific settings in your Netlify configuration file, you can limit a build plugin to run in a certain deploy context only, or you can configure a plugin’s inputs settings differently per context. Here’s an example configuration that runs the Sitemap plugin in the context of production deploys only. # Use double brackets since `plugins` is an array of tables.[[context.production.plugins]]package = \"@netlify/plugin-sitemap\" And here’s an example configuration that runs the Cypress plugin differently based on deploy contexts. # Use Cypress plugin for this site.# This section, by itself, configures the plugin# for all deploy contexts (production, branch deploys, Deploy Previews).[[plugins]]package = \"netlify-plugin-cypress\" [plugins.inputs] record = true # Don’t record Cypress tests in Deploy Previews.# Since this entry is more specific, it overrides the entry above.# `context.deploy-preview.plugins` and `package` must be included.[[context.deploy-preview.plugins]]package = \"netlify-plugin-cypress\" # Use single brackets since `inputs` is an object property [context.deploy-preview.plugins.inputs] record = false This configuration records test results and artifacts on the Cypress Dashboard for production and branch deploys only, not Deploy Previews. UI-installed plugins run on all contexts To limit a plugin to certain deploy contexts, ensure that you’ve configured the plugin for your site using file-based installation only and not UI installation. Next stepsSection titled “Next steps” If you’re installing a local plugin, you can run and test it after configuration. Otherwise, you’ll add a dependency to package.json. Add dependencySection titled “Add dependency” For a plugin from npm, there’s an additional step beyond editing the Netlify configuration file. You must use npm, yarn, or another Node.js package manager to add the plugin to devDependencies in your site’s package.json. Evaluate the plugin code Plugins available on npm but not yet listed in the Netlify UI have not been reviewed or approved by Netlify staff. We strongly recommend you review the plugin code and author for security concerns before installing. From your project’s base directory, use a command like this to add the Yarn Terminal window# Replace `BUILD_PLUGIN_NAME` with a real plugin name,# like `netlify-plugin-lighthouse`npm install -D BUILD_PLUGIN_NAME Terminal window# Replace `BUILD_PLUGIN_NAME` with a real plugin name,# like `netlify-plugin-lighthouse`yarn add -D BUILD_PLUGIN_NAME Run and testSection titled “Run and test” When you save your changes to your repository and push them to your Git provider, the build that’s triggered on Netlify will run with plugins installed for that deploy context. If you would like to test a plugin before running it in a production build, you can use a branch deploy or Deploy Preview, or you can run the build locally with Netlify CLI. Automatic installationSection titled “Automatic installation” When you link a repository for a new site, Netlify runs a build detection utility to determine whether your site uses a particular frontend framework. Certain frameworks have recommended Build Plugins or runtimes. These help extend the functionality of the Netlify Build process to support key framework-specific features. Recommended plugins and runtimes may have site conditions requirements, such as a minimum Node.js version. If your new site uses a framework with recommended plugins or runtimes, Netlify checks whether these are already installed in a Netlify configuration file. If not, Netlify automatically installs them. These automatically installed plugins run in all deploy contexts. For an existing site that’s already linked to Netlify, you can choose to install framework-specific recommended plugins yourself. Manage plugin versionsSection titled “Manage plugin versions” Netlify encourages plugin authors to regularly update functionality and release new versions using semantic versioning. Minor plugin version updates introduce only backward compatible new features, while major plugin version updates can introduce breaking changes. Refer to the plugin’s changelog, linked from the Options menu for the plugin listing in the Netlify UI, for version details. The steps for managing plugin versions for your site depend on the plugin installation method. For plugins installed in the UI or installed automatically, Netlify updates your site for minor plugin version releases automatically. To manage major plugin updates for a site, take the following to Project configuration > Build & deploy > Build plugins for your project Search or browse to find the plugin you want to manage. Select Options > Change version. Select the desired major version. Select Change version to save. Subsequent builds will use the plugin version that you’ve chosen and confirmed. For plugins installed through file-based installation, you can manage versions in your site’s package.json file under devDependencies. Remove a pluginSection titled “Remove a plugin” The steps for removing a plugin depend on how it was installed or whether it is an Essential Gatsby or Next.js Runtime plugin. For plugins installed in the UI or installed your selected project, go to Project configuration > Build & deploy > Build plugins. Find the plugin you want to remove. In the plugin’s card select Disable. Subsequent builds will not use the uninstalled plugin and environment variables entered for this integration will not be deleted. For plugins installed through file-based your site’s netlify.toml. Delete or comment out the plugin’s configuration fields. When you push your committed changes, the resulting build will run without the plugin. If you’re removing an npm-published plugin and want to avoid installing code you won’t use, you can uninstall the plugin package using npm. Plugin not uninstalling correctly? Check for conflicting configurations It’s possible to configure a plugin both in the Netlify UI and your site’s netlify.toml — though the configuration file takes precedence. If you follow the above steps to remove a plugin from netlify.toml and the plugin is still installed, make sure it’s not also configured in the Netlify UI, and vice versa. Removing the plugin from one does not automatically remove it from the other. For the Essential Gatsby and Next.js Runtime v4 your selected site, go to Project configuration > Build & deploy. In Build settings, find your plugin in the Runtime field and select Remove. Create a pluginSection titled “Create a plugin” Once you’ve had a chance to try out plugins, you may want to make one of your own. To learn how, visit the create plugins doc. A new way to build deep integrations and extensions Visit the Netlify SDK docs to learn about new tools and options for extending and integrating with Netlify. With the SDK, you can make an extension that interacts with more parts of the Netlify platform than a build plugin can. This new toolset also provides a streamlined experience for both developers and users. Get helpSection titled “Get help” Netlify Build Plugins are created by our partners and developers at Netlify and in the community. If you need help with a plugin, contact the plugin author by submitting an issue on the plugin repository. For plugins in the Netlify UI, you can find a link to the plugin issues under the Options menu for the plugin listing. If a plugin author doesn’t respond to an issue within a week, you can request deactivation of the plugin from the Netlify UI. For more general questions, or to discuss Build Plugins with other members of the community, visit the Netlify Support Forums. More Build Plugins resourcesSection titled “More Build Plugins resources” Create Build Plugins using build events Share Build Plugins Use the Netlify Blobs API in a build plugin Last 14, 2025 PreviousExtensions and integrationsNextNetlify App for Slack Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# Configuration for a plugin published to npm[[plugins]]package = \"netlify-plugin-lighthouse\"\n  [plugins.inputs]  output_path = \"reports/lighthouse.html\"\n# Configuration for a local plugin[[plugins]]package = \"/plugins/netlify-plugin-hello-world\"\n```\n\nExample:\n```text\n# Use double brackets since `plugins` is an array of tables.[[context.production.plugins]]package = \"@netlify/plugin-sitemap\"\n```\n\nExample:\n```text\n# Use Cypress plugin for this site.# This section, by itself, configures the plugin# for all deploy contexts (production, branch deploys, Deploy Previews).[[plugins]]package = \"netlify-plugin-cypress\"  [plugins.inputs]  record = true\n# Don’t record Cypress tests in Deploy Previews.# Since this entry is more specific, it overrides the entry above.# `context.deploy-preview.plugins` and `package` must be included.[[context.deploy-preview.plugins]]package = \"netlify-plugin-cypress\"  # Use single brackets since `inputs` is an object property  [context.deploy-preview.plugins.inputs]  record = false\n```\n\nExample:\n```text\n# Replace `BUILD_PLUGIN_NAME` with a real plugin name,# like `netlify-plugin-lighthouse`npm install -D BUILD_PLUGIN_NAME\n```\n\nExample:\n```text\n# Replace `BUILD_PLUGIN_NAME` with a real plugin name,# like `netlify-plugin-lighthouse`yarn add -D BUILD_PLUGIN_NAME\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.303Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":5,"totalLines":31,"estimatedTokens":4021}}121{"id":"doc-netlify_visual_editor_overview_netlify_docs-80c76e1e","source":"documentation","title":"Netlify Visual Editor overview | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Key visual editing features Learn how Visual Editor works Supported tools, services, and frameworks Supported frameworks Supported content sources Unsupported tools On this page Overview Key visual editing features Learn how Visual Editor works Supported tools, services, and frameworks Supported frameworks Supported content sources Unsupported tools For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Netlify Visual Editor overview Copy page View as Markdown Copy as Markdown View as Markdown Netlify Visual Editor is an environment for content editors to work with structured content in a visual way. It is designed for composable architectures, and is compatible with any site framework and API-enabled content source. Learn more about how Visual Editor works and what it can do for your team below. Or move on to enable visual editing for your site. Key visual editing featuresSection titled “Key visual editing features” Content Source engine that makes content from any source editable with Visual Editor. No production required packages can be installed as development dependencies. You do not need to use Visual Editor in production. Visual site runs in a preview window inside Visual Editor. Content changes are reflected immediately in the preview. Two-way content Editor also listens for changes from content sources and updates the preview immediately. Inline addition to traditional form fields, Visual Editor makes it possible for editors to change content by clicking directly on elements in the preview window. Learn how Visual Editor worksSection titled “Learn how Visual Editor works” If you want a deeper understanding of how Visual Editor works, dig into our concept Editor concepts deeper dive into how Visual Editor fits into your modern web stack and how its major elements work. How the visual editor through the core concepts of how Visual Editor works by following a developer’s typical journey. Content-driven non-technical editors to make structural changes to a website without the help of a developer. Reusable content editors work faster by providing a starting point for content. Structured Visual Editor works with structured content, along with content modeling basics. Two-way content Editor stores content back to the appropriate source, while also listening for changes from each source. Supported tools, services, and frameworksSection titled “Supported tools, services, and frameworks” As part of the Netlify platform, Visual Editor supports most tools, services, and frameworks supported by Netlify. Find more information below on details specific to Visual Editor. Supported frameworksSection titled “Supported frameworks” The visual editor is run in a Node-based environment by default, but can be customized to run any framework. Local development supports any framework that runs on a local port. Enabling automatic content reloading (showing content updates in real-time in the visual editor UI) may require additional code and configuration in some frameworks. See framework integration guides for specific cases. Supported content sourcesSection titled “Supported content sources” Content Source Interface (CSI) supports any structured content source with read and write abilities via an API. There are several content sources supported by default, though you can always build your own CSI module or contact us for additional support. Unsupported toolsSection titled “Unsupported tools” Visual Editor is designed to be composable and flexible, and we’re always working to expand our integrations. If your tool isn’t supported, get in touch to discuss your needs. It is likely that if we aren’t already working on support for your desired integration, you can create the necessary support through code and configuration. Last 14, 2025 PreviousSnippet injectionNextGet started overview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.305Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1628}}122{"id":"doc-form_troubleshooting_tips_netlify_docs-39c80c9f","source":"documentation","title":"Form troubleshooting tips | Netlify Docs","url":"https://docs.netlify.com/manage/forms/troubleshooting-tips/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Forms Forms Setup Submissions Notifications Spam filters Troubleshooting tips Usage and billing On this page Overview Custom success page Extra spam prevention Missing submissions Test submissions flagged as spam Form detection disabled Missing data from old submissions Next.js Runtime v5 support On this page Overview Custom success page Extra spam prevention Missing submissions Test submissions flagged as spam Form detection disabled Missing data from old submissions Next.js Runtime v5 support For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Forms / Form troubleshooting tips Copy page View as Markdown Copy as Markdown View as Markdown This document provides troubleshooting tips for setting up a form. If you have questions that aren’t answered here, visit our Support Forums to get more advice about how to debug your form. Custom success pageSection titled “Custom success page” If you’re having trouble using the form action to customize the success page, try linking to your custom success page from somewhere on the same page as the form. Use the same exact path in your test link as you’re trying to use for the action attribute, and make sure the link works there before digging further into your form. Extra spam preventionSection titled “Extra spam prevention” If you’re adding a honeypot field or reCAPTCHA 2 challenge, you can check the form detail page to confirm whether or not the Extra spam prevention has been successfully enabled. Missing submissionsSection titled “Missing submissions” Here are some common causes and solutions for missing form submissions. Test submissions flagged as spamSection titled “Test submissions flagged as spam” If you’re sending test submissions of your form and not finding them in your Verified submissions list, it’s possible they’re getting flagged as spam by Akismet. Use the menu above the list to switch to Spam submissions and then recheck for your tests. To avoid having your tests flagged as spam in the first place, we recommend you enter a real email address instead of a fake one such as test@test.com. write some full sentences in any textareas rather than a few nonsense characters. spread out the rate of submissions from a single IP address. Form detection disabledSection titled “Form detection disabled” If you’re not finding new form submissions in your Verified submissions list for updated or newly added forms, ensure that form detection is enabled for your site. If this is your first time enabling form detection, go to Forms to turn on the setting. If you previously enabled form detection, go to Forms > Usage and configuration > Form detection to review the setting. Once you enable or re-enable form detection, make sure you redeploy your site. Once you redeploy, Netlify will automatically scan your deploys for forms and will accept form submissions. Missing data from old submissionsSection titled “Missing data from old submissions” If you recently changed the name or type of a form field, data for that field from old submissions will no longer appear in the Netlify UI. This is because the Netlify UI only shows the form fields and data that correspond to the last deployed version of your form. Fortunately, all of your previous submission data are still available through the Netlify API. You can request form data with the listFormSubmissions endpoint. If you would like to review the data from both the old and current form fields in the Netlify UI, we recommend that you mark old form fields as “hidden” instead of removing or replacing them entirely. Next.js Runtime v5 supportSection titled “Next.js Runtime v5 support” If you’re using Netlify Forms with Next.js Runtime v5, you need to extract your form definitions to a dedicated static HTML file and make sure that the form submission uses AJAX rather than full-page navigation. Refer to the Next.js v5 breaking changes for more information. Last 14, 2025 PreviousSpam filtersNextUsage and billing Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.306Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1374}}123{"id":"doc-form_notifications_netlify_docs-4f314b90","source":"documentation","title":"Form notifications | Netlify Docs","url":"https://docs.netlify.com/manage/forms/notifications/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Forms Forms Setup Submissions Notifications Spam filters Troubleshooting tips Usage and billing On this page Overview Slack notifications Email notifications Customize the email subject line Example HTML forms Remove [Netlify] prefix from your email subject line Zapier integrations n8n integrations On this page Overview Slack notifications Email notifications Customize the email subject line Example HTML forms Remove [Netlify] prefix from your email subject line Zapier integrations n8n integrations For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending , %{siteName}, or %{submissionId}. For example, your email subject line can be New lead from %{formName} (%{submissionId}). Use these variables in the HTML form or in the Netlify UI. Example HTML formsSection titled “Example HTML forms” This example sets the email subject line for your form notification to Sales inquiry from mysitename.netlify.app: <form name=\"contact\" method=\"POST\" data-netlify=\"true\"> <input type=\"hidden\" name=\"subject\" value=\"Sales inquiry from mysitename.netlify.app\" /> <p> <label>Your Name: <input type=\"text\" name=\"name\" /></label> </p> <p> <label>Your Email: <input type=\"email\" name=\"email\" /></label> </p> <p> <label>Message: <textarea name=\"message\"></textarea></label> </p> <p> <button type=\"submit\">Send</button> </p></form> The Reply-to email is whatever value the form submitter entered in the Your This example uses predefined variables to dynamically set your email subject line to New lead from %{formName} (%{submissionId}): <form name=\"contact\" method=\"POST\" data-netlify=\"true\"> <input type=\"hidden\" name=\"subject\" value=\"New lead from %{formName} (%{submissionId})\" /> <p> <label>Your Name: <input type=\"text\" name=\"name\" /></label> </p> <p> <label>Your Email: <input type=\"email\" name=\"email\" /></label> </p> <p> <label>Message: <textarea name=\"message\"></textarea></label> </p> <p> <button type=\"submit\">Send</button> </p></form> Older form or want to remove [Netlify] from subject line? The example above assumes your form was created after May 5, 2023. Forms created before this date will have an automated [Netlify] prefix in your email subject line.To remove [Netlify] from the subject line of your form submission email notification, check out our [Netlify] prefix removal docs. For greater control of form-triggered emails, or to connect other services, you can use the Netlify app on Zapier or n8n. Remove [Netlify] prefix from your email subject lineSection titled “Remove [Netlify] prefix from your email subject line” Forms created before May 5, 2023 included [Netlify] as a default and automated prefix in the email subject line. Now you can remove the [Netlify] prefix from your email subject line and completely customize your email subject line. To remove [Netlify] from the email subject line of your form submission notification you have an email subject line specified in your HTML form, decide whether to modify your existing email subject line in the HTML form or opt to use the Netlify UI instead. If you do not have an email subject line specified in your HTML form, you can just edit the form notification settings in the Netlify UI. All new forms will not include [Netlify]. Remove [Netlify] prefix in the HTML formSection titled “Remove [Netlify] prefix in the HTML form” To remove the [Netlify] prefix from your subject line and keep using the HTML form to specify the subject line, add the data-remove-prefix attribute to your HTML form’s email subject input field: <form name=\"contact\" method=\"POST\" data-netlify=\"true\"> <input type=\"hidden\" name=\"subject\" data-remove-prefix value=\"Sales inquiry from mysitename.netlify.app\" /> <!-- Add other form fields here --></form> In this example, your email subject line is Sales inquiry from mysitename.netlify.app. This removes [Netlify] from your new form notification emails. Learn more about this update in this support Forums post. Note that if you have an HTML form with a different email subject specified, that subject will take precedence over any updates you make to the email subject line in the Netlify UI. Zapier integrationsSection titled “Zapier integrations” Netlify is available on Zapier, where you can connect Netlify with over 1,000 other applications. You can set up a “Zap” action to be triggered when there is a verified form submission on your website. You can find out more on our blog, or use one of the templates below to get a deploy of your Netlify site after new Netlify form submissions Netlify Use this zap Send Gmail emails for new Netlify form submissions Gmail + Netlify Use this zap Save new Netlify form submissions to rows in Google Sheets Google Sheets + Netlify Use this zap Create Salesforce leads from new Netlify form submissions Netlify + Salesforce Use this zap Create Mailchimp subscribers from new Netlify form submissions Mailchimp + Netlify Use this zap Create Zendesk tickets for new Netlify form submissions Netlify + Zendesk Use this zap n8n integrationsSection titled “n8n integrations” Netlify is available on n8n, an open source tool that allows you to connect Netlify with other applications. By using one of n8n’s Netlify nodes, you can create your own automated workflow. To get started, you can use the Netlify node, Netlify Trigger node, or you can use the existing workflow Netlify Form submissions to Airtable Netlify Trigger node Use workflow Last 14, 2025 PreviousSubmissionsNextSpam filters Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n<form name=\"contact\" method=\"POST\" data-netlify=\"true\">  <input type=\"hidden\" name=\"subject\"  value=\"Sales inquiry from mysitename.netlify.app\" />  <p>    <label>Your Name: <input type=\"text\" name=\"name\" /></label>  </p>  <p>    <label>Your Email: <input type=\"email\" name=\"email\" /></label>  </p>  <p>    <label>Message: <textarea name=\"message\"></textarea></label>  </p>  <p>    <button type=\"submit\">Send</button>  </p></form>\n```\n\nExample:\n```text\n<form name=\"contact\" method=\"POST\" data-netlify=\"true\">  <input type=\"hidden\" name=\"subject\"  value=\"New lead from %{formName} (%{submissionId})\" />  <p>    <label>Your Name: <input type=\"text\" name=\"name\" /></label>  </p>  <p>    <label>Your Email: <input type=\"email\" name=\"email\" /></label>  </p>  <p>    <label>Message: <textarea name=\"message\"></textarea></label>  </p>  <p>    <button type=\"submit\">Send</button>  </p></form>\n```\n\nExample:\n```text\n<form name=\"contact\" method=\"POST\" data-netlify=\"true\">  <input type=\"hidden\" name=\"subject\" data-remove-prefix  value=\"Sales inquiry from mysitename.netlify.app\" />  <!-- Add other form fields here --></form>\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.307Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":18,"estimatedTokens":2006}}124{"id":"doc-forms_usage_and_billing_netlify_docs-4c74c93a","source":"documentation","title":"Forms usage and billing | Netlify Docs","url":"https://docs.netlify.com/manage/forms/usage-and-billing","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Forms Forms Setup Submissions Notifications Spam filters Troubleshooting tips Usage and billing On this page Overview For credit-based plans For legacy pricing plans Change levels More usage and billing resources On this page Overview For credit-based plans For legacy pricing plans Change levels More usage and billing resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Forms / Forms usage and billing Copy page View as Markdown Copy as Markdown View as Markdown Forms billing is metered differently depending on the type of plan you have. For credit-based plansSection titled “For credit-based plans” For credit-based plans, Forms are free and unlimited. Learn more in Billing FAQ for credit-based plans. For legacy pricing plansSection titled “For legacy pricing plans” You can check your Forms service usage under Forms > Usage and configuration > Usage. This shows your current usage level and tracks your usage of the following : This counts the total number of verified form submissions across all forms on your site during this billing period. File tracks the total storage size of all files uploaded through verified form submissions to your site during the current billing period. For legacy plans, forms pricing is metered on a per-site basis and scales with usage. [placeholder to legacy pricing plans] For paid plans, Forms pricing is metered on a per-site basis and scales with usage. When usage reaches a level limit, the site will automatically upgrade to the next level or package. Free tier accounts are also metered based on usage and have a limit. Change levelsSection titled “Change levels” Any team member with the ability to change the configuration for your site can also change levels for services on that site. To do this, go to Forms > Usage and configuration > Usage, and select Change level. Level fees will be prorated and charged at the end of the billing cycle, to the team’s payment method. More usage and billing resourcesSection titled “More usage and billing resources” Billing FAQ for legacy plans Billing for legacy plans Last 14, 2026 PreviousTroubleshooting tipsNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.308Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":917}}125{"id":"doc-vercel_to_netlify_migration_checklist_netlify_do-d41da5dc","source":"documentation","title":"Vercel to Netlify migration checklist | Netlify Docs","url":"https://docs.netlify.com/resources/checklists/vercel-to-netlify-migration/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Checklists Checklists Overview Production checklist Onboard to Pro checklist Security checklist Vercel to Netlify migration checklist On this page Overview Pre-migration preparation Review your current setup Plan your migration Code and configuration migration Next.js applications Convert Vercel configuration to netlify.toml Environment variables and secrets Smooth migration checklist Domain and DNS setup Build and performance optimization Site configuration and branding Forms migration (if applicable) Monitoring and analytics Testing and validation Pre-launch testing Feature verification Go-live preparation Final steps Post-migration Helpful resources Next.js on Netlify Configuration and migration Production readiness Support and troubleshooting On this page Overview Pre-migration preparation Review your current setup Plan your migration Code and configuration migration Next.js applications Convert Vercel configuration to netlify.toml Environment variables and secrets Smooth migration checklist Domain and DNS setup Build and performance optimization Site configuration and branding Forms migration (if applicable) Monitoring and analytics Testing and validation Pre-launch testing Feature verification Go-live preparation Final steps Post-migration Helpful resources Next.js on Netlify Configuration and migration Production readiness Support and troubleshooting For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Checklists / Vercel to Netlify migration checklist Copy page View as Markdown Copy as Markdown View as Markdown Migrating from Vercel to Netlify can be seamless with the right preparation. This checklist covers the essential steps for successfully moving your projects, with special attention to Next.js applications, configuration migration, and production readiness. Next.js on Netlify Netlify provides zero-configuration deployment for Next.js 13.5+ with full support for App Router, SSR, ISR, and all modern Next.js features. Earlier versions use the legacy runtime. Pre-migration preparationSection titled “Pre-migration preparation” Review your current setupSection titled “Review your current setup” Document your current Vercel configuration (build commands, environment variables, redirects) Identify Next.js version and features in use (App Router, API routes, middleware, etc.) List all custom domains and DNS configurations Review existing environment variables and secrets Document any Vercel-specific features you're using (Edge Functions, Analytics, etc.) Plan your migrationSection titled “Plan your migration” Choose your Netlify plan based on your needs Set up your Netlify account and connect to your Git provider Plan your domain migration strategy to minimize downtime Code and configuration migrationSection titled “Code and configuration migration” Next.js applicationsSection titled “Next.js applications” Update to supported to Next.js 13.5+ for zero-configuration deployment Image next/image components work with Netlify Image CDN Convert Vercel configuration to netlify.tomlSection titled “Convert Vercel configuration to netlify.toml” Build Vercel build commands to netlify.toml configuration [build] command = \"next build\" publish = \".next\" Redirects and redirects to next.config.js for proper handling, or use Netlify redirects headers to next.config.js for proper handling, or use Netlify headers Vercel API routes to Netlify Functions if needed (Next.js API routes work automatically) Environment variables and secretsSection titled “Environment variables and secrets” Export environment variables from Vercel dashboard Import to .env file variables for consistency Review sensitive Secrets Controller for your most sensitive variables Set up scoped environment variable scopes for different deploy contexts Smooth migration checklistSection titled “Smooth migration checklist” Based on Netlify's production checklist, here are the essential steps for a smooth migration. For comprehensive production readiness guidance, see our complete production checklist. Domain and DNS setupSection titled “Domain and DNS setup” Plan DNS DNS changes to minimize downtime (see DNS cutover guidance) Add custom your custom domain in Netlify Configure www or subdomain as primary domain for optimal performance Set up secure connections for your site Build and performance optimizationSection titled “Build and performance optimization” Optimize build build settings for faster deployments Set function serverless functions region closest to your data sources Image Netlify Image CDN is properly configured Site configuration and brandingSection titled “Site configuration and branding” Search engine branch deploys from search indexing if needed Forms migration (if applicable)Section titled “Forms migration (if applicable)” Netlify Forms Vercel forms to Netlify Forms Spam spam filters Custom success custom success pages for better UX Monitoring and analyticsSection titled “Monitoring and analytics” Enable Web on Web Analytics for site monitoring Set up performance monitoring tools for ongoing optimization Testing and validationSection titled “Testing and validation” Pre-launch testingSection titled “Pre-launch testing” Deploy Preview your site using Deploy Previews Function all serverless functions work correctly Form all form submissions and integrations (if applicable) Performance performance tests and audits Cross-browser compatibility across target browsers Feature verificationSection titled “Feature verification” Next.js SSR, ISR, API routes, and middleware functionality Image images load correctly with Netlify Image CDN Redirects and all URL redirects and routing rules Environment all environment variables are working correctly Go-live preparationSection titled “Go-live preparation” Final stepsSection titled “Final steps” Emergency maintenance page process for unexpected issues Team team with rollback procedures Monitoring alerts and monitoring for production traffic DNS planned DNS migration with minimal downtime Post-migrationSection titled “Post-migration” Monitor for any performance regressions or issues Test all comprehensive testing of all site features Update internal documentation with new Netlify workflows Clean old Vercel configurations and deployments after confirming stability Helpful resourcesSection titled “Helpful resources” Next.js on NetlifySection titled “Next.js on Netlify” Next.js on Netlify overview Next.js platform starter template Configuration and migrationSection titled “Configuration and migration” Netlify configuration file reference Redirects and rewrites guide Environment variables setup Production readinessSection titled “Production readiness” Complete production checklist Performance optimization guide Security best practices Support and troubleshootingSection titled “Support and troubleshooting” Troubleshooting guide Fix failed deploys with AI Community forums Need help with your migration? The Netlify community and support team are here to help. Visit our community forums for migration questions or reach out to our support team if you need additional assistance. Last 31, 2026 PreviousSecurity checklistNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n[build]  command = \"next build\"  publish = \".next\"\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.309Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":2193}}126{"id":"doc-set_up_visual_editor_locally_netlify_docs-01a9bf93","source":"documentation","title":"Set up visual editor locally | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/get-started/set-up-visual-editor-locally/","text":"Example:\n```text\nnpm install -g @stackbit/cli\n```\n\nExample:\n```text\nnpm install netlify-cli\n```\n\nExample:\n```text\n$ netlify sites:create-template content-ops-starter\n```\n\nExample:\n```text\nnetlify sites:create-template content-ops-starter     ✔  ? Team: Netlify Testing  ? Site name (leave blank for a random name; you can change it later): docs-test-  site-for-visual-editor-setup\n  Site Created\n  Admin URL: https://app.netlify.com/sites/YOUR_SITE_NAME  URL:       [REDACTED]  Site ID:   [REDACTED]  Repo URL:  https://github.com/REPO-OWNER/YOUR_SITE_NAME  ? Do you want to clone the repository? Yes\n  🚀 Repository cloned successfully. You can find it under the YOUR_SITE_NAME folder\n```\n\nExample:\n```text\nnpm run dev\n```\n\nExample:\n```text\nstackbit dev\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.310Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":6,"totalLines":34,"estimatedTokens":194}}127{"id":"doc-forms_setup_netlify_docs-dca2f534","source":"documentation","title":"Forms setup | Netlify Docs","url":"https://docs.netlify.com/manage/forms/setup/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Forms Forms Setup Submissions Notifications Spam filters Troubleshooting tips Usage and billing On this page Overview Automatic form detection Enable form detection Disable form detection Re-enable form detection HTML forms Submit HTML forms with AJAX JavaScript forms Forms for Next.js or SSR frameworks Work with JavaScript-rendered forms Submit JavaScript-rendered forms with AJAX Success messages Custom success page Custom success alert File uploads File upload security Limitations Submit file uploads with AJAX Set up notifications Review forms usage More Forms resources On this page Overview Automatic form detection Enable form detection Disable form detection Re-enable form detection HTML forms Submit HTML forms with AJAX JavaScript forms Forms for Next.js or SSR frameworks Work with JavaScript-rendered forms Submit JavaScript-rendered forms with AJAX Success messages Custom success page Custom success alert File uploads File upload security Limitations Submit file uploads with AJAX Set up notifications Review forms usage More Forms resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Forms / Forms setup Copy page View as Markdown Copy as Markdown View as Markdown Netlify’s serverless form handling allows you to manage forms without extra API calls or additional JavaScript. Once enabled, the built-in form detection feature allows our build system to automatically parse your HTML at deploy time, so there’s no need for you to make an API call or include extra JavaScript on your site. To get started, enable automatic form detection and then add a netlify attribute to your HTML form. Wondering how Netlify handles form submissions? Visit our form submissions doc to learn more about the form submissions UI, API endpoints, and more. Automatic form detectionSection titled “Automatic form detection” If you would like Netlify to automatically manage your form submissions, you need to enable form detection. Enable form detectionSection titled “Enable form detection” To enable form detection for your the Netlify UI, go to Forms. Select Enable form detection. Starting with your next site deploy, Netlify will automatically scan your deploys for forms that require submission handling. If you previously used Netlify Forms and disabled automatic form detection, follow the steps to re-enable form detection and start accepting submissions again. Disable form detectionSection titled “Disable form detection” You may want to disable form detection if your site doesn’t have forms anymore or if you decide not to use Netlify to manage your forms. Disabling form detection will reduce post processing and may speed up deploys. To disable form detection for your the Netlify UI, go to Forms > Usage and configuration > Form detection. Select Disable form detection. A confirmation prompt will appear. To continue, enter the name of your site and select Disable form detection. Starting with your next site deploy, Netlify will no longer scan your deploys for forms and will disable form submission handling for any new or updated forms. Warning Disabling form detection is intended only for sites that don’t use Netlify Forms. If your site does use Netlify Forms, we recommend removing forms from your site code or altering your code to handle submissions by other means before disabling form detection. Re-enable form detectionSection titled “Re-enable form detection” If you previously used Netlify Forms and disabled automatic form detection, follow these steps to re-enable form the Netlify UI, go to Forms > Usage and configuration > Form detection. Select Enable form detection. Redeploy your site. Once you redeploy your site, Netlify will automatically scan your deploys for forms and start accepting submissions again. HTML formsSection titled “HTML forms” Once you enable form detection, add an HTML form to your site with a data-netlify=\"true\" or a netlify attribute in the <form> tag. Deploy your site with that form included and you can start receiving submissions in your Netlify site admin panel. Your form’s name attribute determines what we call the form in the Netlify UI. If you have more than one form on a site, each form should have a different name attribute. Here’s an example of how to use the data-netlify=\"true\" attribute or the netlify attribute in your with data-netlify attribute Form with netlify attribute <form name=\"contact\" method=\"POST\" data-netlify=\"true\"> <p> <label>Your Name: <input type=\"text\" name=\"name\" /></label> </p> <p> <label>Your Email: <input type=\"email\" name=\"email\" /></label> </p> <p> <label>Your Role: <select name=\"role[]\" multiple> <option value=\"leader\">Leader</option> <option value=\"follower\">Follower</option> </select></label> </p> <p> <label>Message: <textarea name=\"message\"></textarea></label> </p> <p> <button type=\"submit\">Send</button> </p></form> <form name=\"contact\" method=\"POST\" netlify> <p> <label>Your Name: <input type=\"text\" name=\"name\" /></label> </p> <p> <label>Your Email: <input type=\"email\" name=\"email\" /></label> </p> <p> <label>Your Role: <select name=\"role[]\" multiple> <option value=\"leader\">Leader</option> <option value=\"follower\">Follower</option> </select></label> </p> <p> <label>Message: <textarea name=\"message\"></textarea></label> </p> <p> <button type=\"submit\">Send</button> </p></form> When Netlify parses the static HTML for a form you’ve added, the build system automatically strips the data-netlify=\"true\" or netlify attribute from the <form> tag and injects a hidden input named form-name. In the resulting HTML that’s deployed, the data-netlify=\"true\" or netlify attribute is gone, and the hidden form-name input’s value matches the name attribute of <form> like this: <input type=\"hidden\" name=\"form-name\" value=\"contact\" /> Submit HTML forms with AJAXSection titled “Submit HTML forms with AJAX” You don’t have to, but you can submit static HTML forms using AJAX. A static HTML form submitted this way must have data-netlify=true or a netlify attribute inside its <form> tag. For an example of how to set these attributes, review the HTML forms section. Here’s an AJAX form submission example using the fetch API for a static HTML handleSubmit = event => { event.preventDefault(); const myForm = event.target; const formData = new FormData(myForm); fetch(\"/\", { method: \"POST\", headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" }, URLSearchParams(formData).toString() }) .then(() => console.log(\"Form successfully submitted\")) .catch(error => alert(error));}; document.querySelector(\"form\").addEventListener(\"submit\", handleSubmit); Requirements for the body of the request must be URL-encoded. In the above example, the form is passed to a FormData constructor. That object is then encoded using the URLSearchParams constructor and converted to a string. Note that Netlify Forms does not support JSON form data at this time. If the form accepts alphanumeric data only, the request should include the header \"Content-Type\": \"application/x-www-form-urlencoded\". If the form accepts file uploads, including a Content-Type header is not recommended. JavaScript formsSection titled “JavaScript forms” You don’t need to include extra JavaScript on your site to use Netlify Forms. But, if you want to, you can use JavaScript to render a form client-side. You can also submit JavaScript-rendered forms over AJAX. Forms for Next.js or SSR frameworksSection titled “Forms for Next.js or SSR frameworks” If you’re using a pure JavaScript form or SSR (Server Side Rendering), you must include an HTML form that meets this HTML form criteria, including all the input tags with the same names as the JavaScript form. For instructions and examples specific to Next.js 13.5 and above, visit breaking changes for the Next.js runtime. Work with JavaScript-rendered formsSection titled “Work with JavaScript-rendered forms” The Netlify build system finds your forms by parsing the HTML of your site when the build completes. This means that if you’re using JavaScript to render a form client-side, our build system won’t find it in the pre-built files. You can work around a hidden HTML form with the data-netlify=\"true\" attribute or a netlify attribute and input fields with name attributes to match the inputs of your JavaScript-rendered form. You need to apply the same work around if you want to use our reCAPTCHA 2 integration, and create a div element in the hidden HTML with the data-netlify-recaptcha=\"true\" attribute. Add a hidden input to the JavaScript-rendered form or JSX form: <input type=\"hidden\" name=\"form-name\" value=\"name_of_my_form\" /> You can also find related tutorials on our to Integrate Netlify’s Form Handling in a React App How to Integrate Netlify forms in a Vue App While the two articles are fairly framework-specific, the code demonstrates how to prerender forms when working with them in a web application. Submit JavaScript-rendered forms with AJAXSection titled “Submit JavaScript-rendered forms with AJAX” To submit a JavaScript-rendered form built with a framework like Gatsby or Nuxt, you can send an AJAX POST request to any path on your site. Requirements for the need to URL-encode your form data in the body of the request. If you haven’t added a hidden form-name input to your JavaScript-rendered form, you need to send a form-name attribute in the AJAX POST request body. If the form accepts alphanumeric data only, the request should include the header \"Content-Type\": \"application/x-www-form-urlencoded\". If the form accepts file uploads, including a Content-Type header is not recommended. Here’s an AJAX form submission code sample using the fetch API for a JavaScript-rendered form. It uses Gatsby’s navigate function to redirect to a custom page on form submission success. const handleSubmit = event => { event.preventDefault(); const myForm = event.target; const formData = new FormData(myForm); fetch(\"/\", { method: \"POST\", headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" }, URLSearchParams(formData).toString() }) > <input type=\"hidden\" name=\"form-name\" value=\"pizzaOrder\" /> <label> What order did the pizza give to the pineapple? <input name=\"order\" type=\"text\" onChange={handleChange} /> </label> <input type=\"submit\" /> </form>); In the code sample above, a handleChange function updates the form’s state, which ultimately gets sent in a POST request to Netlify. Success messagesSection titled “Success messages” By default, when visitors complete a form, they are redirected to a page with a generically styled success message with a link back to the form page. Custom success pageSection titled “Custom success page” You can replace the default success page with a custom page you create by adding an action attribute to the <form> tag, entering the path of your custom page (like \"/pages/success\") as the value. The path must be relative to the site root, starting with a /. Here’s an example: <form name=\"contact\" action=\"/pages/success\" method=\"POST\" data-netlify=\"true\"></form> If you submit your form using AJAX, reference this Gatsby-specific example of how to set a custom success page. Custom success alertSection titled “Custom success alert” If you use AJAX to submit the form, you can substitute an alert instead of redirecting to a generic or custom page. Here’s an example for an HTML handleSubmit = event => { event.preventDefault(); const myForm = event.target; const formData = new FormData(myForm); fetch(\"/\", { method: \"POST\", headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" }, URLSearchParams(formData).toString() }) .then(() => alert(\"Thank you for your submission\")) .catch(error => alert(error));}; document.querySelector(\"form\").addEventListener(\"submit\", handleSubmit); File uploadsSection titled “File uploads” Netlify Forms can receive files uploaded with form submissions. To do this, add an input with type=\"file\" to any form. Although most browsers will detect the encoding automatically, you can optionally include enctype=\"multipart/form-data\" in the <form> tag, Here’s a sample HTML form with a file upload field: <form name=\"fileForm\" enctype=\"multipart/form-data\" data-netlify=\"true\"> <p> <label> <span>Name:</span> <input name=\"name\" type=\"text\" /> </label> </p> <p> <label> <span>Add file:</span> <input name=\"file\" type=\"file\" /> </label> </p> <button>Submit</button></form><p class=\"result\"></p> File upload securitySection titled “File upload security” Forms that accept file uploads that contain personally identifiable information (PII) require additional security configuration. We recommend using the Very Good Security integration for this type of secure form upload. LimitationsSection titled “Limitations” Keep the following considerations in mind when working with file uploads in forms. Only one file upload per field is supported. For multiple file uploads, use multiple fields. The form request has a maximum size limit of 8 MB. File uploads time out after 30 seconds. Submit file uploads with AJAXSection titled “Submit file uploads with AJAX” When submitting a form with a file upload, including a Content-Type header is not recommended. The browser should detect and set the Content-Type automatically. Here’s an AJAX form submission code sample using the fetch API for the above HTML form with file (\"submit\", event => { event.preventDefault(); const result = document.querySelector(\".result\"); fetch(\"/\", { FormData(event.target), method: \"POST\" }) ) );}); Set up notificationsSection titled “Set up notifications” To monitor the content of your form submissions, you can set up notifications to send the content of the form submissions to an email address or to an external service with an HTTP POST request. Learn more about forms notifications. To set up notifications for your site’s form your site go to Configuration > Notifications > Form submission notifications, and select Add notification. Review forms usageSection titled “Review forms usage” For the last month (or billing period), you can review how many verified form submissions were made and the total storage size of all files uploaded. For your site, go to Forms > Usage and configuration > Usage. Learn more about reviewing and managing forms usage. More Forms resourcesSection titled “More Forms resources” Spam filters Form submissions Form submission notifications Form-triggered functions Troubleshooting tips Forms usage and billing Last 14, 2025 PreviousSet up Preview Server for content sitesNextSubmissions Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n<form name=\"contact\" method=\"POST\" data-netlify=\"true\">  <p>    <label>Your Name: <input type=\"text\" name=\"name\" /></label>  </p>  <p>    <label>Your Email: <input type=\"email\" name=\"email\" /></label>  </p>  <p>    <label>Your Role: <select name=\"role[]\" multiple>      <option value=\"leader\">Leader</option>      <option value=\"follower\">Follower</option>    </select></label>  </p>  <p>    <label>Message: <textarea name=\"message\"></textarea></label>  </p>  <p>    <button type=\"submit\">Send</button>  </p></form>\n```\n\nExample:\n```text\n<form name=\"contact\" method=\"POST\" netlify>  <p>    <label>Your Name: <input type=\"text\" name=\"name\" /></label>  </p>  <p>    <label>Your Email: <input type=\"email\" name=\"email\" /></label>  </p>  <p>    <label>Your Role: <select name=\"role[]\" multiple>      <option value=\"leader\">Leader</option>      <option value=\"follower\">Follower</option>    </select></label>  </p>  <p>    <label>Message: <textarea name=\"message\"></textarea></label>  </p>  <p>    <button type=\"submit\">Send</button>  </p></form>\n```\n\nExample:\n```text\n<input type=\"hidden\" name=\"form-name\" value=\"contact\" />\n```\n\nExample:\n```text\nconst handleSubmit = event => {  event.preventDefault();\n  const myForm = event.target;  const formData = new FormData(myForm);\n  fetch(\"/\", {    method: \"POST\",    headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },    body: new URLSearchParams(formData).toString()  })    .then(() => console.log(\"Form successfully submitted\"))    .catch(error => alert(error));};\ndocument.querySelector(\"form\").addEventListener(\"submit\", handleSubmit);\n```\n\nExample:\n```text\n<input type=\"hidden\" name=\"form-name\" value=\"name_of_my_form\" />\n```\n\nExample:\n```text\nconst handleSubmit = event => {  event.preventDefault();\n  const myForm = event.target;  const formData = new FormData(myForm);\n  fetch(\"/\", {    method: \"POST\",    headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },    body: new URLSearchParams(formData).toString()  })    .then(() => navigate(\"/thank-you/\"))    .catch(error => alert(error));};\n```\n\nExample:\n```text\nreturn (  <form    data-netlify=\"true\"    name=\"pizzaOrder\"    method=\"post\"    onSubmit={handleSubmit}  >    <input type=\"hidden\" name=\"form-name\" value=\"pizzaOrder\" />    <label>      What order did the pizza give to the pineapple?      <input name=\"order\" type=\"text\" onChange={handleChange} />    </label>    <input type=\"submit\" />  </form>);\n```\n\nExample:\n```text\n<form  name=\"contact\"  action=\"/pages/success\"  method=\"POST\"  data-netlify=\"true\"></form>\n```\n\nExample:\n```text\nconst handleSubmit = event => {  event.preventDefault();\n  const myForm = event.target;  const formData = new FormData(myForm);\n  fetch(\"/\", {    method: \"POST\",    headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },    body: new URLSearchParams(formData).toString()  })    .then(() => alert(\"Thank you for your submission\"))    .catch(error => alert(error));};\ndocument.querySelector(\"form\").addEventListener(\"submit\", handleSubmit);\n```\n\nExample:\n```text\n<form name=\"fileForm\" enctype=\"multipart/form-data\" data-netlify=\"true\">  <p>    <label>      <span>Name:</span>      <input name=\"name\" type=\"text\" />    </label>  </p>  <p>    <label>      <span>Add file:</span>      <input name=\"file\" type=\"file\" />    </label>  </p>  <button>Submit</button></form><p class=\"result\"></p>\n```\n\nExample:\n```text\ndocument.forms.fileForm.addEventListener(\"submit\", event => {  event.preventDefault();  const result = document.querySelector(\".result\");  fetch(\"/\", {    body: new FormData(event.target),    method: \"POST\"  })    .then(() => {      result.innerText = \"Success\";    })    .catch(error => {      result.innerText = `Failed: ${error}`;    });});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.312Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":11,"totalLines":66,"estimatedTokens":4939}}128{"id":"doc-customize_visual_editing_experience_netlify_docs-9094374e","source":"documentation","title":"Customize visual editing experience | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/get-started/customize-editing-experience/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Advanced features On this page Overview Advanced features For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Get Started / Customize visual editing experience Copy page View as Markdown Copy as Markdown View as Markdown After enabling visual editing for a site and configuring the visual editor, these are the next steps developers typically take to customize the editing the sitemap navigator and basic page editing Create content presets for more productive content editing Extend a field type with content modeling Unlock inline editing to make changes directly in the preview Advanced featuresSection titled “Advanced features” And as you progress, there are more advanced features to When you’re ready to onboard your business users, ensure your site’s repository is properly set up, connected, and imported to Netlify to enable collaboration and publishing Control access to content, including managing editorial permissions Last 16, 2026 PreviousSet up visual editor locallyNextManage visual editing Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.312Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":922}}129{"id":"doc-set_up_preview_server_for_content_sites_netlify_-a6f0845b","source":"documentation","title":"Set up Preview Server for content sites | Netlify Docs","url":"https://docs.netlify.com/manage/preview-servers/set-up-preview-server-for-content-sites/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Preview Servers Preview Servers Overview Manage a Preview Server Set up Preview Server for content sites On this page Overview Step app/site locally 1. Run locally with the CLI 2. Confirm latest content renders locally Step your environment variables Step up content refresh 1. Add a refresh endpoint to your site 2. Add a webhook On this page Overview Step app/site locally 1. Run locally with the CLI 2. Confirm latest content renders locally Step your environment variables Step up content refresh 1. Add a refresh endpoint to your site 2. Add a webhook For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending https://api.netlify.com/dev_server_hooks/... Last 14, 2025 PreviousManage a Preview ServerNextSetup Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\ncurl -X POST -d {} https://api.netlify.com/dev_server_hooks/...\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.313Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":563}}130{"id":"doc-monitor_project_activity_netlify_docs-ede4fc6d","source":"documentation","title":"Monitor project activity | Netlify Docs","url":"https://docs.netlify.com/manage/projects/monitor-project-activity/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Projects Projects How projects work Customize project name & image Find a project Organize projects Add new project Update project with Agent Runners Connect project to repo Monitor project activity Transfer a project Disable project Resume paused projects On this page Overview Check your project audit log Set up deploy notifications Set up form notifications Use the Slack App to post notifications On this page Overview Check your project audit log Set up deploy notifications Set up form notifications Use the Slack App to post notifications For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Projects / Monitor project activity Copy page View as Markdown Copy as Markdown View as Markdown Monitor activity in your project by checking out your project audit log, setting up notifications, or setting up Slack App notifications. Check your project audit logSection titled “Check your project audit log” This feature is available on Pro and Enterprise plans. Use your project audit log to check for critical changes to your project, such configuration updates environment variables deploy rollbacks (publishing a previous version of your project) To check your project's audit your Project Overview dashboard, go to Logs & Metrics > Audit log. Set up deploy notificationsSection titled “Set up deploy notifications” Set up notifications for your project's deploy activity. Quick background explainer A deploy represents a version of your web project that is published to share as a preview or as a final live version of your project. Learn more about how deploys work. Send deploy notifications to an email address, a pull/merge request on GitHub, GitLab, another Git hosting provider, or an external web service. For example, you can send notifications for these deploy started Deploy succeeded Deploy failed Deploy deleted Deploy locked Deploy unlocked Previously successful deploy failed Previously failed deploy succeeded Set up form notificationsSection titled “Set up form notifications” You can also set up notifications for forms activity in your project. Use the Slack App to post notificationsSection titled “Use the Slack App to post notifications” For even more notification options, check out our Netlify App for Slack integration. Last 16, 2026 PreviousConnect project to repoNextTransfer a project Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.314Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":965}}131{"id":"doc-custom_headers_netlify_docs-53836aa5","source":"documentation","title":"Custom headers | Netlify Docs","url":"https://docs.netlify.com/manage/routing/headers","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Static Routing & Redirects Static Routing & Redirects Overview Custom headers Redirects Overview Redirect options Rewrites proxies Test redirects locally with Netlify CLI On this page Overview Limitations Syntax for the _headers file Syntax for the Netlify configuration file Wildcards and placeholders in paths Multi-value headers Custom headers for different branch or deploy contexts Basic authentication headers On this page Overview Limitations Syntax for the _headers file Syntax for the Netlify configuration file Wildcards and placeholders in paths Multi-value headers Custom headers for different branch or deploy contexts Basic authentication headers For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Routing / Custom headers Copy page View as Markdown Copy as Markdown View as Markdown With custom headers, you can make custom adjustments or additions to the default HTTP headers that Netlify serves with your site when a client makes a request. You can configure custom headers for your Netlify site in two a plain text file called _headers to the publish directory of your site. You can find _headers file syntax details below. Add one or more headers tables to your Netlify configuration file. This method allows for more structured configuration and additional capabilities, as described in the Netlify configuration file syntax section below. LimitationsSection titled “Limitations” Custom headers apply only to files Netlify serves from our own backing store. If you are proxying content to your site or dealing with a URL handled by a function or edge function such as a server-side rendered (SSR) page, custom headers won’t be applied to that content. In those cases, the site being proxied to or the function should return any required headers instead. Visit our docs on edge functions to learn how to configure cache-control headers for edge functions. When you declare headers in a _headers file stored in the publish directory or a Netlify configuration file, the headers are global for all builds and cannot be scoped for specific branches or deploy contexts. However, there is a workaround you can use to set unique headers for each deploy context. You can set most HTTP response fields using custom headers. The following header names are exceptions. Custom headers for these are typically ignored because Netlify’s web servers need to set these headers to work properly. Accept-Ranges Age Allow Alt-Svc Connection Content-Encoding Content-Length Content-Range Date Location - use redirects instead Server Set-Cookie - may be overridden by Netlify cookie handling Trailer Transfer-Encoding Upgrade Setting cookies across subdomains only works for custom domains netlify.app is listed in the Mozilla Foundation’s Public Suffix List, which prevents setting cookies across subdomains. You can only set a cookie for all subdomains if your site uses a custom domain instead of mysitename.netlify.app. Syntax for the _headers fileSection titled “Syntax for the _headers file” In a _headers file, you can specify one or several URL paths with their additional headers indented below line beginning with # will be ignored as a comment. Header field names are case insensitive. Paths can contain wildcards and placeholders. Here is an example of a _headers file with two URL paths: # a path:/templates/index.html # headers for that : DENY# another path:/templates/index2.html # headers for that : SAMEORIGIN Here’s an example of setting the X-Frame-Options header for all pages on your site: /* Make sure we can access the file If you’re running a build command or site generator, the _headers file should end up in the folder you’re deploying. Some generators, like Jekyll, may also require additional configuration to avoid exclusion of files that begin with _. (For Jekyll, this requires adding an include parameter to _config.yml.) Syntax for the Netlify configuration fileSection titled “Syntax for the Netlify configuration file” If you specify your header rules in your Netlify configuration file, you can use a more structured configuration format with additional capabilities such as headers for proxy use TOML’s array of tables to specify each individual header rule. The following keywords are : the path or URL where the headers will be added. map of values to add to the response headers. Header field names are case insensitive. Paths can contain wildcards and placeholders. Here’s an example: [[headers]] for = \"/*\" [headers.values] X-Frame-Options = \"DENY\" Wildcards and placeholders in pathsSection titled “Wildcards and placeholders in paths” Whether you declare headers in a dedicated _headers file or using the [[headers]] section of netlify.toml, you can take advantage of wildcards and placeholders in URL path (*) can be used at any place inside of a path segment to match any character. Placeholders (:placeholders) can only be used at the start of a path segment to match any character except /. Wildcards and placeholders cannot be within the same path segment. For example, /templates/:placeholder* won’t work as the wildcard is considered part of the placeholder name. /templates/*:placeholder won’t work as the placeholder needs to be at the beginning of the path segment, right after the /. Note that Netlify processes wildcards and placeholders in redirects differently than those used in headers. Learn more about the options and limitations for wildcards in splats and placeholders in the redirect options doc. Multi-value headersSection titled “Multi-value headers” Some header fields can accept multiple values. In a _headers file, you can configure multi-value headers by listing multiple headers with the same field name. Netlify will concatenate the values of those headers into a single header as described in the RFC 7230. For example, you can include several cache-control header fields in the file, like this: /* =0 In a netlify.toml, multi-value headers are expressed with multiline strings: [[headers]] for = \"/*\" [headers.values] cache-control = ''' max-age=0, no-cache, no-store, must-revalidate''' In both cases, the values will be collapsed into one header following the HTTP 1.1 : max-age=0,no-cache,no-store,must-revalidate Custom headers for different branch or deploy contextsSection titled “Custom headers for different branch or deploy contexts” By default, when you declare headers in a _headers file stored in the publish directory or in a Netlify configuration file (netlify.toml), the headers are global for all builds and cannot be scoped for specific branches or deploy contexts. To set custom headers for a specific branch or deploy any global header declarations from netlify.toml and, if you have one, remove the _headers file from the publish directory. Create a new custom directory to store your deploy context-specific header files, such as /custom-headers. Create header files for each custom configuration you require and store them in the custom directory. While you can use any file name for each custom file, the files must still follow the syntax for headers files outlined above. In netlify.toml, modify the build command for each deploy context that requires headers. Add the following script to the end of the build command: && cp path-to-your-header-file path-to-your-publish-dir/_headers When the build command for the deploy context runs, Netlify will copy the custom header file to a new file named _headers in the publish directory for use. For example, if the custom headers folder is custom-headers and you want to apply a specific header file _stagingHeaders to your staging branch deploys, you would add the following to your netlify.toml: # Configuration for branch deploys for the branch named `staging`.# Remember to replace `npm run build` with your site's build command# and replace `dist` with your site's publish directory.[context.staging] command = \"npm run build && cp ./custom-headers/_stagingHeaders ./dist/_headers\" Note that in this example, the site uses npm run build as the build command and dist as the publish directory. You should replace those with the appropriate values for your site. Basic authentication headersSection titled “Basic authentication headers” This feature is available on all Pro and Enterprise plans. You can configure Netlify to provide basic authentication headers on paths you want to hide behind a password. Visit the basic authentication page for more information. Last 1, 2025 PreviousOverviewNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# a path:/templates/index.html  # headers for that path:  X-Frame-Options: DENY# another path:/templates/index2.html  # headers for that path:  X-Frame-Options: SAMEORIGIN\n```\n\nExample:\n```text\n/*  X-Frame-Options: DENY\n```\n\nExample:\n```text\n[[headers]]  for = \"/*\"  [headers.values]    X-Frame-Options = \"DENY\"\n```\n\nExample:\n```text\n/*  cache-control: max-age=0  cache-control: no-cache  cache-control: no-store  cache-control: must-revalidate\n```\n\nExample:\n```text\n[[headers]]  for = \"/*\"  [headers.values]  cache-control = '''  max-age=0,  no-cache,  no-store,  must-revalidate'''\n```\n\nExample:\n```text\ncache-control: max-age=0,no-cache,no-store,must-revalidate\n```\n\nExample:\n```text\n# Configuration for branch deploys for the branch named `staging`.# Remember to replace `npm run build` with your site's build command# and replace `dist` with your site's publish directory.[context.staging]  command = \"npm run build && cp ./custom-headers/_stagingHeaders ./dist/_headers\"\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.315Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":7,"totalLines":38,"estimatedTokens":2750}}132{"id":"doc-functions_netlify_docs-e85e91db","source":"documentation","title":"Functions | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/observability/reference/functions/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Observability / Reference / Functions Copy page View as Markdown Copy as Markdown View as Markdown Filter observability data by function names to understand how they are working and the bandwidth they're using. Observability shows the names of functions defined in the netlify/functions directory for your project that were triggered by web requests within the selected time frame. Select a function to learn more about web requests that triggered that function. If you have Observability enabled for your team, then these function related insights replace Netlify’s Function Metrics for your team's projects. For you have an edge function named astro.js in netlify/edge-functions that handles Server-Side Rendering for your project using the Astro extension/build plugin, then the function name may be simpflied to Astro SSR in your observability chart. Last 17, 2025 PreviousBlock reasonNextEdge functions Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.316Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":734}}133{"id":"doc-cache_status_netlify_docs-f570114e","source":"documentation","title":"Cache status | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/observability/reference/cache-status/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Understanding cache misses Stale responses On this page Overview Understanding cache misses Stale responses For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Observability / Reference / Cache status Copy page View as Markdown Copy as Markdown View as Markdown Filter observability data by cache status to understand how your production requests are processed within Netlify's caching layers. Netlify summarizes detailed cache outcomes for each request into a single cache status to make it easier to filter and understand your traffic. StatusDescriptionDetailsHitThe response was served from cache.When you expand a specific request for more details, you’ll see a Hit badge with an additional Edge cache or Durable cache tag. Durable cache appears when the specific edge node didn't have the data, so it went to the durable cache to retrieve it.MissNeither the edge cache nor durable cache had the value.Both caching layers miss and the request goes to the origin. If content existed in cache but was stale, a stale secondary status appears when you expand a specific request for more details.N/ANo cache behavior is recorded for the request.Applies to requests not suitable for caching, such as the redirects (not those defined in netlify.toml, which are cached but redirects we set like redirecting http traffic to https), requests using HTTP methods such as POST (and other methods other than GET), errors (status classes Redirect/Client Error/Server Error), edge functions that return an explicit response (rather than acting as middleware), unless setting response caching(so for customers that use edge functions as API endpoints, this can be quite common). Understanding cache missesSection titled “Understanding cache misses” Cache misses are normal and expected in many situations. Before being concerned about high miss rates, consider the following if misses are from uncacheable requests (errors, redirects, non-GET methods) or genuine content misses. Traffic or infrequently accessed content will naturally miss cache until first accessed. Frequent deploys clear cache more deploys will naturally cause more cache misses because instead of selective page refresh/regeneration, the entire site is regenerated on every deploy. Stale responsesSection titled “Stale responses” Stale content is refreshed at request time unless a cache-control header defines the stale-while-revalidate directive. Learn more about our supported cache control headers. These requests appear with the miss status and when you expand your request details, you'll find a stale secondary status tag. Last 16, 2025 PreviousContent typeNextBlock reason Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.316Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1149}}134{"id":"doc-block_reason_netlify_docs-4a20afed","source":"documentation","title":"Block reason | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/observability/reference/block-reason/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Block reasons Blocked requests not shown in Observability On this page Overview Block reasons Blocked requests not shown in Observability For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Observability / Reference / Block reason Copy page View as Markdown Copy as Markdown View as Markdown Filter observability data by block reason to understand when a request to your web project was blocked by Netlify and why from your Observability dashboard. Netlify evaluates each request through security, caching, compute, and routing layers until a response is generated. Netlify's web security checks Traffic Rules Web Application Firewall (WAF) Rate Limiting Password Protection For more details about the processing order, check out our request chain documentation. Block reasonsSection titled “Block reasons” Block ReasonDescriptionLearn MoreRate limitedRequest was blocked by Netlify's rate limiting feature because the web request details matched a rule in the rate limiting rules to block certain traffic.Rate limitingFirewall Traffic RulesRequest was blocked by Netlify's firewall traffic rules feature because the web request details matched a rule in the firewall traffic rules to block certain traffic.Firewall traffic rulesWAFRequest was blocked by Netlify's WAF (Web Application Firewall) feature because the web request details matched a rule in the Web Application Firewall (WAF) ruleset to block certain traffic.WAFPassword protectionRequest was blocked by Netlify's password protection feature because the site visitor, bot, etc. did not enter the correct password to access your project URL.Password protectionSSO failed loginRequest blocked by failed SSO login when your project has Netlify Identity enabled.SSO loginRequest blocked by SSO login when your project has Netlify Identity enabled.No block reasonNo block reason is recorded for requests within the selected time frame. Request is not blocked by Netlify's Advanced Web Security features, such as Web Application Firewall, Traffic Rules, or Rate Limiting. Blocked requests not shown in ObservabilitySection titled “Blocked requests not shown in Observability” Observability does not display all blocked requests. Requests blocked by Netlify's network-level DDoS protection do not appear in Observability's blocked request metrics or total request counts. If you use a third-party firewall in addition to Netlify's built-in protection, requests blocked by that firewall also will not appear in Observability. Last 18, 2026 PreviousCache statusNextFunctions Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.317Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1121}}135{"id":"doc-function_metrics_netlify_docs-31037c35","source":"documentation","title":"Function Metrics | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/function-metrics/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Use cases Metric definitions Filter your data Deployed functions Time frame Response codes Logs Inspect a deploy on your chart Data retention and freshness Limitations Next steps On this page Overview Use cases Metric definitions Filter your data Deployed functions Time frame Response codes Logs Inspect a deploy on your chart Data retention and freshness Limitations Next steps For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Function Metrics Copy page View as Markdown Copy as Markdown View as Markdown Function Metrics give you insights into the performance, reliability, and usage patterns of functions on your site. Function metrics availability Function Metrics is no longer available for Credit-based plan users or Enterprise users who have the Observability feature enabled. Instead, we recommend these users check out Observability. To explore Function Metrics for your site, go to Logs & Metrics > Functions. Use casesSection titled “Use cases” By analyzing success and error rates alongside other metrics such as invocation count and function duration, you can optimize performance, troubleshoot issues, and make data-driven decisions to enhance the overall quality and user experience of your projects. Optimize performance. Identify performance bottlenecks by analyzing function duration metrics. By pinpointing functions with high average durations or extreme long tails (as indicated by p95 and p99 durations), you can target your optimization efforts. Troubleshoot errors. Find functions with high error rates and drill into the logs to troubleshoot. By observing error rates over time, you can detect trends, enabling proactive problem-solving before errors escalate. With deploy markers on the timeline, you can discover if a spike in errors is associated with a specific change and then rollback to an earlier deploy while you fix the issue. Prioritize development efforts. Understand function invocation patterns to allocate your time more efficiently. By analyzing which low-performing functions receive the most invocations, you can focus on making high-impact improvements. Metric definitionsSection titled “Metric definitions” to your serverless function endpoints. A request to a function path that results in a cached response being served does not count as an invocation. from function endpoints with 5xx status codes. from function endpoints with non-5xx status codes. Average compute time. % of invocations were completed within this time. % of invocations were completed within this time. % of invocations were completed within this time. Percentiles and data granularity Values for p50, p95, and p99 are calculated as an average of hourly percentile scores. Filter your dataSection titled “Filter your data” Focus on the events and information that you care about by filtering your data. Deployed functionsSection titled “Deployed functions” By default, Function Metrics charts include all functions on the production branch. You can change this in a few the filter menus to pick a different Branch, focus on a specific Function, or do both depending on your needs. Select a Function name in the Distribution by function chart to scope the Invocations chart to just that function. Time frameSection titled “Time frame” By default, Function Metrics charts are scoped to the last 24 hours. You can change the time frame in a couple of the Time frame menu to select a different range. Note that data retention varies by team plan. Zoom in by clicking and dragging your desired range in the Invocations chart. Response codesSection titled “Response codes” By default, the Invocations chart is faceted by Success / Error. In these groupings, all 5xx response codes are considered errors and all other response codes are considered successes. You can instead facet the chart by All Statuses for more granular data. In both cases, you can focus on specific response types with facet filters. Here are some the chart is faceted by Success / Error, you can filter it to just the Error data. Filtering the chart to just errors can help you identify patterns and trends that might otherwise be too small to detect when successes are also included in the chart. When the chart is faceted by All Statuses, you can filter it to one or more specific status codes, such as 428. Filtering the chart to a specific status code can help you troubleshoot specific scenarios, such as missing preconditions. LogsSection titled “Logs” You can drill into function logs for more information in a few the Invocations chart, use the Go to Logs link. When the chart includes All functions, the link takes you to the function logs index for your site. When the chart is scoped to a single function, the link takes you to that specific function’s logs filtered to the same time frame you were exploring in Function Metrics. In the Distribution by function chart, use the link on the Errors rate. These links take you to the specific function’s logs filtered to the same time frame you were exploring in Function Metrics. Older logs may no longer be available Note that function metric retention is different than function log retention. If your metrics charts are zoomed in to a time frame in the past, function logs may no longer be available for that period. Inspect a deploy on your chartSection titled “Inspect a deploy on your chart” When the Invocations chart is zoomed in to 3 days or less, it includes deploy markers to help you correlate patterns in your metrics with changes to your production code. Deploy markers are displayed as grey vertical lines in the chart. To inspect deploys, do the sure the Invocations chart is zoomed in to 3 days or less so that deploy markers are included in it. Select a deploy marker to reveal a description based on the pull/merge request title or commit message. Use the link on the deploy description to go to the relevant deploy details page where you can find a deploy summary and deploy log. Data retention and freshnessSection titled “Data retention and freshness” Metrics are retained for at least 7 days even after new function deployments. The metric retention period increases to 30 days for Core Pro and Enterprise plans. We update Function Metrics data on an ongoing basis. There are a few minutes of delay between when an invocation completes and when the metrics data is updated. You will need to refresh your browser to load the updates. LimitationsSection titled “Limitations” Function Metrics do not include data for the Builders Background Functions local invocations triggered while running netlify dev or netlify Next stepsSection titled “Next steps” After identifying patterns, trends, spikes, or other points of interest with Function Metrics you can go deeper with other monitoring tools knowing you’re focusing your efforts on impactful areas. Function logs. Examine per-invocation log statements and messages in a filterable interface. Log Drains. Perform flexible queries in third-party monitoring services. Last 16, 2025 PreviousSplit testingNextMonitor builds Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.318Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2248}}136{"id":"doc-edge_functions_netlify_docs-34b1d69f","source":"documentation","title":"Edge functions | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/observability/reference/edge-functions/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Observability / Reference / Edge functions Copy page View as Markdown Copy as Markdown View as Markdown Filter observability data by Edge Function names to understand how they are working and the bandwidth they're using. Observability shows the names of edge functions defined in the netlify/edge-functions directory for your project that were triggered by web requests within the selected time frame. In your dashboard, select an edge function name to learn more about web requests that triggered that function. The edge function name typically apperas the same as the file name in netlify/edge-functions but Observability can show a more human-readable name if a build plugin or extension specifies this. For you have a Next.js project and have an edge function named in netlify/edge-functions that handles Middleware for your project, then the edge function name may be simplified to Next.js Middleware Handler in your observability chart. Last 16, 2025 PreviousFunctionsNextHTTP method Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.319Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":755}}137{"id":"doc-redirect_options_netlify_docs-cad37f9d","source":"documentation","title":"Redirect options | Netlify Docs","url":"https://docs.netlify.com/manage/routing/redirects/redirect-options","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Static Routing & Redirects Static Routing & Redirects Overview Custom headers Redirects Overview Redirect options Rewrites proxies Test redirects locally with Netlify CLI On this page Overview HTTP status codes Custom 404 page handling Force redirects Splats Placeholders Query parameters Trailing slash Domain-level redirects Redirect by country or language Redirect by role Redirect by cookie presence On this page Overview HTTP status codes Custom 404 page handling Force redirects Splats Placeholders Query parameters Trailing slash Domain-level redirects Redirect by country or language Redirect by role Redirect by cookie presence For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending Last 17, 2025 PreviousOverviewNextRewrites proxies Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# Redirect with a 301/home         /              301\n# Redirect with a 302/my-redirect  /              302\n# Show a custom 404 for this path/ecommerce    /store-closed  404\n# Rewrite a path/pass-through /index.html    200\n```\n\nExample:\n```text\n# Redirect with a 301[[redirects]]from = \"/home\"to = \"/\"status = 301\n# Redirect with a 302[[redirects]]from = \"/my-redirect\"to = \"/\"status = 302\n# Show a custom 404 for this path[[redirects]]from = \"/ecommerce\"to = \"/store-closed\"status = 404\n# Rewrite a path[[redirects]]from = \"/pass-through\"to = \"/index.html\"status = 200\n```\n\nExample:\n```text\n/en/* /en/404.html 404/de/* /de/404.html 404\n```\n\nExample:\n```text\n[[redirects]]from = \"/en/*\"to = \"/en/404.html\"status = 404\n[[redirects]]from = \"/de/*\"to = \"/de/404.html\"status = 404\n```\n\nExample:\n```text\n/best-pets/dogs  /best-pets/cats.html 200!\n```\n\nExample:\n```text\n[[redirects]]from = \"/best-pets/dogs\"to = \"/best-pets/cats.html\"status = 200force = true\n```\n\nExample:\n```text\n/news/*  /blog/:splat\n```\n\nExample:\n```text\n[[redirects]]from = \"/news/*\"to = \"/blog/:splat\"\n```\n\nExample:\n```text\n# This will redirect /jobs/customer-ninja-rockstar/jobs/customer-ninja-rockstar  /careers/support-engineer\n# This will redirect all paths under /jobs except the path above/jobs/*                        /careers/:splat\n# This will never trigger, because the rule above will trigger first/jobs/outdated-job-link        /careers/position-filled\n```\n\nExample:\n```text\n# This will redirect /jobs/customer-ninja-rockstar[[redirects]]from = \"/jobs/customer-ninja-rockstar\"to = \"/careers/support-engineer\"\n# This will redirect all paths under /jobs except the path above[[redirects]]from = \"/jobs/*\"to = \"/careers/:splat\"\n# This will never trigger, because the rule above will trigger first[[redirects]]from = \"/jobs/outdated-job-link\"to = \"/careers/position-filled\"\n```\n\nExample:\n```text\n/news/:month/:date/:year/:slug  /blog/:year/:month/:date/:slug\n```\n\nExample:\n```text\n/store id=:id  /blog/:id  301\n```\n\nExample:\n```text\n/articles id=:id tag=:tag /posts/:tag/:id 301\n```\n\nExample:\n```text\n# Both values - ordering from the browser doesn’t matter; this will cover either./path/* param1=:value1 param2=:value2 /otherpath/:value1/:value2/:splat 301\n# One value or the other.  Must match exactly./path/* param1=:value1 /otherpath/:value1/:splat 301/path/* param2=:value2 /otherpath/:value2/:splat 301\n# Base case, when no params are passed.# Our system forwards all query params to the /otherpath URL if this is the only rule.# Otherwise it matches all requests not matched in a prior rule for the same path such as the ones above./path/* /otherpath/:splat 301\n```\n\nExample:\n```text\n# These rules are effectively the same:# either rule alone would trigger on both paths/blog/title-with-a-typo    /blog/typo-free-title/blog/title-with-a-typo/   /blog/typo-free-title\n# This rule will cause an infinite redirect# because the paths are effectively the same/blog/remove-my-slashes/   /blog/remove-my-slashes  301!\n```\n\nExample:\n```text\n# http and https need separate rules if you don’t force_ssl!http://blog.yoursite.com/* https://www.yoursite.com/blog/:splat 301!https://blog.yoursite.com/* https://www.yoursite.com/blog/:splat 301!\n\n# other URLS might proxy or redirect offsitehttps://frontend.yoursite.com/login/* https://backend.yoursite.com/:splat 200\n```\n\nExample:\n```text\n# Redirect users in Australia or New Zealand to /anz.# There CANNOT be spaces in the last parameter: Country=x,y,z or Language=xx,yy/  /anz     302  Country=au,nz# Redirect users in Israel to /israel/  /israel  302  Country=il\n# Redirect users with Hebrew language preference from /israel to /israel/he/israel/*  /israel/he/:splat  302  Language=he\n```\n\nExample:\n```text\n/products /en-us/products 301! Language=en-us/products /en/products 301! Language=en\n```\n\nExample:\n```text\n# Forward requests to /legacy if the browser sends a cookie# named `is_legacy` or `my_other_cookie`/* /legacy/:splat 200 Cookie=is_legacy,my_other_cookie\n```\n\nExample:\n```text\n# Forward requests to /legacy if the browser sends a cookie# named `is_legacy` or `my_other_cookie`[[redirects]]from = \"/*\"to = \"/legacy/:splat\"status = 200conditions = {Cookie = [\"is_legacy\",\"my_other_cookie\"]}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.321Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":20,"totalLines":120,"estimatedTokens":1611}}138{"id":"doc-user_agent_category_netlify_docs-a3962c5b","source":"documentation","title":"User agent category | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/observability/reference/user-agent-category/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Observability / Reference / User agent category Copy page View as Markdown Copy as Markdown View as Markdown Filter observability data by the user agent category to understand where your project's web requests are coming from. Netlify organizes user-agent request headers into the following categories to help you make sense of where requests to your site are coming from at a high level. To learn how the User-Agent request header is used to identify browsers, operating systems, and device types, check out the WebMDN docs on the User-Agent header. CategoryRequest header valueDescriptionBrowserbrowserMostly human visitors using common browsers.AI Agentai-agentAI chat services (for example, ChatGPT) and other AI tools providing on-demand answers to questions. Typically not high-volume. AI agents are only those that browse a site on demand to answer a user question (for example, when you ask ChatGPT a question and it performs a web search and links back to relevant sources).Page Previewpage-previewSocial networks, chat apps, and other tools fetching links for in-app preview.CrawlercrawlerBulk indexing and scraping of content by self-declared bots (search engines, AI services, feed generators, and similar). Crawlers read a site in bulk for later searches; some are classic search engines, and some are used by AI providers (for example, OpenAI has both a crawler and separate on-demand fetching of specific pages).ToolingtoolingCURL requests, monitoring tools, custom scripts, and other automated programs.Not providedTBDNot all requests include a user agent request header.OtherotherUnique user-agents that Netlify hasn't categorized, typically from specialized browsers or mobile apps. Rare for most customers. For more information, check out Netlify’s docs on User-Agent header value categories. Last 17, 2025 PreviousStatus groupNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.321Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":972}}139{"id":"doc-how_web_analytics_works_netlify_docs-56aac05b","source":"documentation","title":"How Web Analytics works | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/web-analytics/how-web-analytics-works/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Chart data On this page Overview Chart data For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Web Analytics / How Web Analytics works Copy page View as Markdown Copy as Markdown View as Markdown Data for Web Analytics comes from our Content Delivery Network (CDN) server logs. Since there’s no client-side code involved, the performance of your site doesn’t suffer. This also means that data integrity isn’t affected when your visitors use ad blockers or disable JavaScript. Because site activity is tracked anonymously without cookies or personally identifying information, Web Analytics is fully GDPR compliant. We update Web Analytics data on an hourly basis. You will need to refresh your browser to load the updates. To ensure the accuracy of your Web Analytics data, we never use sampling. Chart dataSection titled “Chart data” The Pageviews, Top locations, and Top pages charts include only responses with /html and a status code of 200, 201, or 304. We filter the data by status code this way so that we don’t count errors or double count redirects. This also applies to the Pageviews total for your site. By default, the Unique visitors chart counts different IP addresses engaging with your site within a single day. If someone loads pages of your site on multiple different days, they will be counted as a unique visitor for each day. If you select the 24 hours filter, then the chart will plot different IP addresses engaging with your site within a single hour. If someone loads pages of your site during multiple different hours, they will be counted as a unique visitor for each hour. The Total unique visitors for your site will typically be less than the sum of daily or hourly values because the total counts IP addresses that are unique across the whole charted time period. The Top locations chart tracks the total number of pageviews served for your site in each location. The table provides a summary of the locations that have had the most pageviews, while the map highlights all locations that have had at least one pageview. The Top resources not found chart includes all types of content. You can use it to discover pages in addition to requests for images, text files, and other non-HTML assets that have returned the most 404 errors for your site. Bandwidth used tracks all visitor traffic including 304 responses and 404 errors. This does not include Netlify activity such as building and deploying your site. Last 16, 2025 PreviousOverviewNextReal user monitoring Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.322Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1113}}140{"id":"doc-monitor_builds_netlify_docs-bde34a93","source":"documentation","title":"Monitor builds | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/monitor-builds/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Current status Prioritize a build Historical insights Account usage insights Team usage summary More resources On this page Overview Current status Prioritize a build Historical insights Account usage insights Team usage summary More resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Monitor builds Copy page View as Markdown Copy as Markdown View as Markdown You can check your team’s current builds status and get insights into historical builds usage by visiting your team’s Builds tab. Current statusSection titled “Current status” On the main Builds page, you’ll find a list of all of your team’s builds and their current state such as completed, building, or capacity. Select any build to visit its detail page where you can examine the deploy log, cancel the deploy, and more. The Concurrent builds numbers show how much of your build capacity you’re currently using. If you have any builds that are enqueued awaiting capacity, there will be an alert message with details on how many builds are waiting for capacity. Prioritize a buildSection titled “Prioritize a build” This feature is available on Enterprise plans. If you have a build waiting in your team build queue that you would like to build sooner, team-wide Developers and Owners can prioritize the build so that it runs as soon as the next space opens in your team build capacity. To prioritize a build, go to your team Builds page and select the build you want to prioritize, then select Build next. After confirming your choice, the build will be marked , along with the name of the team member who prioritized it, and the time it was prioritized. The action is also tracked in the team audit log. Your prioritized build will begin when the next active build completes. If you would like the build to start immediately, you can cancel an active build to make room in your team build capacity. Only one build can be prioritized at a time. If any team member selects a new build to prioritize, it will replace the currently prioritized build. Historical insightsSection titled “Historical insights” Switch to the Usage & insights page for more information about your team’s builds usage. Here you’ll find data on how your build minutes have been used including the sites that have accrued the most build time. This data updates hourly. You will need to refresh your browser to load the updates. You can examine the Build minutes used per day and Number of builds per day charts to explore day-level details. In the Top sites chart, you can select the name of any site to visit the site’s dashboard. Account usage insightsSection titled “Account usage insights” You can find additional data about your team’s builds under Billing > Account usage insights. Learn more about usage and insights. Team usage summarySection titled “Team usage summary” For a quick summary of your team’s usage, go to your team’s Projects page and check out the usage metrics above your sites list. Select a metric widget to expand its details. On the Builds card, you can find a condensed list of the latest team builds and their current state. More resourcesSection titled “More resources” Learn more about concurrent builds and build minutes in our Billing doc. Visit our Forums for a verified Support Guide on optimizing what and how you build to reduce build queueing and make the most of your build minutes. You can even temporarily stop builds for a site if needed. Focusing these efforts on the Top sites revealed on the Usage & insights page is likely to have the most impact since those sites are accruing the most build time. Last 4, 2025 PreviousFunction metricsNextStatus badges Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.323Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1401}}141{"id":"doc-real_user_monitoring_netlify_docs-667d480a","source":"documentation","title":"Real User Monitoring | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/real-user-monitoring/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview How Real User Monitoring are collected Enable Real User Monitoring for your site Inspect a deploy on your chart Review Real User Monitoring for different sites Filter your data Timeframe Device types Percentiles Understand your scores Improve your scores and your site’s user experience Content Security Policy support Troubleshoot Real User Monitoring Disable Real User Monitoring On this page Overview How Real User Monitoring are collected Enable Real User Monitoring for your site Inspect a deploy on your chart Review Real User Monitoring for different sites Filter your data Timeframe Device types Percentiles Understand your scores Improve your scores and your site’s user experience Content Security Policy support Troubleshoot Real User Monitoring Disable Real User Monitoring For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Real User Monitoring Copy page View as Markdown Copy as Markdown View as Markdown This feature is available on all Pro and Enterprise plans. The data available depends on your pricing plan. For example, if you have a Personal Credit-based pricing plan, then you get 7 days of Real User Monitoring. If you have a Pro Credit-based pricing plan, you get 30 days of Real User Monitoring. OverviewSection titled “Overview” Real User Monitoring allows you to understand and prioritize the real-world experience of your site visitors. With Real User Monitoring, you can identify the production deploys that most impact your site’s usability and understand site performance based on Web Vitals that rely on real user interactions with your production site. Real User Monitoring surfaces the following Web Vitals based on real user interactions with your site. Web Vitals MetricMeasurement focusQuick definitionLargest Contentful Paint (LCP)Loading experience for largest assetsHow quickly the page completely loadsFirst Input Delay (FID)Interactivity and responsivenessHow quickly the browser responds to a user interaction that relies on JavaScript, such as a click or tapInteraction to Next Paint (INP)Responsiveness as the latency of a user’s click, tap, or keyboard interactionHow quickly the page responds to user interaction. Learn more about INP at the web.dev docs.Cumulative Layout Shift (CLS)Visual stabilityHow much the layout changes as a proxy for the visual stability of your siteFirst Contentful Paint (FCP)Loading speedHow quickly the first parts of a page load These metrics are based on user-centric Web Vitals and include Core Web Vitals. Learn more about these metrics from web.dev. INP has replaced FID The Core Web Vital metric First Input Delay (FID) was deprecated in March 2024 from Core Web Vitals and replaced by Interaction to Next Paint (INP). Learn more in the web.dev docs. How Real User Monitoring are collectedSection titled “How Real User Monitoring are collected” Real User Monitoring collects user-centric Web Vitals based on real site vistor activity and aggregates this data for you along with production deploy details. Unlike Lighthouse, which relies on synthetic testing, Real User Monitoring takes a real user monitoring approach. Once a Team Owner or Developer enables Real User Monitoring for your site, Netlify injects a JavaScript snippet into the HTML of your production site to collect these Web Vitals events. The JavaScript snippet is minified and injected with an async attribute before the closing </body> tag and so it’s expected that there will be very little to no detected impact to site performance for users. Once enabled, Real User Monitoring does not require additional configuration or cookies on the client browser. Note that Ad blockers do not prevent Real User Monitoring from being collected. Real User Monitoring is best for busy sites with many visitors as it aggregates site visitor experiences. This avoids the subway effect, where one user on a subway who experiences a poor web experience doesn’t dramatically offset the results. For a deeper understanding of your site performance, we recommend using Netlify’s analytics tools together. Here’s a quick overview of how these tools compare. Real User MonitoringWeb AnalyticsLighthouseOffers overview of site usability based on site visitor interactions and user-centric Web VitalsOffers general overview of site usage, such as pageviews, number of unique visitors, top locations, etc. with adjustable time scalesOffers usability scores based on Web VitalsOnly for production siteOnly for production siteCan apply to all site deploysGives insights after deploying to productionGives insights after deploying to productionGives insights before deploying to production and afterMost useful for high traffic sitesUseful for any siteUseful for any siteOffers real-world insightsOffers real-world insightsOffers insights based on synthetic testing Enable Real User Monitoring for your siteSection titled “Enable Real User Monitoring for your site” To enable Real User Monitoring for your your Site overview page, go to Logs & Metrics > Real User Monitoring. Select Enable Real User Monitoring. After you enable Real User Monitoring for your site, data collection will start the next time your site is visited. Real User Monitoring data is populated in your charts in one hour increments. Be aware that your data will not populate until people first visit your site. So if no one visits your site, then your charts will stay empty with no data. Data is not backfilled, and is collected on production deploys only. If you turn off Real User Monitoring for your site, you lose the metrics on your Real User Monitoring dashboard. If you turn Real User Monitoring back on, you must wait for new data to update your dashboard. Inspect a deploy on your chartSection titled “Inspect a deploy on your chart” Expand details about a specific production deploy from your Real User Monitoring Chart to understand how your deploy impacts the real-world experience of your site visitors. To inspect a specific deploy from a a gray column (also called a deploy marker) in your chart. Once you select a deploy, the deploy description appears based on a pull/merge request or commit message. To open the deploy details page for your selected deploy, select the deploy description text. The deploy details page offers a deploy summary and your deploy log. Review Real User Monitoring for different sitesSection titled “Review Real User Monitoring for different sites” To quickly review Real User Monitoring for different sites, use the site switcher to change site data for your Real User Monitoring dashboard. Note that Real User Monitoring must be enabled for each site individually. Filter your dataSection titled “Filter your data” Find the specific events and performance metrics that matter most to you with the following Device type Percentiles TimeframeSection titled “Timeframe” By default, Real User Monitoring charts are scoped to the last 7 days. To review your metrics in a more granular timeframe, you can click and drag your desired time frame in a Real User Monitoring chart. Device typesSection titled “Device types” By default, the Real User Monitoring charts are scoped to an aggregate from all device types. To understand how your site performs on different device types, use the device filter above your charts to scope data to mobile or desktop devices. PercentilesSection titled “Percentiles” By default, the Real User Monitoring charts will display scores for the 75th, 95th, and 99th percentiles of all of your site’s page loads. You can expand details for the minimum, average, and maximum metric results. To focus on the percentiles that matter most to you, choose which percentiles to feature in all of your site’s Real User Monitoring charts. To set your chart percentiles, select one or more percentiles at the bottom of any chart. Understand your scoresSection titled “Understand your scores” Each Real User Monitoring category (LCP, CLS, INP, FID, FCP) has a score range for acceptable performance. To help you quickly gauge your site’s performance, we apply score status badges to each chart using Good, Mid, Poor, or Needs improvement. When calculating the overall status of LCP, CLS, INP, FID, FCP for your production site, Netlify only considers metrics within the 75th percentile of all of your production site’s page loads. Score categoryGood rangeMid rangePoor rangeLargest Contentful Paint (LCP)< 2500 ms2500 - 4000 ms> 4000 msCumulative Layout Shift (CLS)< 0.10.1 - 0.25> 0.25Interaction to Next Paint (INP)< 200 ms200 - 500 ms> 500 msFirst Input Delay (FID)< 100 ms100 - 300 ms> 300 msFirst Contentful Paint (FCP)< 1800 ms1800 - 3000 ms> 3000 ms How is the layout shift score calculated? The layout shift score is calculated using this shift score = impact fraction x distance fraction. Improve your scores and your site’s user experienceSection titled “Improve your scores and your site’s user experience” Improve the user-centric Real User Monitoring for your site by checking out these guidelines from web.dev. Content Security Policy supportSection titled “Content Security Policy support” If your site is using a Content Security Policy (CSP), you must add script-src netlify-rum.netlify.app to your CSP rule in your _headers or netlify.toml file to ensure Real User Monitoring can run for your site. Example _headers fileSection titled “Example _headers file” /* Content-Security-Policy: [...] script-src https://netlify-rum.netlify.app Example netlify.toml fileSection titled “Example netlify.toml file” [[headers]] for = \"/*\" [headers.values] Content-Security-Policy = \"[...] script-src https://netlify-rum.netlify.app\" Learn more about using the Content Security Policy. Troubleshoot Real User MonitoringSection titled “Troubleshoot Real User Monitoring” If you are not finding any Real User Monitoring data for a site, consider the your site have a Content Security Policy (CSP)? If so, you'll need to make an update to your CSP configuration. Does your site get very little traffic? If so, be aware that your data will not populate until people first visit your site. Disable Real User MonitoringSection titled “Disable Real User Monitoring” Once disabled, Real User Monitoring charts for your site will no longer be available. If you decide to turn Real User Monitoring back on, you need to wait for new Real User Monitoring data since your charts will not backfill data. To disable the Real User Monitoring service for a site, go to Logs & Metrics > Real User Monitoring. At the bottom of the page, select Disable Real User Monitoring. Last 9, 2026 PreviousHow web analytics worksNextLighthouse Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n/*  Content-Security-Policy: [...] script-src https://netlify-rum.netlify.app\n```\n\nExample:\n```text\n[[headers]]  for = \"/*\"  [headers.values]    Content-Security-Policy = \"[...] script-src https://netlify-rum.netlify.app\"\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.324Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":13,"estimatedTokens":3194}}142{"id":"doc-web_analytics_netlify_docs-4536214c","source":"documentation","title":"Web Analytics | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/web-analytics/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Get started Charts Filters 30 days filter 7 days filter 24 hours filter Remove Web Analytics On this page Overview Get started Charts Filters 30 days filter 7 days filter 24 hours filter Remove Web Analytics For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Web Analytics / Web Analytics Copy page View as Markdown Copy as Markdown View as Markdown With Netlify Web Analytics, you can get a deeper understanding of your projects by monitoring trends in site/app visitor activity. Server-side data collection for Web Analytics complies with the General Data Protection Regulation (GDPR), has no impact on site performance, is not stopped by ad blockers, and does not require any extra configuration. Get startedSection titled “Get started” To enable Web Analytics for your project, go to Logs & Metrics > Analytics and select Enable Analytics. Once enabled for your project, data collection begins once your project is first deployed. Up to 30 days of historical data will be backfilled in your charts. ChartsSection titled “Charts” of your project’s pages being served. Unique IP addresses engaging with your project. Top where your project has had the most pageviews. Top of your project that have had the most pageviews. Top resources not requests for your project that returned the most 404 errors. Top that generated the most traffic to your project. Bandwidth much data has been served by our CDN for your project. By default, Web Analytics charts are scoped to the last 30 days. Filters are available for other time spans. The Pageviews and Unique visitors charts plot daily metrics. You can examine the charts to explore day-level details. Data for the current day updates hourly. In the Top locations chart, you can examine the map to explore pageview counts for all locations. In the Top pages and Top sources charts, you can select the URL of any source or page to visit it in a new tab. Similarly, in the Top resources not found chart, you can select the URL of any resource to visit the 404 page served for it in a new tab. The Bandwidth used chart plots daily metrics. You can examine the chart to explore day-level details about your project’s bandwidth usage. Data for the current day updates hourly. FiltersSection titled “Filters” Filters allow you to check your Analytics data over the span of 30 days, 7 days, or 24 hours. You can review your Analytics data from the last 30 days in 7-day or 24-hour increments by choosing the 7 days or 24 hours filter and then selecting Previous. 30 days filterSection titled “30 days filter” By default, the Analytics page loads all available data for the last 30 days. 7 days filterSection titled “7 days filter” To scope Analytics data to the last 7 days, select the 7 days filter. To review data for other 7-day periods within the last 30 days, select Previous. Charts using the 7 days filter plot daily metrics. You can examine the charts to explore day-level details. Data for the current day updates hourly. 24 hours filterSection titled “24 hours filter” To scope the data to the last day, select the 24 hours filter. Both the range and granularity of the data will update and all data on the page will be scoped to the last day by default. To review data for other 24-hour periods within the last 30 days, select Previous. Charts plot hourly metrics. You can examine the charts to explore hour-level details. Visit our Forums to get inspired, ask questions, and share ideas and feature requests about Netlify Analytics. Remove Web AnalyticsSection titled “Remove Web Analytics” To cancel the Web Analytics service for a project, go to Logs & Metrics > Analytics > Danger zone. Select Cancel Web Analytics service. Web Analytics charts for your project will no longer be available. Last 27, 2026 PreviousUser agent categoryNextHow web analytics works Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.326Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1443}}143{"id":"doc-web_analytics_netlify_docs-301f504b","source":"documentation","title":"Web Analytics | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/web-analytics/overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Get started Charts Filters 30 days filter 7 days filter 24 hours filter Remove Web Analytics On this page Overview Get started Charts Filters 30 days filter 7 days filter 24 hours filter Remove Web Analytics For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Web Analytics / Web Analytics Copy page View as Markdown Copy as Markdown View as Markdown With Netlify Web Analytics, you can get a deeper understanding of your projects by monitoring trends in site/app visitor activity. Server-side data collection for Web Analytics complies with the General Data Protection Regulation (GDPR), has no impact on site performance, is not stopped by ad blockers, and does not require any extra configuration. Get startedSection titled “Get started” To enable Web Analytics for your project, go to Logs & Metrics > Analytics and select Enable Analytics. Once enabled for your project, data collection begins once your project is first deployed. Up to 30 days of historical data will be backfilled in your charts. ChartsSection titled “Charts” of your project’s pages being served. Unique IP addresses engaging with your project. Top where your project has had the most pageviews. Top of your project that have had the most pageviews. Top resources not requests for your project that returned the most 404 errors. Top that generated the most traffic to your project. Bandwidth much data has been served by our CDN for your project. By default, Web Analytics charts are scoped to the last 30 days. Filters are available for other time spans. The Pageviews and Unique visitors charts plot daily metrics. You can examine the charts to explore day-level details. Data for the current day updates hourly. In the Top locations chart, you can examine the map to explore pageview counts for all locations. In the Top pages and Top sources charts, you can select the URL of any source or page to visit it in a new tab. Similarly, in the Top resources not found chart, you can select the URL of any resource to visit the 404 page served for it in a new tab. The Bandwidth used chart plots daily metrics. You can examine the chart to explore day-level details about your project’s bandwidth usage. Data for the current day updates hourly. FiltersSection titled “Filters” Filters allow you to check your Analytics data over the span of 30 days, 7 days, or 24 hours. You can review your Analytics data from the last 30 days in 7-day or 24-hour increments by choosing the 7 days or 24 hours filter and then selecting Previous. 30 days filterSection titled “30 days filter” By default, the Analytics page loads all available data for the last 30 days. 7 days filterSection titled “7 days filter” To scope Analytics data to the last 7 days, select the 7 days filter. To review data for other 7-day periods within the last 30 days, select Previous. Charts using the 7 days filter plot daily metrics. You can examine the charts to explore day-level details. Data for the current day updates hourly. 24 hours filterSection titled “24 hours filter” To scope the data to the last day, select the 24 hours filter. Both the range and granularity of the data will update and all data on the page will be scoped to the last day by default. To review data for other 24-hour periods within the last 30 days, select Previous. Charts plot hourly metrics. You can examine the charts to explore hour-level details. Visit our Forums to get inspired, ask questions, and share ideas and feature requests about Netlify Analytics. Remove Web AnalyticsSection titled “Remove Web Analytics” To cancel the Web Analytics service for a project, go to Logs & Metrics > Analytics > Danger zone. Select Cancel Web Analytics service. Web Analytics charts for your project will no longer be available. Last 27, 2026 PreviousUser agent categoryNextHow web analytics works Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.326Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1443}}144{"id":"doc-log_drains_netlify_docs-ff71d5b8","source":"documentation","title":"Log Drains | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/log-drains/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Configure a log drain Datadog New Relic Axiom Azure Monitor Sumo Logic Splunk Observability Cloud Logflare Amazon S3 General HTTP endpoint Edit a log drain Remove a log drain Traffic log output Function log output Function log output limitations Edge Function log output Deploy log output WAF log output On this page Overview Configure a log drain Datadog New Relic Axiom Azure Monitor Sumo Logic Splunk Observability Cloud Logflare Amazon S3 General HTTP endpoint Edit a log drain Remove a log drain Traffic log output Function log output Function log output limitations Edge Function log output Deploy log output WAF log output For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Log Drains Copy page View as Markdown Copy as Markdown View as Markdown This feature is available on Enterprise plans. The Log Drains feature allows you to connect site traffic logs, function logs, and edge function logs from Netlify's CDN to third-party monitoring services for analysis, alerting, and data persistence. Additionally, this feature allows you to connect deploy logs from our builds service. Once you've configured a log drain for a site, Netlify batches the site's log records from our CDN and build system and posts them to an endpoint in JSON/NDJSON format in near real-time. A configured external monitoring provider receives these records from the intake endpoint and makes them available for processing. You can drain the following traffic log visitor requests for assets and pages. function log information such as function invocations. edge function log edge functions that output console log statements. deploy log deploy information gathered while building and deploying a site. Web Application Firewall (WAF) log WAF rules matching requests. If your site will handle HIPAA-regulated data, visit our Trust Center to download and read our reference architecture for HIPAA-compliant composable sites on Netlify before configuring a log drain. Configure a log drainSection titled “Configure a log drain” To set up a log drain, you must be a Netlify Team Owner and have an account and API key provisioned with an external monitoring provider. Netlify supports integration New Relic Axiom Azure Monitor Sumo Logic Splunk Observability Cloud Logflare Amazon Simple Storage Service (Amazon S3) General HTTP endpoints Select your external monitoring titled “Datadog” For your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select Datadog as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, select the Region where your Datadog site is located. Enter the unique API key for your logging service provider account. Verify that you are entering your API key instead of the Datadog application key. key/value pairs under Tags to tag your logs with certain attributes. These become query parameters in requests to the logs intake endpoint. Available keys for DescriptionExample valueddtagtags associated with logs, grouped into a single list with the value of the application or service generating the log eventsmysubdomain Select Connect. New RelicSection titled “New Relic” For your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select New Relic as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, select the Region that applies to your New Relic account. Enter a License API key, also called INGEST-LICENSE, for your New Relic account. Verify that you're entering your License API key and not your License API key ID or user key. add a tag for your log drain, under Tags, enter the key and value. Then select Add tag. Any tags you add become query parameters in log drain requests to New Relic. Example tags for New descriptionenvironmentproductionenvironment typeservicemysubdomainname of the application or service generating the log eventsFor guided help on optimizing your New Relic dashboard for your site's logs, install the Netlify Logs quickstart on New Relic. Select Connect. AxiomSection titled “Axiom”To configure a log drain that sends your site logs to Axiom, go to Integrations. Install Netlify's Axiom integration, which opens a prompt to authorize the Axiom app to access Netlify on your behalf. Once installed, you're redirected to configure your Netlify integration on Axiom. Copy the Axiom integration token. On Netlify, for your chosen site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select Axiom as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, paste the Integration token copied from Axiom. Confirm with Connect. For an overview of reviewing your logs on Axiom, check out Axiom's Netlify Integration docs.Azure MonitorSection titled “Azure Monitor”To send your site's log drains to Azure Monitor through the Netlify Azure Monitor, from your log analytics workspace, go to Settings > Agents. Under the Log Analytics Agent Instructions dropdown, you'll find the Workspace ID and Primary key you'll need to enter into the Netlify UI. On Netlify, for your chosen site, go to Logs & Metrics > Log Drains. If this is your first log drain for your site, select Enable a log drain. Select Azure as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, enter your Azure Workspace ID and Primary key. Confirm with Connect. For an overview of reviewing your logs on Azure, check out Azure's Analytics workspace docs.Sumo LogicSection titled “Sumo Logic”To configure a log drain that sends logs to your Sumo Logic account, you need your HTTP Logs and Metrics Source in Sumo Logic Set up the log drain in the Netlify UI Configure your HTTP Logs and Metrics Source in Sumo LogicSection titled “Configure your HTTP Logs and Metrics Source in Sumo Logic” If you haven't already, create a hosted collector to collect your data in Sumo Logic. In the Sumo Logic web app, add and configure your HTTP Logs and Metrics Source using Sumo Logic's docs. Ensure that you copy your HTTP Source Address to use in the Netlify UI. Set up the log drain in the Netlify UISection titled “Set up the log drain in the Netlify UI”For security, Netlify hides the full HTTP Source Address in the Netlify UI. After you configure your log drain, only the base URL is visible in the Netlify UI. On Netlify, for your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select Sumo Logic as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, fill in the Full URL field using the HTTP Source Address you copied from Sumo Logic. Select Connect. Splunk Observability CloudSection titled “Splunk Observability Cloud” For your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select Splunk Observability Cloud as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, enter the Realm from your Splunk Observability Cloud profile. Enter the Access Token from your Splunk Observability Cloud settings. Select Connect. LogflareSection titled “Logflare” For your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select Logflare as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, enter your Logflare Ingest API key. To specify where you want your logs to go, enter the Logflare Source ID for your logs. Select Connect. Amazon S3Section titled “Amazon S3”To configure a log drain that sends logs to your Amazon S3 account as Gzip-compressed files, you need an Amazon S3 bucket and set up a bucket policy Configure the log drain in the Netlify UI Create an Amazon S3 bucket and set up a bucket policySection titled “Create an Amazon S3 bucket and set up a bucket policy” In the AWS Management Console, create an S3 bucket. Object Ownership for the bucket should be set to either Bucket owner enforced or Bucket owner preferred. Make note of the bucket name to use in your Netlify configuration. Go to your bucket's Permissions and under Bucket policy select Edit. Copy and paste the following bucket policy, replacing YOUR_BUCKET_NAME with the name of your Amazon S3 { \"Version\": \"2012-10-17\", \"Statement\": [ { \"Sid\": \"NetlifyLogDrains\", \"Effect\": \"Allow\", \"Principal\": { \"AWS\": \"arn:aws:iam::128866310339:role/log-shipper\" }, \"Action\": \"s3:PutObject\", \"Resource\": \"arn:aws:s3:::YOUR_BUCKET_NAME/*\", \"Condition\": { \"StringEquals\": { \"s3:x-amz-acl\": \"bucket-owner-full-control\" } } } ]} Select Save Changes. Bucket lifecycle For cost control reasons, we recommend deleting logs after a period of 90 days. You can configure your Amazon S3 bucket to delete logs automatically by setting lifecycle rules. Configure the log drain in the Netlify UISection titled “Configure the log drain in the Netlify UI” For your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select Amazon S3 as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, select the Bucket region where your bucket is located. Enter your S3 Bucket name. Enter your S3 Bucket path. We recommend using YOUR_BUCKET_NAME/logs/netlify/. Select Verify bucket and connect. Use the provided path to navigate to your S3 bucket's verification file. Copy and paste the contents of the file into the Verification token field, then select Verify. General HTTP endpointSection titled “General HTTP endpoint”Netlify's General HTTP endpoint support allows you to set up a custom log drain with any external monitoring provider that accepts log drain requests in JSON or NDJSON format.To set up a custom log drain, you must provide a full URL of your external monitoring provider's endpoint. Depending on your external monitoring provider, you can enter your API key as a query parameter in your endpoint or you can enter an Authorization header in the Netlify UI.For example, this URL includes an API key and a tag as query ://YOUR_ENDPOINT_RESOURCE_PATH?api-key=YOUR_API_KEY&environment=productionFor security, Netlify hides the full endpoint in the Netlify UI. After you configure your log drain, only the base URL is visible in the Netlify UI. For your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select General HTTP endpoint as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, enter the Full URL for your endpoint, including any optional tags as query parameters. Depending on your external monitoring provider, enter your API key as a query parameter in your endpoint or under Authorization header. Select the Log Drain Format that your endpoint accepts. Select Connect. Edit a log drainSection titled “Edit a log drain” If you need to adjust the settings for an existing log drain, under Logs & Metrics > Log Drains, select Configure. Configuration changes become active within approximately five minutes. To stop sending specific log data to your external monitoring provider, clear the Log types you no longer need and then save your change. Remove a log drainSection titled “Remove a log drain” To terminate an existing log drain configuration for a site, under Logs & Metrics > Log Drains, select Delete. All log types associated with the site's log drain will be removed. Saved logs are accessible in your logging service provider account. Traffic log outputSection titled “Traffic log output” Drained site traffic logs include the following fields parsed from our CDN : ID of the Netlify team that the site belongs to. address of the client. Omitted if you selected Exclude personally identifiable information (PII). of the request (for example, text/html). of origin for the request, formatted as an ISO 3166-1 two-letter code. of the deploy (for example, 61153ae8b0f6a900088386e8). of processing the request and sending the response, in milliseconds. Firewall traffic rule that matches the request. Can be one of default_allow, default_deny, ip_allow, ip_deny, geo_allow, geo_deny , or -. If there are no traffic rules added to a site, then firewall_rule returns -. Learn more about Firewall traffic rules. why the request was blocked. If there are rate limiting rules applied to the site and if the rules match the request, then block_reason returns rate_limit. Learn more about Rate limiting Rules. : ID of the rate limiting rule the request matched. Learn more about Rate limiting Rules. [Deprecated] of the rate limiting rule the request matched. This field is being deprecated and will disappear in a future release, use rate_limit.rule_id instead. the type of log. The value is traffic. method. on the request. request ID (for example, 01FDWR77JMF2DA1CHF5YA6H07C). of the request in bytes. of the response in bytes. of the site. code of the HTTP response. of the request, formatted with RFC 3339 (for example, :34.831Z). of the request. that made the request. Omitted if you selected Exclude personally identifiable information (PII). : indicates the outcome of the request evaluated by Web Application Firewall (WAF). Can be one of passive, blocked, under threshold, or no match. When WAF is enabled in passive mode and a request matches a WAF rule, the outcome is passive. When WAF is enabled in blocking mode and a request matches enough WAF rules to surpass the anomaly threshold, then the outcome is blocked. Otherwise, the outcome is under threshold. When WAF is enabled in passive or blocking mode, and a request does not match any enabled WAF rules, the outcome is no match. of the matched Web Application Firewall rule. of the WAF policy applied to the evaluated request. The WAF policy represents all enabled WAF rules or rulesets and any additional configuration, such as excluded paths or whether the passive or blocked mode are enabled. of the ruleset applied to the evaluated request. Function log outputSection titled “Function log output” Drained function logs include the following fields parsed from our CDN : ID of the Netlify team that the function belongs to. branch of the deploy. of the deploy (for example, 61153ae8b0f6a900088386e8). of time it took for AWS Lambda to execute the function. of the function. of function (for example, regular for a synchronous function or background for a background function). Note this value may be standard for functions deployed before November 5, 2024, independent of the underlying type. of the log line (for example, INFO, ERROR, WARN, REPORT). message. indicating the type of log. All function types will have the value functions. of the request (for example, GET). of the request (for example, /.netlify/functions/your-awesome-function). request ID (for example, 01FDWR77JMF2DA1CHF5YA6H07C). of the site. code of the HTTP response. of the request, formatted with RFC 3339 (for example, :34.831Z). Function log output limitationsSection titled “Function log output limitations” Netlify's Log Drains feature doesn't currently support function log output for Background Functions. We recommend storing historical logs for this type of function on an external service. Function log output is limited to 4 KB total per invocation. If a log's output exceeds 4 KB, only the last 4 KB of the log is sent to the logging service and the log message will be truncated. Edge Function log outputSection titled “Edge Function log output” Drained edge function logs include the following fields parsed from our CDN : ID of the Netlify team that the edge function belongs to. of the branch. This field is only present for non-production branches. of the deploy (for example, 61153ae8b0f6a900088386e8). of the edge function. of function. The value for edge function logs is edge. of the log line (for example, INFO, ERROR, WARN, REPORT). indicating the type of log. All function types, including edge functions, will have the value functions. request ID (for example, 01FDWR77JMF2DA1CHF5YA6H07C). of the request (for example, /log). of the site. of the request, formatted with RFC 3339 (for example, :34.831Z). Log messages will appear in the content field for your logging service. Deploy log outputSection titled “Deploy log output” Drained deploy logs include the following fields parsed from our internal build : ID of the Netlify team that the deploy belongs to. of the deploy (for example, 61153ae8b0f6a900088386e8). of the deploy process (for example, Initializing, Building, Deploying, Cleanup, Post-Processing). of the log line (for example, INFO, ERROR, WARN, REPORT). indicating the type of log. The value is deploys. message. of the site. of the log line, formatted with RFC 3339 (for example, :34.831Z). WAF log outputSection titled “WAF log output” Drained WAF logs include the following : ID of the site. of the deploy (for example, 61153ae8b0f6a900088386e8). of the Netlify team that the site belongs to. of the evaluated WAF policy, which defines the WAF rules to be evaluated. of the request in Unix epoch nanosecond format (for example, 1725353586606141655). : indicates the final action taken for the request, can be one of LOG or BLOCK. : Netlify request ID (for example, 01FDWR77JMF2DA1CHF5YA6H07C). method. HTTP protocol, can be one of HTTPS or HTTP. of the request. IP used to create the connection to Netlify. Omitted if you selected Exclude personally identifiable information (PII). of the original client if the request originates from a known source (such as Cloudfront). In those cases, the connection_ip will refer to the known source's outgoing IP, and client_ip refers to the request handled by known source. If the request does not come from a known source, client_ip and connection_ip are the same. Omitted if you selected Exclude personally identifiable information (PII). : full name of the country of origin for the request. of the request in bytes. : HTTP status of the response (for example, 200). of the response in bytes. with information about each ruleset evaluated for the request. Each item on the list has the following : ID of the ruleset (for now always crs-basic). of the ruleset (for example, v1.0.0). how the ruleset was evaluated, can be one of passive or block. the outcome of the request evaluated by Web Application Firewall (WAF). Can be one of under_threshold, blocked, passive or no_match. When the request's calculated score was lower than the threshold needed to trigger the set action, the outcome is under_threshold, and no block was applied. When the request was blocked because it was over the anomaly threshold, the outcome is blocked. When the request is over the anomaly threshold but the ruleset is set to passive mode, the outcome is passive. When the request matched no rules, the outcome is no_match. anomaly score calculated for the overall request. anomaly threshold set for the overall request. anomaly score calculated for each rule category of the evaluated request. anomaly threshold set for each rule category (only set if defined by the user). with information about the rules that matched for this ruleset. Each item on the list has the following : ID of the rule. of labels for the matched rule, obtained from the CRS definition (for example, [\"platform-multi\", \"attack-protocol\", \"paranoia-level/1\"]). with information about the rule matching logic and the input provided from the request. Each item on the list has the following : type of the matcher being used on the rule, each one matching on a different type of input. Can be one of header (a single HEADER-VALUE pair), cookie (full value of the cookie header of the request), path (request path), method (request method), query (decoded request query), protocol (request protocol), uri (decoded request URI), uri_raw (encoded request URI), header_names (names of the request headers), cookie_names (names of cookies - the key on each key-value pair), query_string (encoded request query), query_names (names of the request query - the key on each key-value pair) or request_line (HTTP plaintext representation of the request line, for example GET /background.png HTTP/1.0.) representation of the rule matcher being evaluated (for example, KEY Host, VALUE EQUALS 0). value matched for this rule matcher. there was an error evaluating the rule (only set if an error occurred). Last 16, 2025 PreviousLighthouseNextLogs Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n{  \"Version\": \"2012-10-17\",  \"Statement\": [    {      \"Sid\": \"NetlifyLogDrains\",      \"Effect\": \"Allow\",      \"Principal\": {        \"AWS\": \"arn:aws:iam::128866310339:role/log-shipper\"      },      \"Action\": \"s3:PutObject\",      \"Resource\": \"arn:aws:s3:::YOUR_BUCKET_NAME/*\",      \"Condition\": {        \"StringEquals\": {          \"s3:x-amz-acl\": \"bucket-owner-full-control\"        }      }    }  ]}\n```\n\nExample:\n```text\nhttp://YOUR_ENDPOINT_RESOURCE_PATH?api-key=YOUR_API_KEY&environment=production\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.329Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":13,"estimatedTokens":6231}}145{"id":"doc-real_user_monitoring_netlify_docs-9609bf2a","source":"documentation","title":"Real User Monitoring | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/real-user-monitoring","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview How Real User Monitoring are collected Enable Real User Monitoring for your site Inspect a deploy on your chart Review Real User Monitoring for different sites Filter your data Timeframe Device types Percentiles Understand your scores Improve your scores and your site’s user experience Content Security Policy support Troubleshoot Real User Monitoring Disable Real User Monitoring On this page Overview How Real User Monitoring are collected Enable Real User Monitoring for your site Inspect a deploy on your chart Review Real User Monitoring for different sites Filter your data Timeframe Device types Percentiles Understand your scores Improve your scores and your site’s user experience Content Security Policy support Troubleshoot Real User Monitoring Disable Real User Monitoring For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Real User Monitoring Copy page View as Markdown Copy as Markdown View as Markdown This feature is available on all Pro and Enterprise plans. The data available depends on your pricing plan. For example, if you have a Personal Credit-based pricing plan, then you get 7 days of Real User Monitoring. If you have a Pro Credit-based pricing plan, you get 30 days of Real User Monitoring. OverviewSection titled “Overview” Real User Monitoring allows you to understand and prioritize the real-world experience of your site visitors. With Real User Monitoring, you can identify the production deploys that most impact your site’s usability and understand site performance based on Web Vitals that rely on real user interactions with your production site. Real User Monitoring surfaces the following Web Vitals based on real user interactions with your site. Web Vitals MetricMeasurement focusQuick definitionLargest Contentful Paint (LCP)Loading experience for largest assetsHow quickly the page completely loadsFirst Input Delay (FID)Interactivity and responsivenessHow quickly the browser responds to a user interaction that relies on JavaScript, such as a click or tapInteraction to Next Paint (INP)Responsiveness as the latency of a user’s click, tap, or keyboard interactionHow quickly the page responds to user interaction. Learn more about INP at the web.dev docs.Cumulative Layout Shift (CLS)Visual stabilityHow much the layout changes as a proxy for the visual stability of your siteFirst Contentful Paint (FCP)Loading speedHow quickly the first parts of a page load These metrics are based on user-centric Web Vitals and include Core Web Vitals. Learn more about these metrics from web.dev. INP has replaced FID The Core Web Vital metric First Input Delay (FID) was deprecated in March 2024 from Core Web Vitals and replaced by Interaction to Next Paint (INP). Learn more in the web.dev docs. How Real User Monitoring are collectedSection titled “How Real User Monitoring are collected” Real User Monitoring collects user-centric Web Vitals based on real site vistor activity and aggregates this data for you along with production deploy details. Unlike Lighthouse, which relies on synthetic testing, Real User Monitoring takes a real user monitoring approach. Once a Team Owner or Developer enables Real User Monitoring for your site, Netlify injects a JavaScript snippet into the HTML of your production site to collect these Web Vitals events. The JavaScript snippet is minified and injected with an async attribute before the closing </body> tag and so it’s expected that there will be very little to no detected impact to site performance for users. Once enabled, Real User Monitoring does not require additional configuration or cookies on the client browser. Note that Ad blockers do not prevent Real User Monitoring from being collected. Real User Monitoring is best for busy sites with many visitors as it aggregates site visitor experiences. This avoids the subway effect, where one user on a subway who experiences a poor web experience doesn’t dramatically offset the results. For a deeper understanding of your site performance, we recommend using Netlify’s analytics tools together. Here’s a quick overview of how these tools compare. Real User MonitoringWeb AnalyticsLighthouseOffers overview of site usability based on site visitor interactions and user-centric Web VitalsOffers general overview of site usage, such as pageviews, number of unique visitors, top locations, etc. with adjustable time scalesOffers usability scores based on Web VitalsOnly for production siteOnly for production siteCan apply to all site deploysGives insights after deploying to productionGives insights after deploying to productionGives insights before deploying to production and afterMost useful for high traffic sitesUseful for any siteUseful for any siteOffers real-world insightsOffers real-world insightsOffers insights based on synthetic testing Enable Real User Monitoring for your siteSection titled “Enable Real User Monitoring for your site” To enable Real User Monitoring for your your Site overview page, go to Logs & Metrics > Real User Monitoring. Select Enable Real User Monitoring. After you enable Real User Monitoring for your site, data collection will start the next time your site is visited. Real User Monitoring data is populated in your charts in one hour increments. Be aware that your data will not populate until people first visit your site. So if no one visits your site, then your charts will stay empty with no data. Data is not backfilled, and is collected on production deploys only. If you turn off Real User Monitoring for your site, you lose the metrics on your Real User Monitoring dashboard. If you turn Real User Monitoring back on, you must wait for new data to update your dashboard. Inspect a deploy on your chartSection titled “Inspect a deploy on your chart” Expand details about a specific production deploy from your Real User Monitoring Chart to understand how your deploy impacts the real-world experience of your site visitors. To inspect a specific deploy from a a gray column (also called a deploy marker) in your chart. Once you select a deploy, the deploy description appears based on a pull/merge request or commit message. To open the deploy details page for your selected deploy, select the deploy description text. The deploy details page offers a deploy summary and your deploy log. Review Real User Monitoring for different sitesSection titled “Review Real User Monitoring for different sites” To quickly review Real User Monitoring for different sites, use the site switcher to change site data for your Real User Monitoring dashboard. Note that Real User Monitoring must be enabled for each site individually. Filter your dataSection titled “Filter your data” Find the specific events and performance metrics that matter most to you with the following Device type Percentiles TimeframeSection titled “Timeframe” By default, Real User Monitoring charts are scoped to the last 7 days. To review your metrics in a more granular timeframe, you can click and drag your desired time frame in a Real User Monitoring chart. Device typesSection titled “Device types” By default, the Real User Monitoring charts are scoped to an aggregate from all device types. To understand how your site performs on different device types, use the device filter above your charts to scope data to mobile or desktop devices. PercentilesSection titled “Percentiles” By default, the Real User Monitoring charts will display scores for the 75th, 95th, and 99th percentiles of all of your site’s page loads. You can expand details for the minimum, average, and maximum metric results. To focus on the percentiles that matter most to you, choose which percentiles to feature in all of your site’s Real User Monitoring charts. To set your chart percentiles, select one or more percentiles at the bottom of any chart. Understand your scoresSection titled “Understand your scores” Each Real User Monitoring category (LCP, CLS, INP, FID, FCP) has a score range for acceptable performance. To help you quickly gauge your site’s performance, we apply score status badges to each chart using Good, Mid, Poor, or Needs improvement. When calculating the overall status of LCP, CLS, INP, FID, FCP for your production site, Netlify only considers metrics within the 75th percentile of all of your production site’s page loads. Score categoryGood rangeMid rangePoor rangeLargest Contentful Paint (LCP)< 2500 ms2500 - 4000 ms> 4000 msCumulative Layout Shift (CLS)< 0.10.1 - 0.25> 0.25Interaction to Next Paint (INP)< 200 ms200 - 500 ms> 500 msFirst Input Delay (FID)< 100 ms100 - 300 ms> 300 msFirst Contentful Paint (FCP)< 1800 ms1800 - 3000 ms> 3000 ms How is the layout shift score calculated? The layout shift score is calculated using this shift score = impact fraction x distance fraction. Improve your scores and your site’s user experienceSection titled “Improve your scores and your site’s user experience” Improve the user-centric Real User Monitoring for your site by checking out these guidelines from web.dev. Content Security Policy supportSection titled “Content Security Policy support” If your site is using a Content Security Policy (CSP), you must add script-src netlify-rum.netlify.app to your CSP rule in your _headers or netlify.toml file to ensure Real User Monitoring can run for your site. Example _headers fileSection titled “Example _headers file” /* Content-Security-Policy: [...] script-src https://netlify-rum.netlify.app Example netlify.toml fileSection titled “Example netlify.toml file” [[headers]] for = \"/*\" [headers.values] Content-Security-Policy = \"[...] script-src https://netlify-rum.netlify.app\" Learn more about using the Content Security Policy. Troubleshoot Real User MonitoringSection titled “Troubleshoot Real User Monitoring” If you are not finding any Real User Monitoring data for a site, consider the your site have a Content Security Policy (CSP)? If so, you'll need to make an update to your CSP configuration. Does your site get very little traffic? If so, be aware that your data will not populate until people first visit your site. Disable Real User MonitoringSection titled “Disable Real User Monitoring” Once disabled, Real User Monitoring charts for your site will no longer be available. If you decide to turn Real User Monitoring back on, you need to wait for new Real User Monitoring data since your charts will not backfill data. To disable the Real User Monitoring service for a site, go to Logs & Metrics > Real User Monitoring. At the bottom of the page, select Disable Real User Monitoring. Last 9, 2026 PreviousHow web analytics worksNextLighthouse Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n/*  Content-Security-Policy: [...] script-src https://netlify-rum.netlify.app\n```\n\nExample:\n```text\n[[headers]]  for = \"/*\"  [headers.values]    Content-Security-Policy = \"[...] script-src https://netlify-rum.netlify.app\"\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.331Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":13,"estimatedTokens":3194}}146{"id":"doc-split_testing_netlify_docs-5e7530f2","source":"documentation","title":"Split Testing | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/split-testing","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Requirements and limitations Run a branch-based test Set up client-side analytics tracking Expose branch information in your site Send to Google Analytics Send to Segment Use snippet injection for more flexibility On this page Overview Requirements and limitations Run a branch-based test Set up client-side analytics tracking Expose branch information in your site Send to Google Analytics Send to Segment Use snippet injection for more flexibility For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending If you use React, you can access the same variable from the process environment at build You can read more about this environment variable and many others in our environment variables documentation. Send to Google AnalyticsSection titled “Send to Google Analytics” Google Analytics supports dimensional data that can be associated to events. You can use this feature to send the split test information that you compiled in the previous build. For example, if you're using Google Analytics in a site built with Hugo, you can use this template to track the branch a visitor is seeing: <!-- install Google Analytics' JS tracker before using this code --><!-- https://developers.google.com/analytics/devguides/collection/analyticsjs/ --><script> ga('send', 'pageview', { 'Branch': '{{ getenv \"BRANCH\" }}' });</script> Send to SegmentSection titled “Send to Segment” Segment is a platform that allows you to multiplex tracking information and send it to different services at the same time. Their JavaScript library also supports dimensional data that you can use to send the split test information. To follow Google Analytics' example, you can track the testing branch every time someone visits your site with a snippet like this one: <!-- install Segment's JS tracker before using this code --><!-- https://segment.com/docs/sources/website/analytics.js/quickstart/#step-1-copy-the-snippet --><script> analytics.track('pageview', { 'Branch': '{{ getenv \"BRANCH\" }}' });</script> Use snippet injection for more flexibilitySection titled “Use snippet injection for more flexibility” You might want those analytics scripts only in your production environment. After all, you don't want to send tracking information when you're developing your site. You can use Netlify's snippet injection to add those scripts right when we deploy your site. Snippet injection uses Liquid templates to expose environment variables to your snippets. This gives you the ability to inject the testing branch value without having to worry about which build tool you're using. To inject analytics scripts using Netlify's snippet injection, go to Project configuration > Build & deploy > Post processing, find the Snippet injection section, and select Add Snippet. Following the previous Google Analytics example, you can inject this template as a snippet: <!-- install Google Analytics' JS tracker before using this code --><!-- https://developers.google.com/analytics/devguides/collection/analyticsjs/ --><script> ga('send', 'pageview', { 'Branch': '{{ BRANCH }}' });</script> In that same way, you can inject this template as a snippet to use Segment: <!-- install Segment's JS tracker before using this code --><!-- https://segment.com/docs/sources/website/analytics.js/quickstart/#step-1-copy-the-snippet--><script> analytics.track('pageview', { 'Branch': '{{ BRANCH }}' });</script> Last 18, 2026 PreviousLogsNextFunction metrics Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n{{ getenv \"BRANCH\" }}\n```\n\nExample:\n```text\nprocess.env.BRANCH\n```\n\nExample:\n```text\n<!-- install Google Analytics' JS tracker before using this code --><!-- https://developers.google.com/analytics/devguides/collection/analyticsjs/ --><script>  ga('send', 'pageview', {    'Branch':  '{{ getenv \"BRANCH\" }}'  });</script>\n```\n\nExample:\n```text\n<!-- install Segment's JS tracker before using this code --><!-- https://segment.com/docs/sources/website/analytics.js/quickstart/#step-1-copy-the-snippet --><script>  analytics.track('pageview', {    'Branch': '{{ getenv \"BRANCH\" }}'  });</script>\n```\n\nExample:\n```text\n<!-- install Google Analytics' JS tracker before using this code --><!-- https://developers.google.com/analytics/devguides/collection/analyticsjs/ --><script>  ga('send', 'pageview', {    'Branch':  '{{ BRANCH }}'  });</script>\n```\n\nExample:\n```text\n<!-- install Segment's JS tracker before using this code --><!-- https://segment.com/docs/sources/website/analytics.js/quickstart/#step-1-copy-the-snippet--><script>  analytics.track('pageview', {    'Branch': '{{ BRANCH }}'  });</script>\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.333Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":6,"totalLines":33,"estimatedTokens":1598}}147{"id":"doc-log_drains_netlify_docs-c75dbf7d","source":"documentation","title":"Log Drains | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/log-drains","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Configure a log drain Datadog New Relic Axiom Azure Monitor Sumo Logic Splunk Observability Cloud Logflare Amazon S3 General HTTP endpoint Edit a log drain Remove a log drain Traffic log output Function log output Function log output limitations Edge Function log output Deploy log output WAF log output On this page Overview Configure a log drain Datadog New Relic Axiom Azure Monitor Sumo Logic Splunk Observability Cloud Logflare Amazon S3 General HTTP endpoint Edit a log drain Remove a log drain Traffic log output Function log output Function log output limitations Edge Function log output Deploy log output WAF log output For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Log Drains Copy page View as Markdown Copy as Markdown View as Markdown This feature is available on Enterprise plans. The Log Drains feature allows you to connect site traffic logs, function logs, and edge function logs from Netlify's CDN to third-party monitoring services for analysis, alerting, and data persistence. Additionally, this feature allows you to connect deploy logs from our builds service. Once you've configured a log drain for a site, Netlify batches the site's log records from our CDN and build system and posts them to an endpoint in JSON/NDJSON format in near real-time. A configured external monitoring provider receives these records from the intake endpoint and makes them available for processing. You can drain the following traffic log visitor requests for assets and pages. function log information such as function invocations. edge function log edge functions that output console log statements. deploy log deploy information gathered while building and deploying a site. Web Application Firewall (WAF) log WAF rules matching requests. If your site will handle HIPAA-regulated data, visit our Trust Center to download and read our reference architecture for HIPAA-compliant composable sites on Netlify before configuring a log drain. Configure a log drainSection titled “Configure a log drain” To set up a log drain, you must be a Netlify Team Owner and have an account and API key provisioned with an external monitoring provider. Netlify supports integration New Relic Axiom Azure Monitor Sumo Logic Splunk Observability Cloud Logflare Amazon Simple Storage Service (Amazon S3) General HTTP endpoints Select your external monitoring titled “Datadog” For your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select Datadog as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, select the Region where your Datadog site is located. Enter the unique API key for your logging service provider account. Verify that you are entering your API key instead of the Datadog application key. key/value pairs under Tags to tag your logs with certain attributes. These become query parameters in requests to the logs intake endpoint. Available keys for DescriptionExample valueddtagtags associated with logs, grouped into a single list with the value of the application or service generating the log eventsmysubdomain Select Connect. New RelicSection titled “New Relic” For your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select New Relic as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, select the Region that applies to your New Relic account. Enter a License API key, also called INGEST-LICENSE, for your New Relic account. Verify that you're entering your License API key and not your License API key ID or user key. add a tag for your log drain, under Tags, enter the key and value. Then select Add tag. Any tags you add become query parameters in log drain requests to New Relic. Example tags for New descriptionenvironmentproductionenvironment typeservicemysubdomainname of the application or service generating the log eventsFor guided help on optimizing your New Relic dashboard for your site's logs, install the Netlify Logs quickstart on New Relic. Select Connect. AxiomSection titled “Axiom”To configure a log drain that sends your site logs to Axiom, go to Integrations. Install Netlify's Axiom integration, which opens a prompt to authorize the Axiom app to access Netlify on your behalf. Once installed, you're redirected to configure your Netlify integration on Axiom. Copy the Axiom integration token. On Netlify, for your chosen site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select Axiom as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, paste the Integration token copied from Axiom. Confirm with Connect. For an overview of reviewing your logs on Axiom, check out Axiom's Netlify Integration docs.Azure MonitorSection titled “Azure Monitor”To send your site's log drains to Azure Monitor through the Netlify Azure Monitor, from your log analytics workspace, go to Settings > Agents. Under the Log Analytics Agent Instructions dropdown, you'll find the Workspace ID and Primary key you'll need to enter into the Netlify UI. On Netlify, for your chosen site, go to Logs & Metrics > Log Drains. If this is your first log drain for your site, select Enable a log drain. Select Azure as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, enter your Azure Workspace ID and Primary key. Confirm with Connect. For an overview of reviewing your logs on Azure, check out Azure's Analytics workspace docs.Sumo LogicSection titled “Sumo Logic”To configure a log drain that sends logs to your Sumo Logic account, you need your HTTP Logs and Metrics Source in Sumo Logic Set up the log drain in the Netlify UI Configure your HTTP Logs and Metrics Source in Sumo LogicSection titled “Configure your HTTP Logs and Metrics Source in Sumo Logic” If you haven't already, create a hosted collector to collect your data in Sumo Logic. In the Sumo Logic web app, add and configure your HTTP Logs and Metrics Source using Sumo Logic's docs. Ensure that you copy your HTTP Source Address to use in the Netlify UI. Set up the log drain in the Netlify UISection titled “Set up the log drain in the Netlify UI”For security, Netlify hides the full HTTP Source Address in the Netlify UI. After you configure your log drain, only the base URL is visible in the Netlify UI. On Netlify, for your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select Sumo Logic as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, fill in the Full URL field using the HTTP Source Address you copied from Sumo Logic. Select Connect. Splunk Observability CloudSection titled “Splunk Observability Cloud” For your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select Splunk Observability Cloud as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, enter the Realm from your Splunk Observability Cloud profile. Enter the Access Token from your Splunk Observability Cloud settings. Select Connect. LogflareSection titled “Logflare” For your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select Logflare as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, enter your Logflare Ingest API key. To specify where you want your logs to go, enter the Logflare Source ID for your logs. Select Connect. Amazon S3Section titled “Amazon S3”To configure a log drain that sends logs to your Amazon S3 account as Gzip-compressed files, you need an Amazon S3 bucket and set up a bucket policy Configure the log drain in the Netlify UI Create an Amazon S3 bucket and set up a bucket policySection titled “Create an Amazon S3 bucket and set up a bucket policy” In the AWS Management Console, create an S3 bucket. Object Ownership for the bucket should be set to either Bucket owner enforced or Bucket owner preferred. Make note of the bucket name to use in your Netlify configuration. Go to your bucket's Permissions and under Bucket policy select Edit. Copy and paste the following bucket policy, replacing YOUR_BUCKET_NAME with the name of your Amazon S3 { \"Version\": \"2012-10-17\", \"Statement\": [ { \"Sid\": \"NetlifyLogDrains\", \"Effect\": \"Allow\", \"Principal\": { \"AWS\": \"arn:aws:iam::128866310339:role/log-shipper\" }, \"Action\": \"s3:PutObject\", \"Resource\": \"arn:aws:s3:::YOUR_BUCKET_NAME/*\", \"Condition\": { \"StringEquals\": { \"s3:x-amz-acl\": \"bucket-owner-full-control\" } } } ]} Select Save Changes. Bucket lifecycle For cost control reasons, we recommend deleting logs after a period of 90 days. You can configure your Amazon S3 bucket to delete logs automatically by setting lifecycle rules. Configure the log drain in the Netlify UISection titled “Configure the log drain in the Netlify UI” For your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select Amazon S3 as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, select the Bucket region where your bucket is located. Enter your S3 Bucket name. Enter your S3 Bucket path. We recommend using YOUR_BUCKET_NAME/logs/netlify/. Select Verify bucket and connect. Use the provided path to navigate to your S3 bucket's verification file. Copy and paste the contents of the file into the Verification token field, then select Verify. General HTTP endpointSection titled “General HTTP endpoint”Netlify's General HTTP endpoint support allows you to set up a custom log drain with any external monitoring provider that accepts log drain requests in JSON or NDJSON format.To set up a custom log drain, you must provide a full URL of your external monitoring provider's endpoint. Depending on your external monitoring provider, you can enter your API key as a query parameter in your endpoint or you can enter an Authorization header in the Netlify UI.For example, this URL includes an API key and a tag as query ://YOUR_ENDPOINT_RESOURCE_PATH?api-key=YOUR_API_KEY&environment=productionFor security, Netlify hides the full endpoint in the Netlify UI. After you configure your log drain, only the base URL is visible in the Netlify UI. For your selected site, go to Logs & Metrics > Log Drains and select Enable a log drain. Select General HTTP endpoint as the Log drain service. Select the Log types to drain. You can drain your site's traffic logs, function logs, edge function logs, and deploy logs. Traffic log filtering. If you're draining traffic logs and don't want client_ip and user_agent in the data, select Exclude personally identifiable information (PII). Under Service settings, enter the Full URL for your endpoint, including any optional tags as query parameters. Depending on your external monitoring provider, enter your API key as a query parameter in your endpoint or under Authorization header. Select the Log Drain Format that your endpoint accepts. Select Connect. Edit a log drainSection titled “Edit a log drain” If you need to adjust the settings for an existing log drain, under Logs & Metrics > Log Drains, select Configure. Configuration changes become active within approximately five minutes. To stop sending specific log data to your external monitoring provider, clear the Log types you no longer need and then save your change. Remove a log drainSection titled “Remove a log drain” To terminate an existing log drain configuration for a site, under Logs & Metrics > Log Drains, select Delete. All log types associated with the site's log drain will be removed. Saved logs are accessible in your logging service provider account. Traffic log outputSection titled “Traffic log output” Drained site traffic logs include the following fields parsed from our CDN : ID of the Netlify team that the site belongs to. address of the client. Omitted if you selected Exclude personally identifiable information (PII). of the request (for example, text/html). of origin for the request, formatted as an ISO 3166-1 two-letter code. of the deploy (for example, 61153ae8b0f6a900088386e8). of processing the request and sending the response, in milliseconds. Firewall traffic rule that matches the request. Can be one of default_allow, default_deny, ip_allow, ip_deny, geo_allow, geo_deny , or -. If there are no traffic rules added to a site, then firewall_rule returns -. Learn more about Firewall traffic rules. why the request was blocked. If there are rate limiting rules applied to the site and if the rules match the request, then block_reason returns rate_limit. Learn more about Rate limiting Rules. : ID of the rate limiting rule the request matched. Learn more about Rate limiting Rules. [Deprecated] of the rate limiting rule the request matched. This field is being deprecated and will disappear in a future release, use rate_limit.rule_id instead. the type of log. The value is traffic. method. on the request. request ID (for example, 01FDWR77JMF2DA1CHF5YA6H07C). of the request in bytes. of the response in bytes. of the site. code of the HTTP response. of the request, formatted with RFC 3339 (for example, :34.831Z). of the request. that made the request. Omitted if you selected Exclude personally identifiable information (PII). : indicates the outcome of the request evaluated by Web Application Firewall (WAF). Can be one of passive, blocked, under threshold, or no match. When WAF is enabled in passive mode and a request matches a WAF rule, the outcome is passive. When WAF is enabled in blocking mode and a request matches enough WAF rules to surpass the anomaly threshold, then the outcome is blocked. Otherwise, the outcome is under threshold. When WAF is enabled in passive or blocking mode, and a request does not match any enabled WAF rules, the outcome is no match. of the matched Web Application Firewall rule. of the WAF policy applied to the evaluated request. The WAF policy represents all enabled WAF rules or rulesets and any additional configuration, such as excluded paths or whether the passive or blocked mode are enabled. of the ruleset applied to the evaluated request. Function log outputSection titled “Function log output” Drained function logs include the following fields parsed from our CDN : ID of the Netlify team that the function belongs to. branch of the deploy. of the deploy (for example, 61153ae8b0f6a900088386e8). of time it took for AWS Lambda to execute the function. of the function. of function (for example, regular for a synchronous function or background for a background function). Note this value may be standard for functions deployed before November 5, 2024, independent of the underlying type. of the log line (for example, INFO, ERROR, WARN, REPORT). message. indicating the type of log. All function types will have the value functions. of the request (for example, GET). of the request (for example, /.netlify/functions/your-awesome-function). request ID (for example, 01FDWR77JMF2DA1CHF5YA6H07C). of the site. code of the HTTP response. of the request, formatted with RFC 3339 (for example, :34.831Z). Function log output limitationsSection titled “Function log output limitations” Netlify's Log Drains feature doesn't currently support function log output for Background Functions. We recommend storing historical logs for this type of function on an external service. Function log output is limited to 4 KB total per invocation. If a log's output exceeds 4 KB, only the last 4 KB of the log is sent to the logging service and the log message will be truncated. Edge Function log outputSection titled “Edge Function log output” Drained edge function logs include the following fields parsed from our CDN : ID of the Netlify team that the edge function belongs to. of the branch. This field is only present for non-production branches. of the deploy (for example, 61153ae8b0f6a900088386e8). of the edge function. of function. The value for edge function logs is edge. of the log line (for example, INFO, ERROR, WARN, REPORT). indicating the type of log. All function types, including edge functions, will have the value functions. request ID (for example, 01FDWR77JMF2DA1CHF5YA6H07C). of the request (for example, /log). of the site. of the request, formatted with RFC 3339 (for example, :34.831Z). Log messages will appear in the content field for your logging service. Deploy log outputSection titled “Deploy log output” Drained deploy logs include the following fields parsed from our internal build : ID of the Netlify team that the deploy belongs to. of the deploy (for example, 61153ae8b0f6a900088386e8). of the deploy process (for example, Initializing, Building, Deploying, Cleanup, Post-Processing). of the log line (for example, INFO, ERROR, WARN, REPORT). indicating the type of log. The value is deploys. message. of the site. of the log line, formatted with RFC 3339 (for example, :34.831Z). WAF log outputSection titled “WAF log output” Drained WAF logs include the following : ID of the site. of the deploy (for example, 61153ae8b0f6a900088386e8). of the Netlify team that the site belongs to. of the evaluated WAF policy, which defines the WAF rules to be evaluated. of the request in Unix epoch nanosecond format (for example, 1725353586606141655). : indicates the final action taken for the request, can be one of LOG or BLOCK. : Netlify request ID (for example, 01FDWR77JMF2DA1CHF5YA6H07C). method. HTTP protocol, can be one of HTTPS or HTTP. of the request. IP used to create the connection to Netlify. Omitted if you selected Exclude personally identifiable information (PII). of the original client if the request originates from a known source (such as Cloudfront). In those cases, the connection_ip will refer to the known source's outgoing IP, and client_ip refers to the request handled by known source. If the request does not come from a known source, client_ip and connection_ip are the same. Omitted if you selected Exclude personally identifiable information (PII). : full name of the country of origin for the request. of the request in bytes. : HTTP status of the response (for example, 200). of the response in bytes. with information about each ruleset evaluated for the request. Each item on the list has the following : ID of the ruleset (for now always crs-basic). of the ruleset (for example, v1.0.0). how the ruleset was evaluated, can be one of passive or block. the outcome of the request evaluated by Web Application Firewall (WAF). Can be one of under_threshold, blocked, passive or no_match. When the request's calculated score was lower than the threshold needed to trigger the set action, the outcome is under_threshold, and no block was applied. When the request was blocked because it was over the anomaly threshold, the outcome is blocked. When the request is over the anomaly threshold but the ruleset is set to passive mode, the outcome is passive. When the request matched no rules, the outcome is no_match. anomaly score calculated for the overall request. anomaly threshold set for the overall request. anomaly score calculated for each rule category of the evaluated request. anomaly threshold set for each rule category (only set if defined by the user). with information about the rules that matched for this ruleset. Each item on the list has the following : ID of the rule. of labels for the matched rule, obtained from the CRS definition (for example, [\"platform-multi\", \"attack-protocol\", \"paranoia-level/1\"]). with information about the rule matching logic and the input provided from the request. Each item on the list has the following : type of the matcher being used on the rule, each one matching on a different type of input. Can be one of header (a single HEADER-VALUE pair), cookie (full value of the cookie header of the request), path (request path), method (request method), query (decoded request query), protocol (request protocol), uri (decoded request URI), uri_raw (encoded request URI), header_names (names of the request headers), cookie_names (names of cookies - the key on each key-value pair), query_string (encoded request query), query_names (names of the request query - the key on each key-value pair) or request_line (HTTP plaintext representation of the request line, for example GET /background.png HTTP/1.0.) representation of the rule matcher being evaluated (for example, KEY Host, VALUE EQUALS 0). value matched for this rule matcher. there was an error evaluating the rule (only set if an error occurred). Last 16, 2025 PreviousLighthouseNextLogs Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n{  \"Version\": \"2012-10-17\",  \"Statement\": [    {      \"Sid\": \"NetlifyLogDrains\",      \"Effect\": \"Allow\",      \"Principal\": {        \"AWS\": \"arn:aws:iam::128866310339:role/log-shipper\"      },      \"Action\": \"s3:PutObject\",      \"Resource\": \"arn:aws:s3:::YOUR_BUCKET_NAME/*\",      \"Condition\": {        \"StringEquals\": {          \"s3:x-amz-acl\": \"bucket-owner-full-control\"        }      }    }  ]}\n```\n\nExample:\n```text\nhttp://YOUR_ENDPOINT_RESOURCE_PATH?api-key=YOUR_API_KEY&environment=production\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.335Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":13,"estimatedTokens":6231}}148{"id":"doc-troubleshoot_visual_editor_netlify_docs-024755ff","source":"documentation","title":"Troubleshoot Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/troubleshoot/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Cannot find my site Missing site from visual editor dashboard Missing site from app.netlify.com Development server is stuck Site preview doesn’t load Restart to fix temporary issues Address unique configuration options Audit security headers Origin sensitivity Content source connection errors Environment variables Application connections More resources On this page Overview Cannot find my site Missing site from visual editor dashboard Missing site from app.netlify.com Development server is stuck Site preview doesn’t load Restart to fix temporary issues Address unique configuration options Audit security headers Origin sensitivity Content source connection errors Environment variables Application connections More resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending /projects/?visual_editor=true. Development server is stuckSection titled “Development server is stuck” Just as when you're working locally, there are a number of factors that may result in needing to restart your development server. If you run into an issue in which Visual Editor or your website isn’t behaving as you’d expect, try this series of your be fastest option and often resolves minor issues. Restart visual editor fastest option. Usually takes about as long as it does to boot your local development server. From your site workspace in the visual editor, select the options icon next to your site name to find this option. From your Site overview, go to Project configuration > Visual Editor > General. Then select Restart visual editor and Restart visual editor preview. Restart visual editor you still haven’t cleared the issue, choose the Restart visual editor container option. This restarts the entire editing experience, which usually takes a few minutes to complete. From your site workspace in the visual editor, select the options icon next to your site name to find this option. From your Site overview, go to Project configuration > Visual Editor > General. Then select Restart visual editor to find this option. If you’re still having trouble after following these steps, you can contact us. Site preview doesn’t loadSection titled “Site preview doesn’t load” There could be a number of reasons why your preview isn't working properly. The subsections below outline the most common solutions. If these don't solve your issue, contact support. Restart to fix temporary issuesSection titled “Restart to fix temporary issues” If the preview was previously working but is experiencing issues, try restarting the server. In local development, restart your framework server and the stackbit dev server. Otherwise, choose the Restart visual editor preview option in the Netlify your site workspace in the visual editor, select the options icon next to your site name to find this option. From your Site overview, go to Project configuration > Visual Editor > General. Then select Restart visual editor and Restart visual editor preview. If you can’t find this option, confirm you have the Developer or Owner role and permissions. If you’re still having trouble after following these steps, you can contact us. Address unique configuration optionsSection titled “Address unique configuration options” Some frameworks require additional configuration options specific to that framework. Read the appropriate framework guide for required configuration for that framework. Audit security headersSection titled “Audit security headers” Visual Editor attempts to remove headers that block a site from loading in an iframe, which is how the preview is presented in Visual Editor. In some cases, a header may be blocking Visual Editor from loading your site in the preview iframe. Open the console to identify the blocking header and, if possible, adjust. Be sure to only apply changes in development. If you can't identify the header or are not able to make this change, contact us so we can work together on a resolution. Origin sensitivitySection titled “Origin sensitivity” Your development server is accessed through a proxy in our application. Some development server configurations expect a specific origin or have other rules in place that Visual Editor application is not expecting. This is typically caught and handled automatically, with the help of the ssgName configuration property. If you believe this to be the issue, please contact us. We'll help resolve and put further checks in place to help other users. Content source connection errorsSection titled “Content source connection errors” When you are seeing an issue with content not loading or have received an error about connection issues with the CMS source, there are a few troubleshooting methods you can try. Environment variablesSection titled “Environment variables” When using the contentSources property to configure your content source, you are often required to use environment variables. Check environment variables you’re specifying in the code resolve to the expected value. You’re using all required variables and options for that particular content source. You can refer to the configuration guide within the appropriate integration section for a reference on how to configure that particular source. To add, remove, or optionally to edit environment variables using the Netlify your Site overview, go to Project configuration > Visual Editor > Environment variables. Note you must have the Developer or Owner role to access these settings. Add, remove, or edit your variables. You can lock a variable to prevent others with access from changing the variable. To confirm, select Save and restart. The visual editor container will automatically restart. This can take a few minutes. Custom sourcesSection titled “Custom sources” If using a custom or experimental content source, contact support with details if you are having connection issues. Application connectionsSection titled “Application connections” Working with an external content source requires that you establish an authentication connection to be able to edit content. You can confirm that the connection is established in your account settings. Mismatched usersSection titled “Mismatched users” Some external content providers require that the writable API key match to the user account that is connected via Visual Editor. If there is a possibility these are mismatched, disconnect and reconnect the account. More resourcesSection titled “More resources” If you have additional concerns that aren’t answered in this doc, you can visit our Forums to find more information in our verified Support Guides and ask questions. Last 16, 2026 PreviousStatus labelsNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.337Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2298}}149{"id":"doc-customize_project_name_and_cover_image_netlify_d-fa78c5dd","source":"documentation","title":"Customize project name and cover image | Netlify Docs","url":"https://docs.netlify.com/manage/projects/customize-project-name-and-cover-image/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Projects Projects How projects work Customize project name & image Find a project Organize projects Add new project Update project with Agent Runners Connect project to repo Monitor project activity Transfer a project Disable project Resume paused projects On this page Overview Customize project name Customize a cover image for your project On this page Overview Customize project name Customize a cover image for your project For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Projects / Customize project name and cover image Copy page View as Markdown Copy as Markdown View as Markdown Netlify autogenerates a name for your project when you first deploy. You can customize the project name and cover image on the Netlify dashboard to ease your project management and help you find your project. Customize project nameSection titled “Customize project name” To customize a project to your Project Overview dashboard, and select Customize, then choose Manage project name and cover image. Choose a meaningful name for your project. The project name determines the default URL for your project. For example, if your project name is pear-product-docs, then your Netlify default URL for your project will be https://pear-product-docs.netlify.app unless your team has customized subdomains enabled. Customize a cover image for your projectSection titled “Customize a cover image for your project” When you customize a cover image for your project, you're choosing how others will find your project in the Netlify dashboard. You can upload a custom image or Netlify can take a snapshot of your project and use it as a cover image. To customize a default image for your to your Project Overview dashboard, and select Customize, then choose Manage project name and cover image. Choose whether to upload an image or let Netlify upload an automatic snapshot of your project for you. Last 9, 2026 PreviousHow projects workNextFind a project Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.339Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":870}}150{"id":"doc-transfer_a_project_netlify_docs-374ca7de","source":"documentation","title":"Transfer a project | Netlify Docs","url":"https://docs.netlify.com/manage/projects/transfer-project/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Projects Projects How projects work Customize project name & image Find a project Organize projects Add new project Update project with Agent Runners Connect project to repo Monitor project activity Transfer a project Disable project Resume paused projects On this page Overview How transfers work Transfer a project Block transferring a project On this page Overview How transfers work Transfer a project Block transferring a project For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Projects / Transfer a project Copy page View as Markdown Copy as Markdown View as Markdown As a Team Owner, you can transfer a project to another team if team transfers are allowed and you are also an Owner or Developer on the team you are transferring to. How transfers workSection titled “How transfers work” Before transferring a project, consider the members who are not members of the destination team will lose access to the Netlify dashboard for the project. You may want to invite them to the team before transferring. Some features and settings are restricted to specific plans. If the destination team is on a lower plan than the originating team, you will lose any settings you may have entered for the features you lose. Check the current plan for each team and compare their features and pricing. Sites linked to GitHub Enterprise server or GitLab self-managed repositories rely on a team-level connection to your instance, and require special handling for transfer. If you need to transfer a site that’s linked to a GitHub Enterprise server or GitLab self-managed repo, contact support for assistance. Legacy Global sites use a dedicated CDN, and require special handling for transfer. If you’re considering canceling a Global site plan or transferring a Global site to a team, contact support so we can guide you through the process and avoid any interruptions in service. To transfer projects between teams with no shared Owners or Developers, please contact support. Transfer a projectSection titled “Transfer a project” Warning Transferring a project between teams may affect project members, features, or pricing. This varies depending on the current project configuration and the plans of the teams you’re transferring between, so be sure to read the in-app warnings carefully. As a Team Owner, to transfer a you understand the impact of transferring a project. Check out how projects work. Go to Project configuration > General > Project information. Select Transfer project. You may also choose to create a new team from this menu. Block transferring a projectSection titled “Block transferring a project” Team Owners can prevent every project owned by the team from being transferred out, regardless of individual member permissions. This is useful when you want to guarantee that projects stay within the team, for example to meet compliance or ownership requirements. To change the setting, go to Team settings > Access & security > Transfer site settings and select Edit settings. Choose whether you want to block or allow transferring (default). Team members with the required permissions can transfer projects to other teams. Blocked. No member of the team can transfer a project to another team, even Team Owners. The Transfer project action is hidden from the UI for every project owned by the team, and the backend rejects transfer requests for those projects. Enterprise teams start with Site transfers set to Blocked for security reasons, but Team Owners can change it to Allowed at any time. Only Team Owners can change this setting. Other roles see the card in read-only mode. Changes are recorded in the team audit log. The setting only affects transfers out of the team. Incoming transfers from other teams are not blocked by this setting. If you need to move a project out of a team while transfers are blocked, change the setting back to Allowed before starting the transfer. Last 9, 2026 PreviousMonitor project activityNextDisable project Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.339Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1378}}151{"id":"doc-organize_projects_netlify_docs-371382e5","source":"documentation","title":"Organize projects | Netlify Docs","url":"https://docs.netlify.com/manage/projects/organize-projects/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Projects Projects How projects work Customize project name & image Find a project Organize projects Add new project Update project with Agent Runners Connect project to repo Monitor project activity Transfer a project Disable project Resume paused projects On this page Overview Assign a label to a project Pin a favorite project Create and manage labels for your project Create project labels On this page Overview Assign a label to a project Pin a favorite project Create and manage labels for your project Create project labels For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Projects / Organize projects Copy page View as Markdown Copy as Markdown View as Markdown Learn ways to organize projects in your Netlify dashboard by assigning labels or pinning your favorite projects. Pro tip Give your projects meaningful names to make them easier to find. Learn more in our docs on customizing your project name. Assign a label to a projectSection titled “Assign a label to a project” This feature is available on the credit-based Pro plan and on Enterprise plans. Anyone with access to a project can assign a label to it but only Team Owners can create and edit labels. To assign a label to your your project overview dashboard, under your project URL, select the project label icon. Select the labels drop-down menu to choose a label for your project and confirm. The labels you assign to a project will appear for everyone with access to your project. Pin a favorite projectSection titled “Pin a favorite project” To keep a favorite project pinned to the top of your projects list, you can star or pin a project by selecting the star icon in your project list. This project will appear at the top of your project list in your Netlify dashboard. It will not appear at the top of the project list for others on your team. Create and manage labels for your projectSection titled “Create and manage labels for your project” This feature is available on the credit-based Pro plan and on Enterprise plans. As a Team Owner, you can organize projects across the team by creating custom labels and assigning them to your projects. This allows you to group projects for your needs. For example, you may want to create labels to group projects by the following use marketing staging sandbox production sites You can also group projects by bandwidth usage or internal teams. Create project labelsSection titled “Create project labels” As a Team Owner, to create (or edit) labels for your your team overview dashboard, go to Team settings > Site labels. To create new labels, select Add label and fill in the desired details. To edit an existing label, select an existing label to make changes. Last 12, 2026 PreviousFind a projectNextAdd new project Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.340Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1072}}152{"id":"doc-connect_a_project_to_a_git_repository_netlify_do-10455ada","source":"documentation","title":"Connect a project to a Git repository | Netlify Docs","url":"https://docs.netlify.com/manage/projects/connect-project-to-repo/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Projects Projects How projects work Customize project name & image Find a project Organize projects Add new project Update project with Agent Runners Connect project to repo Monitor project activity Transfer a project Disable project Resume paused projects On this page Overview Git-based workflows Ways to connect a project to a repo On this page Overview Git-based workflows Ways to connect a project to a repo For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Projects / Connect a project to a Git repository Copy page View as Markdown Copy as Markdown View as Markdown Learn different ways to connect a project to a Git repository (repo) hosted on a Git hosting provider, such as GitHub, GitLab, and more. Note this is an optional workflow for managing and publishing your project on Netlify. Git-based workflowsSection titled “Git-based workflows” When you connect your project to a GitHub repository, changes are synced between the GitHub repository and the Netlify dashboard. When your team prompts changes to your project using Agent Runners and publishes these updates, they are committed to the production branch of your GitHub repository. This workflow also allows Developers to review changes before publishing. This gives your team a way to collaborate cross-functionally without requiring everyone to have GitHub access or expertise. Ways to connect a project to a repoSection titled “Ways to connect a project to a repo” Learn more about connecting a project to a Git an existing repo to Netlify Create a new repo from a project on Netlify Git workflows overview on Netlify Last 9, 2026 PreviousUpdate project with Agent RunnersNextMonitor project activity Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.340Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":804}}153{"id":"doc-how_projects_work_netlify_docs-2c8a4f10","source":"documentation","title":"How projects work | Netlify Docs","url":"https://docs.netlify.com/manage/projects/how-projects-work/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Projects Projects How projects work Customize project name & image Find a project Organize projects Add new project Update project with Agent Runners Connect project to repo Monitor project activity Transfer a project Disable project Resume paused projects On this page Overview Understand project basics Your project name and your URL Managing versions of your project Learn more On this page Overview Understand project basics Your project name and your URL Managing versions of your project Learn more For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Projects / How projects work Copy page View as Markdown Copy as Markdown View as Markdown Whether you're new to Netlify or setting up your team, learn the basics of how projects work to help you manage your projects, access, and workflows. Understand project basicsSection titled “Understand project basics” Netlify organizes your work into three workspaces (available for Enterprise plans) Team workspaces (available on all plans, including Free and Personal plans) Projects (Your sites or apps) Your project name and your URLSection titled “Your project name and your URL” Every project gets a default Netlify URL based on the project ://your-project-name.netlify.app To change your project name, check out Customize project name. If you rename your project, the default URL changes to match. You can also connect a custom domain (like yoursite.com) so visitors don't see the .netlify.app address. Learn more about custom domains. Managing versions of your projectSection titled “Managing versions of your project” A \"deploy\" is a version of your project built on Netlify's infrastructure. You can have multiple deploys or versions of your project but only one live production version available at the production URL. This production URL can be the default Netlify URL that ends in netlify.app or it can be a custom domain you add to your project. Netlify supports two main types of deploys or versions of your deploys - uses settings for the production version of your project Deploy Previews - uses settings for your project's previews Netlify also supports branch deploys, which is another version of your project based on a Git repository branch. Branch deploys are less commonly used and require a connected Git repository and must be enabled for your project. Learn more about branch deploys. Learn more about the basics of deploys. Learn moreSection titled “Learn more” Understand version control Manage deploys Last 2, 2026 PreviousNotificationsNextCustomize project name & image Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nhttps://your-project-name.netlify.app\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.341Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":1038}}154{"id":"doc-why_netlify_dns_netlify_docs-a8d8ec25","source":"documentation","title":"Why Netlify DNS | Netlify Docs","url":"https://docs.netlify.com/manage/domains/why-netlify-dns/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Netlify DNS domain support Netlify DNS key benefits External DNS key benefits Further learning On this page Overview Netlify DNS domain support Netlify DNS key benefits External DNS key benefits Further learning For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Why Netlify DNS Copy page View as Markdown Copy as Markdown View as Markdown Netlify DNS offers advanced subdomain automation and deployment features and ensures that your site uses our CDN for the apex domain as well as subdomains like www. Netlify DNS domain supportSection titled “Netlify DNS domain support” You can delegate many different types of domains to Netlify DNS, including apex domains or subdomains, which include stand-alone subdomains. For example, you can delegate a subdomain to Netlify DNS without the need to bring your apex domain to Netlify DNS. So you can delegate just docs.company.com to Netlify without bringing over company.com too. Learn more about stand-alone subdomain support. Netlify DNS key benefitsSection titled “Netlify DNS key benefits” Besides the convenience of managing your domains along with your site and app hosting, Netlify DNS offers the following SSL your repo has multiple branches all serving different content, you can have a subdomain for every single branch in your repo, and a wildcard SSL certificate will cover them all. This will happen automatically, with one click. Branch DNS allows you to set up branch deploys for each branch in your repo, which can serve as an ongoing staging environment for each branch or alternative version of your site. Standalone DNS allows you to have standalone subdomains for each branch in your repo so you can delegate docs.company.com to Netlify DNS and keep company.com delegated to another DNS provider. Custom subdomains for preview URLs (also called Automatic deploy subdomains): Netlify DNS allows you to customize subdomains for all Deploy Previews and/or for all branch deploys so you can unify your site's URLs across all branches and share deploy-preview-42.company.com instead of deploy-preview-42--mysitename.netlify.app. This ensures deploys can be \"trusted\" and in the \"allowed domain list\" for any third-party scripts or services that require this. This also allows you to use third-party services the way you do for your production site, such as auth flow services that rely on a custom domain. External DNS key benefitsSection titled “External DNS key benefits” Netlify does not allow inbound DNS zone transfers. If you have a lot of existing DNS records, it's simplest and safest to use an external DNS provider. Further learningSection titled “Further learning” \"Official Support can I receive emails on my domain?\" Last 24, 2026 PreviousSet up Netlify DNSNextTroubleshooting tips Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.341Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1278}}155{"id":"doc-disable_project_netlify_docs-d688732c","source":"documentation","title":"Disable project | Netlify Docs","url":"https://docs.netlify.com/manage/projects/disable-project/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Projects Projects How projects work Customize project name & image Find a project Organize projects Add new project Update project with Agent Runners Connect project to repo Monitor project activity Transfer a project Disable project Resume paused projects On this page Overview Disable a project Enable a project (resume a project) On this page Overview Disable a project Enable a project (resume a project) For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Projects / Disable project Copy page View as Markdown Copy as Markdown View as Markdown Netlify allows you to disable your projects to take them offline while keeping your existing configuration. This is also an effective way to stop consuming resources like build minutes, functions or bandwidth. Note that you cannot disable a project if the project is a public extension as this would break other projects using that extension. Disable a projectSection titled “Disable a project” As an Owner, to disable a to Project configuration > General > Danger zone and select Disable project. Enable a project (resume a project)Section titled “Enable a project (resume a project)” You can enable a project at any time. As an Owner, to enable a to Project configuration > General > Danger zone and select Enable project. Last 9, 2026 PreviousTransfer a projectNextResume paused projects Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.342Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":721}}156{"id":"doc-add_a_domain_alias_netlify_docs-dcbb3880","source":"documentation","title":"Add a domain alias | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/add-a-domain-alias/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / Add a domain alias Copy page View as Markdown Copy as Markdown View as Markdown Ensure your site is available at all the expected domains by assigning multiple custom domains to your production site as domain aliases. You can assign multiple custom domains to the same production site. When you do this, one is designated as the primary domain, and all others are called domain aliases. We recommend assigning no more than 50 domain aliases to a site. To add a domain your site, go to your site configuration settings under Domain management > Production domains. Select Add domain alias, and follow the prompts to assign the domain to your site. Optionally, to change a domain alias to the primary domain, select the Options button next to the domain, then select Set as primary domain. Last 25, 2025 PreviousLock your domainNextBring a domain to Netlify Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.343Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":826}}157{"id":"doc-lock_your_domain_netlify_docs-5dccf1f7","source":"documentation","title":"Lock your domain | Netlify Docs","url":"https://docs.netlify.com/manage/domains/lock-your-domain/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview What domain locking prevents Lock or unlock your domain On this page Overview What domain locking prevents Lock or unlock your domain For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Lock your domain Copy page View as Markdown Copy as Markdown View as Markdown You can secure your domain and prevent domain takeovers and unauthorized domain or DNS changes by locking your domain. What domain locking preventsSection titled “What domain locking prevents” Once your domain is locked, other accounts on Netlify cannot do the your domain as a custom domain or subdomain for their project add your domain as a domain alias create a DNS zone for your domain create a subdomain using your domain for a custom URL for Deploy Previews or branch deploys. This ensures that your domain does not get accidentally or intentionally taken over. The Netlify Team Owner retains full domain management capabilities, but cannot unlock the domain without reaching out to Support. Lock or unlock your domainSection titled “Lock or unlock your domain” To lock or unlock your domain, reach out to Netlify Support. Last 26, 2026 PreviousTroubleshooting tipsNextAdd a domain alias Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.343Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":879}}158{"id":"doc-dns_https_troubleshooting_tips_netlify_docs-7c811055","source":"documentation","title":"DNS & HTTPS troubleshooting tips | Netlify Docs","url":"https://docs.netlify.com/manage/domains/troubleshooting-tips/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview DNS configuration Inactive Netlify DNS zone Custom certificate not working for automatic deploy subdomain Certificates and HTTPS HTTPS error messages On this page Overview DNS configuration Inactive Netlify DNS zone Custom certificate not working for automatic deploy subdomain Certificates and HTTPS HTTPS error messages For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / DNS & HTTPS troubleshooting tips Copy page View as Markdown Copy as Markdown View as Markdown If you’re having trouble accessing your site at your custom domain or branch subdomain, there is likely a problem with your DNS or HTTPS setup. This page includes tips and information to help get things working properly. DNS configurationSection titled “DNS configuration” The dig command line tool is a great tool for quickly diagnosing and understanding DNS responses. It is built into Linux and Mac, but can also be installed on Windows. Alternatively, you can use an online tool to run dig in the browser. NS1, the DNS provider backing Netlify DNS, has a great series of articles on using DIG to test and troubleshoot your DNS configuration. Inactive Netlify DNS zoneSection titled “Inactive Netlify DNS zone” A common DNS configuration issue is an inactive Netlify DNS zone. This prevents our service from creating or updating the automatic Let’s Encrypt SSL certificates for your custom domain. This can cause problems for branch subdomains. For more information, visit our Forums for a verified Support Guide on how to detect and fix inactive Netlify DNS zones. Custom certificate not working for automatic deploy subdomainSection titled “Custom certificate not working for automatic deploy subdomain” If a custom certificate is not working for your automatic deploy subdomain, ensure your certificate includes any new subdomains used for automatic deploy subdomains. For example, for the automatic deploy subdomain early-access.company.com , your custom certificate should include the domains *.company.com, *.early-access.company.com and not just *.company.com. Learn more about custom certificates and automatic deploys subdomains. Certificates and HTTPSSection titled “Certificates and HTTPS” There are many reasons why adding a Netlify certificate or uploading a custom certificate might not work. The common causes are listed below, but if they don’t seem to apply to you or you have additional questions, our Support team will be happy to help out! Most importantly, you’ll need to configure the DNS for the custom domain before Netlify can issue a certificate for you. Netlify must validate the domain in order to provision the certificate, and this step cannot be completed until the DNS records for your custom domain are pointing to our servers. All previous DNS settings must have their cache timeouts expired. The TTL setting on a DNS record determines how long the record may be cached. This cache must expire before your new DNS settings can be validated for certificate provisioning. If your site is configured to go through another service (for example, using Cloudflare “accelerate and protect”, or similar), you need to disable that routing before we can provision the certificate. Netlify must handle TLS termination to be able to provision a certificate. It is possible that the name servers we use have some old cached values for your domain name. You can attempt to accelerate cache expiration for your domains using the Flush Cache tool provided by Google Public DNS. It is possible that we will get a certificate for one name (for example, petsofnetlify.com) and not for another (for example, www.petsofnetlify.com or some domain alias). In this case selecting Renew certificate should resolve the issue. If it doesn’t, please post in the Netlify Support Forums so our support engineers can repair the certificate. HTTPS error messagesSection titled “HTTPS error messages” You can check the status of your certificate in Domain management > HTTPS. If there is a problem with the certificate, you may find one of the error messages below. (We’re using petsofnetlify.com as an example.) “petsofnetlify.com doesn’t appear to be served by Netlify”Section titled ““petsofnetlify.com doesn’t appear to be served by Netlify”” In order to make sure that the site is served by Netlify, check the HTTP response headers. Examine the HTTP response headers in your browser’s dev tools, using an online checker, or with the following terminal -s -v http://your-newly-configured-hostname.com 2>&1 | grep -i server Check for a line that says Repeat this for each domain connected to your site. If your custom domain is the apex domain or www subdomain (for example, petsofnetlify.com or www.petsofnetlify.com), we automatically serve your site and provision a certificate for both domains, so be sure they both have records pointing to Netlify. The next steps depend on what you find in the HTTP response headers. If you do find in all response headers, but still receive this error, it may be caused by incorrect A records. For information on setting a proper A record with Netlify, refer to our documentation on external DNS configuration. If you don’t find in all response headers, and you’ve eliminated the common problem sources listed above, please contact support. “petsofnetlify.com is not resolvable with a resolver that validates DNSSEC”Section titled ““petsofnetlify.com is not resolvable with a resolver that validates DNSSEC”” Netlify DNS doesn’t support DNSSEC. To use Netlify DNS, disable DNSSEC with your domain registrar or previous DNS host. You can use tools like DNSViz to figure out where DNSSEC is currently enabled. To keep DNSSEC enabled, you can stop using Netlify DNS and use external DNS instead. Last 14, 2025 PreviousWhy Netlify DNSNextLock your domain Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\ncurl -s -v http://your-newly-configured-hostname.com 2>&1 | grep -i server\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.345Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":2055}}159{"id":"doc-netlify_name_servers_netlify_docs-a66755f9","source":"documentation","title":"Netlify name servers | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/netlify-name-servers/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / Netlify name servers Copy page View as Markdown Copy as Markdown View as Markdown Netlify’s name servers will vary depending on your domain. Learn how to find your name servers. To get a list of available name servers for your domain, you must first add a domain to your site or team. Next you can find Netlify’s available name servers for that domain in the Netlify domains dashboard. Go to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. Select the specific domain you want to set up name servers for. From your domain dashboard, under Name servers, you’ll find a list of available name servers for your domain in a format simliar to dns1.p01.nsone.net. Last 15, 2025 PreviousEnable IPv6NextRegister and buy a domain Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.346Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":818}}160{"id":"doc-enable_ipv6_netlify_docs-3fc8b6e0","source":"documentation","title":"Enable IPv6 | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/enable-ipv6/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / Enable IPv6 Copy page View as Markdown Copy as Markdown View as Markdown Enable IPv6 for your site or app to use the newer IP protocol, which has a range of benefits over the older IPv4 protocol. IPv6 is a newer protocol for how devices communicate over the internet. Among other differences, it uses a 128-bit address instead of the IPv4’s 32-bit address, supports more IP addresses, and is the process of replacing IPv4. By default, IPv6 is not enabled on all Netlify sites and apps. If you use Netlify DNS, you can enable it explicitly in your Domains dashboard. To enable IPv6 for your site or to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. Select the domain you want to enable IPv6 for and select Enable IPv6. Last 15, 2025 PreviousDNS recordsNextNetlify name servers Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.346Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":833}}161{"id":"doc-assign_a_domain_to_your_site_or_app_netlify_docs-cbb1049b","source":"documentation","title":"Assign a domain to your site or app | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/assign-a-domain-to-your-site-app/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Assign a domain to your site or app Copy page View as Markdown Copy as Markdown View as Markdown Use your own domain for your Netlify site for free or you can add a domain you already own, then set up Netlify DNS for it. From your Site Overview or Site dashboard, on the left sidebar, select Domain management. Next, choose Add a domain, then Add a domain you already own. Enter your domain and follow the setup prompts. Choose whether you will use Netlify DNS or an External DNS Provider. If you’re using an External DNS Provider, check out their docs for help updating your DNS records and our DNS records docs. Find some customized help by selecting Pending DNS verification next to your domain. These in-app instructions are customized based on your added domain. If you decide to use Netlify DNS, select Options > Set up Netlify DNS and follow the setup prompts. Last 28, 2025 PreviousAdd domain redirectNextManage DNS records Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.347Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":845}}162{"id":"doc-dns_records_netlify_docs-86a01f3b","source":"documentation","title":"DNS records | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/dns-records/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Supported record types Add a new record Edit a record Delete a record API endpoints On this page Overview Supported record types Add a new record Edit a record Delete a record API endpoints For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / DNS records Copy page View as Markdown Copy as Markdown View as Markdown DNS records are rules that tell domain name servers how to handle traffic to your domains and subdomains. For domains managed by Netlify, we will automatically create “NETLIFY” records that point to our servers when you assign a domain or subdomain for your site. To learn more, visit our Forums for a verified support guide on this type of DNS record. You can also add your own DNS records to point to other services, such as an email provider. Visit our Forums for a verified Support Guide on how to receive emails on your domain. Supported record typesSection titled “Supported record types” Netlify DNS supports the following types of : Address record, which is used to map host names to their IPv4 address. Address record, which is used to map host names to their IPv6 address. Authority (CA) Authorization, which is used to specify which CAs are allowed to create certificates for a domain. name record, which is used to specify alias names. exchange record, which is used in routing requests to mail servers. server record, which delegates a DNS zone to an authoritative server. Policy Framework record, a deprecated record type formerly used in e-mail validation systems (use a TXT record instead). locator record, which is used by some voice over IP, instant messaging protocols, and other applications. record, up to 255 characters. Can contain arbitrary text and can also be used to define machine-readable data, such as security or abuse prevention information. Add a new recordSection titled “Add a new record” To add a new DNS to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. Select the domain (or DNS zone) you want to add a new DNS record for. At the bottom of the DNS records section, select Add new record. Choose the type of record to create from the menu and fill in the remaining options. The fields you need to fill out will depend on the type of record you select. Select Save to create the record and make the changes live. Remember, it may take up to a few hours for record changes to propagate. Note that you can host records for other services, such as your mail provider or your backend API, with us as long as you host at least one website with us that uses the domain. Next step If you’re adding DNS records as part of the process of moving your DNS service to Netlify DNS, your next step is to delegate your domain to Netlify. Edit a recordSection titled “Edit a record” To make DNS changes, you need to first add a new record with the new value and then delete the old record. DNS allows multiple entries for the same name and type, so you can avoid downtime by making changes this way. Delete a recordSection titled “Delete a record” To delete a DNS to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. Select the domain (or DNS zone) you want to delete a DNS record for. In the DNS records section, find the record you want to delete. Select the record to expand the details and then select the delete option. Review the warning message and select Delete to confirm. Remember, it may take up to a few hours for record changes to propagate. API endpointsSection titled “API endpoints” You can use the API to get DNS records, create DNS records, and more. Last 19, 2026 PreviousDelegate a standalone subdomainNextEnable IPv6 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.348Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1539}}163{"id":"doc-bring_a_domain_to_netlify_dns_netlify_docs-04894e89","source":"documentation","title":"Bring a domain to Netlify DNS | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/bring-a-domain-to-netlify/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Step custom domain to your Netlify site Step your DNS configuration Step 3: (Optional) Verify your setup On this page Overview Step custom domain to your Netlify site Step your DNS configuration Step 3: (Optional) Verify your setup For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / Bring a domain to Netlify DNS Copy page View as Markdown Copy as Markdown View as Markdown Bring an existing domain you’ve already registered to Netlify DNS and set it as a custom domain for your production site. Step custom domain to your Netlify siteSection titled “Step custom domain to your Netlify site” Go to your Site Overview dashboard in Netlify and in the left sidebar, select Domain management. Select Add domain, then Add a domain you already own. Enter your domain and select Verify. Next, confirm with Add domain. The custom domain you added will be the primary domain for your production site by default. Step your DNS configurationSection titled “Step your DNS configuration” The next steps will vary depending on your DNS provider, domain, and the DNS records you need but here is a general overview. Go to the DNS provider settings for your custom domain. Based on the custom domain you entered, you typically need to add a new DNS record for your domain. Which DNS record type? It’s important you understand the DNS record type you need. Check out your DNS provider’s documentation or our DNS reords docs for help. Select or enter the DNS record type you need, add your custom domain or subdomain. In Netlify, go to your domain dashboard for your site and select Pending DNS verification next to your custom domain. You’ll find more details there you can use to set up your custom domain. These details are customized for your domain. For example, you may find this an A record for blueberry.com pointing to our load balancer’s IP address 75.2.60.5. blueberry.com A 75.2.60.5 You can copy the value 75.2.60.5 to add to an A record in your DNS provider for blueberry.com. For more detailed help, check out Configure external DNS. Step 3: (Optional) Verify your setupSection titled “Step 3: (Optional) Verify your setup” After updating your DNS settings, you may need to wait up to 48 hours for your changes to take full effect. In the meantime, you can re-review your setup and then verify your DNS propagation is working with the dig command in your terminal. For YOUR-DOMAIN @DNS-IP-ADDRESS Or you can try a Dig lookup site like https://www.digwebinterface.com/. Last 28, 2025 PreviousAdd a domain aliasNextConfigure an automatic subdomain for deploys Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nCreate an A record for blueberry.com pointing to our load balancer’s IP address 75.2.60.5.\nblueberry.com A 75.2.60.5\n```\n\nExample:\n```text\ndig YOUR-DOMAIN @DNS-IP-ADDRESS\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.348Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":14,"estimatedTokens":1281}}164{"id":"doc-form_troubleshooting_tips_netlify_docs-52918584","source":"documentation","title":"Form troubleshooting tips | Netlify Docs","url":"https://docs.netlify.com/manage/forms/troubleshooting-tips","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Forms Forms Setup Submissions Notifications Spam filters Troubleshooting tips Usage and billing On this page Overview Custom success page Extra spam prevention Missing submissions Test submissions flagged as spam Form detection disabled Missing data from old submissions Next.js Runtime v5 support On this page Overview Custom success page Extra spam prevention Missing submissions Test submissions flagged as spam Form detection disabled Missing data from old submissions Next.js Runtime v5 support For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Forms / Form troubleshooting tips Copy page View as Markdown Copy as Markdown View as Markdown This document provides troubleshooting tips for setting up a form. If you have questions that aren’t answered here, visit our Support Forums to get more advice about how to debug your form. Custom success pageSection titled “Custom success page” If you’re having trouble using the form action to customize the success page, try linking to your custom success page from somewhere on the same page as the form. Use the same exact path in your test link as you’re trying to use for the action attribute, and make sure the link works there before digging further into your form. Extra spam preventionSection titled “Extra spam prevention” If you’re adding a honeypot field or reCAPTCHA 2 challenge, you can check the form detail page to confirm whether or not the Extra spam prevention has been successfully enabled. Missing submissionsSection titled “Missing submissions” Here are some common causes and solutions for missing form submissions. Test submissions flagged as spamSection titled “Test submissions flagged as spam” If you’re sending test submissions of your form and not finding them in your Verified submissions list, it’s possible they’re getting flagged as spam by Akismet. Use the menu above the list to switch to Spam submissions and then recheck for your tests. To avoid having your tests flagged as spam in the first place, we recommend you enter a real email address instead of a fake one such as test@test.com. write some full sentences in any textareas rather than a few nonsense characters. spread out the rate of submissions from a single IP address. Form detection disabledSection titled “Form detection disabled” If you’re not finding new form submissions in your Verified submissions list for updated or newly added forms, ensure that form detection is enabled for your site. If this is your first time enabling form detection, go to Forms to turn on the setting. If you previously enabled form detection, go to Forms > Usage and configuration > Form detection to review the setting. Once you enable or re-enable form detection, make sure you redeploy your site. Once you redeploy, Netlify will automatically scan your deploys for forms and will accept form submissions. Missing data from old submissionsSection titled “Missing data from old submissions” If you recently changed the name or type of a form field, data for that field from old submissions will no longer appear in the Netlify UI. This is because the Netlify UI only shows the form fields and data that correspond to the last deployed version of your form. Fortunately, all of your previous submission data are still available through the Netlify API. You can request form data with the listFormSubmissions endpoint. If you would like to review the data from both the old and current form fields in the Netlify UI, we recommend that you mark old form fields as “hidden” instead of removing or replacing them entirely. Next.js Runtime v5 supportSection titled “Next.js Runtime v5 support” If you’re using Netlify Forms with Next.js Runtime v5, you need to extract your form definitions to a dedicated static HTML file and make sure that the form submission uses AJAX rather than full-page navigation. Refer to the Next.js v5 breaking changes for more information. Last 14, 2025 PreviousSpam filtersNextUsage and billing Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.349Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1374}}165{"id":"doc-form_submissions_netlify_docs-11bdb2cf","source":"documentation","title":"Form submissions | Netlify Docs","url":"https://docs.netlify.com/manage/forms/submissions","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Forms Forms Setup Submissions Notifications Spam filters Troubleshooting tips Usage and billing On this page Overview Form submissions UI Submission summary display Export form submissions to CSV Change a form submission’s state Delete a form submission Delete a form API endpoints File uploads Manage sensitive form data Automatic sanitization Form-triggered functions On this page Overview Form submissions UI Submission summary display Export form submissions to CSV Change a form submission’s state Delete a form submission Delete a form API endpoints File uploads Manage sensitive form data Automatic sanitization Form-triggered functions For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Forms / Form submissions Copy page View as Markdown Copy as Markdown View as Markdown This document covers features you can use to manage your form submissions and recommendations for sensitive data. To learn how you can be made aware of new form submissions, visit our form notifications page. Form submissions UISection titled “Form submissions UI” You can find all submissions to your Netlify forms in your site’s Forms tab. Select a form name from the Active forms list to access the submissions for that form. By default, only verified submissions are listed. You can switch to spam submissions using a menu above the list. Note If you’ve disabled form detection, Netlify will not process any new or changed forms in your HTML files during deploys. You can still access form submissions for any preexisting and unchanged forms, but any newly deployed or updated forms won’t support new submissions while form detection is disabled. Submission summary displaySection titled “Submission summary display” Each form submission in the list displays a summary to help you identify it. The summary is generated based on your form's HTML structure in the following priority and body your form has a title and/or body field, these are combined in the summary. First field with no title or body field exists, the summary displays the value from the first field that contains data. For file upload fields, the filename is shown. The title and body are identified by field type, not field : The first text <input> element that is not hidden and not an email-related field. Email-related fields are those with type=\"email\" or names matching email, mail, from, twitter, or sender (case-insensitive). If no matching input is found, Netlify falls back to looking for a field named exactly title or subject (case-insensitive). first <textarea> element in the form, regardless of its name. This means the order of fields in your HTML affects which values appear in the summary. Export form submissions to CSVSection titled “Export form submissions to CSV” You can export verified form submissions to a CSV file. From the Forms tab, select the form you want to export, then select Download as CSV near the top of the form detail page. Change a form submission’s stateSection titled “Change a form submission’s state” You can change the state of a submission from spam to verified or vice versa. To do so, check the box next to each submission title to select one or multiple submissions and then use the Mark as spam or Mark as verified button. Delete a form submissionSection titled “Delete a form submission” You can delete both verified submissions and spam submissions. To do so, check the box next to each submission title to select one or multiple submissions. After you select the submissions, a red Delete submission button will become available. When you select Delete submission, you’ll be prompted to confirm the deleting action. Once you confirm, your selected submissions will be deleted permanently. Delete a formSection titled “Delete a form” You can delete a form and all of its submissions by selecting Delete form. You’ll be prompted to confirm the deleting action. Once you confirm, future submissions to the form will result in a 404 error and previous submissions will no longer be available. You may want to export form submissions to CSV before you delete your form. API endpointsSection titled “API endpoints” You can use the API to get verified/spam submissions, delete submissions, delete forms, and more. File uploadsSection titled “File uploads” When a form is submitted with one or more file uploads, a link to each uploaded file will be included in the form submission details. These are accessible in the Netlify app, in email notifications, in CSV exports, and from our API. After you delete a form, the file uploads are still available by their direct URL for 24 hours because of the way caching works for forms by default. Manage sensitive form dataSection titled “Manage sensitive form data” Form submission data is securely stored in our user database. If your form collects personally identifiable information (PII), we recommend that you actively manage the data by exporting form submissions and deleting them regularly. Forms that include file uploads with personally identifiable information should use the Very Good Security integration to protect this data. Automatic sanitizationSection titled “Automatic sanitization” Our form handling automatically sanitizes form submissions to keep your site and business secure. Any code that gets submitted through Netlify Forms, such as <script> tags or anything else that could be harmful, is neutralized. Take for example the following code: <script>alert('Surprise!');</script> If someone tries to submit this through your form, we transform the code into the following to make it harmless: &lt;script&gt;alert('Surprise!')&lt;/script&gt; Form-triggered functionsSection titled “Form-triggered functions” You can integrate your forms with Netlify Functions by triggering a serverless function when a form submission is verified. Find out more in the Functions docs. Last 17, 2025 PreviousSetupNextNotifications Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n<script>alert('Surprise!');</script>\n```\n\nExample:\n```text\n&lt;script&gt;alert('Surprise!')&lt;/script&gt;\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.350Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":13,"estimatedTokens":1888}}166{"id":"doc-automatic_content_reload_netlify_docs-e01129ae","source":"documentation","title":"Automatic content reload | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/automatic-content-reload/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Automatic content reload Capture & handle change events Add an event listener Next.js example Conditional refresh Custom content reload When to go fully custom On this page Overview Automatic content reload Capture & handle change events Add an event listener Next.js example Conditional refresh Custom content reload When to go fully custom For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending ); See the event reference for more details on the event object. Next.js exampleSection titled “Next.js example” The event listener will run on all pages by using the App component. // src/pages/_app.jsimport * as React from \"react\"; const CHANGE_EVENT = \"stackbitObjectsChanged\"; export default function MyApp({ Component, pageProps }) { const onContentChange = e => { // Override the default refresh behavior just for a specific URL if (e.detail.currentUrl === \"/about\") { e.preventDefault(); /* myRefreshCodeJustForAbout() ... */ } }; /* When any page is mounted, add the listener. Note the function returned by the callback, which will be called on unmount, and the empty dependency array to prevent this from running on any re-render. */ React.useEffect(() => { window.addEventListener(CHANGE_EVENT, onContentChange); return () => { window.removeEventListener(CHANGE_EVENT, onContentChange); }; }, []); return <Component {...pageProps} />;} Conditional refreshSection titled “Conditional refresh” You can override Visual Editor’s default behavior just in certain conditions or for specific URLs, by conditionally calling e.preventDefault() just when appropriate. For example, if you're methodically annotating all content objects used to render a given page with data-sb-object-id data attributes, you can prevent a refresh when there's no intersection between changed objects and on-page onContentChange = e => { const intersects = e.detail.changedObjectIds.some(o => e.detail.visibleObjectIds.includes(o) ); if (!intersects) e.preventDefault();}; Custom content reloadSection titled “Custom content reload” To handle content change detection & refresh fully within your codebase, add the following to your configuration default { stackbitVersion: \"~0.6.0\", }; With customContentReload set to true Visual Editor will not notify you of content changes, nor will it refresh the page. When to go fully customSection titled “When to go fully custom” If you're using Sourcebit as many existing projects do.This package is optional and external to Visual Editor itself. It handles change detection & page refresh by itself for supported content sources & web frameworks. If your application implements a cache layer on top of your content source, you need to ensure that this cache is up-to-date with content changes before the page is being refreshed. This requires having your own pipeline for content change detection => cache update/invalidation => page refresh. You can find an example of that in the sourcebit-target-next plugin. Last 14, 2025 PreviousAnalyticsNextContent presets Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// src/pages/_app.jsimport * as React from \"react\";\nconst CHANGE_EVENT = \"stackbitObjectsChanged\";\nexport default function MyApp({ Component, pageProps }) {  const onContentChange = e => {    // Override the default refresh behavior just for a specific URL    if (e.detail.currentUrl === \"/about\") {      e.preventDefault();      /* myRefreshCodeJustForAbout() ... */    }  };\n  /*  When any page is mounted, add the listener.  Note the function returned by the callback, which will be called on unmount,  and the empty dependency array to prevent this from running on any re-render.  */  React.useEffect(() => {    window.addEventListener(CHANGE_EVENT, onContentChange);    return () => {      window.removeEventListener(CHANGE_EVENT, onContentChange);    };  }, []);\n  return <Component {...pageProps} />;}\n```\n\nExample:\n```text\nconst onContentChange = e => {  const intersects = e.detail.changedObjectIds.some(o =>    e.detail.visibleObjectIds.includes(o)  );  if (!intersects) e.preventDefault();};\n```\n\nExample:\n```text\nexport default {  stackbitVersion: \"~0.6.0\",  customContentReload: true};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.351Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":22,"estimatedTokens":1670}}167{"id":"doc-form_notifications_netlify_docs-7f8aee17","source":"documentation","title":"Form notifications | Netlify Docs","url":"https://docs.netlify.com/manage/forms/notifications","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Forms Forms Setup Submissions Notifications Spam filters Troubleshooting tips Usage and billing On this page Overview Slack notifications Email notifications Customize the email subject line Example HTML forms Remove [Netlify] prefix from your email subject line Zapier integrations n8n integrations On this page Overview Slack notifications Email notifications Customize the email subject line Example HTML forms Remove [Netlify] prefix from your email subject line Zapier integrations n8n integrations For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending , %{siteName}, or %{submissionId}. For example, your email subject line can be New lead from %{formName} (%{submissionId}). Use these variables in the HTML form or in the Netlify UI. Example HTML formsSection titled “Example HTML forms” This example sets the email subject line for your form notification to Sales inquiry from mysitename.netlify.app: <form name=\"contact\" method=\"POST\" data-netlify=\"true\"> <input type=\"hidden\" name=\"subject\" value=\"Sales inquiry from mysitename.netlify.app\" /> <p> <label>Your Name: <input type=\"text\" name=\"name\" /></label> </p> <p> <label>Your Email: <input type=\"email\" name=\"email\" /></label> </p> <p> <label>Message: <textarea name=\"message\"></textarea></label> </p> <p> <button type=\"submit\">Send</button> </p></form> The Reply-to email is whatever value the form submitter entered in the Your This example uses predefined variables to dynamically set your email subject line to New lead from %{formName} (%{submissionId}): <form name=\"contact\" method=\"POST\" data-netlify=\"true\"> <input type=\"hidden\" name=\"subject\" value=\"New lead from %{formName} (%{submissionId})\" /> <p> <label>Your Name: <input type=\"text\" name=\"name\" /></label> </p> <p> <label>Your Email: <input type=\"email\" name=\"email\" /></label> </p> <p> <label>Message: <textarea name=\"message\"></textarea></label> </p> <p> <button type=\"submit\">Send</button> </p></form> Older form or want to remove [Netlify] from subject line? The example above assumes your form was created after May 5, 2023. Forms created before this date will have an automated [Netlify] prefix in your email subject line.To remove [Netlify] from the subject line of your form submission email notification, check out our [Netlify] prefix removal docs. For greater control of form-triggered emails, or to connect other services, you can use the Netlify app on Zapier or n8n. Remove [Netlify] prefix from your email subject lineSection titled “Remove [Netlify] prefix from your email subject line” Forms created before May 5, 2023 included [Netlify] as a default and automated prefix in the email subject line. Now you can remove the [Netlify] prefix from your email subject line and completely customize your email subject line. To remove [Netlify] from the email subject line of your form submission notification you have an email subject line specified in your HTML form, decide whether to modify your existing email subject line in the HTML form or opt to use the Netlify UI instead. If you do not have an email subject line specified in your HTML form, you can just edit the form notification settings in the Netlify UI. All new forms will not include [Netlify]. Remove [Netlify] prefix in the HTML formSection titled “Remove [Netlify] prefix in the HTML form” To remove the [Netlify] prefix from your subject line and keep using the HTML form to specify the subject line, add the data-remove-prefix attribute to your HTML form’s email subject input field: <form name=\"contact\" method=\"POST\" data-netlify=\"true\"> <input type=\"hidden\" name=\"subject\" data-remove-prefix value=\"Sales inquiry from mysitename.netlify.app\" /> <!-- Add other form fields here --></form> In this example, your email subject line is Sales inquiry from mysitename.netlify.app. This removes [Netlify] from your new form notification emails. Learn more about this update in this support Forums post. Note that if you have an HTML form with a different email subject specified, that subject will take precedence over any updates you make to the email subject line in the Netlify UI. Zapier integrationsSection titled “Zapier integrations” Netlify is available on Zapier, where you can connect Netlify with over 1,000 other applications. You can set up a “Zap” action to be triggered when there is a verified form submission on your website. You can find out more on our blog, or use one of the templates below to get a deploy of your Netlify site after new Netlify form submissions Netlify Use this zap Send Gmail emails for new Netlify form submissions Gmail + Netlify Use this zap Save new Netlify form submissions to rows in Google Sheets Google Sheets + Netlify Use this zap Create Salesforce leads from new Netlify form submissions Netlify + Salesforce Use this zap Create Mailchimp subscribers from new Netlify form submissions Mailchimp + Netlify Use this zap Create Zendesk tickets for new Netlify form submissions Netlify + Zendesk Use this zap n8n integrationsSection titled “n8n integrations” Netlify is available on n8n, an open source tool that allows you to connect Netlify with other applications. By using one of n8n’s Netlify nodes, you can create your own automated workflow. To get started, you can use the Netlify node, Netlify Trigger node, or you can use the existing workflow Netlify Form submissions to Airtable Netlify Trigger node Use workflow Last 14, 2025 PreviousSubmissionsNextSpam filters Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n<form name=\"contact\" method=\"POST\" data-netlify=\"true\">  <input type=\"hidden\" name=\"subject\"  value=\"Sales inquiry from mysitename.netlify.app\" />  <p>    <label>Your Name: <input type=\"text\" name=\"name\" /></label>  </p>  <p>    <label>Your Email: <input type=\"email\" name=\"email\" /></label>  </p>  <p>    <label>Message: <textarea name=\"message\"></textarea></label>  </p>  <p>    <button type=\"submit\">Send</button>  </p></form>\n```\n\nExample:\n```text\n<form name=\"contact\" method=\"POST\" data-netlify=\"true\">  <input type=\"hidden\" name=\"subject\"  value=\"New lead from %{formName} (%{submissionId})\" />  <p>    <label>Your Name: <input type=\"text\" name=\"name\" /></label>  </p>  <p>    <label>Your Email: <input type=\"email\" name=\"email\" /></label>  </p>  <p>    <label>Message: <textarea name=\"message\"></textarea></label>  </p>  <p>    <button type=\"submit\">Send</button>  </p></form>\n```\n\nExample:\n```text\n<form name=\"contact\" method=\"POST\" data-netlify=\"true\">  <input type=\"hidden\" name=\"subject\" data-remove-prefix  value=\"Sales inquiry from mysitename.netlify.app\" />  <!-- Add other form fields here --></form>\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.352Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":18,"estimatedTokens":2006}}168{"id":"doc-manage_visual_editing_for_a_site_netlify_docs-1567b8b7","source":"documentation","title":"Manage visual editing for a site | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/get-started/manage-visual-editing/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Enable visual editing Find a site with visual editing Manage access to visual editor Open the visual editor Find the working status of the visual editor Disable visual editing On this page Overview Enable visual editing Find a site with visual editing Manage access to visual editor Open the visual editor Find the working status of the visual editor Disable visual editing For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Get Started / Manage visual editing for a site Copy page View as Markdown Copy as Markdown View as Markdown As a Netlify Owner or Developer, learn the basics of managing visual editing for a site using the Netlify visual editor. Enable visual editingSection titled “Enable visual editing” Once a site has visual editing enabled, you can either test out visual editing if your site is already pre-configured or you can follow the configuration steps to complete the setup. As a Developer or Owner, to enable visual editing for an existing site on a successful deploy of your site, go to your project configuration page in app.netlify and select Enable visual editor. Select Enable visual editor. From your visual editor settings page, you’ll find the setup walkthrough in the Netlify UI that prompts you for the next steps. Note that you may not need to complete all of these steps, depending on how much your site is already pre-configured for the visual editor. For additional guidance, check out the visual editor walkthrough help doc. Find a site with visual editingSection titled “Find a site with visual editing” To find a site with visual editing your Team Overview, go to your visual editor dashboard for your team. Or from your sites list in the Netlify dashboard, you can append visual_editor=true to the URL search parameters. For example, this URL https://app.netlify.com/teams/YOUR_TEAM_NAME/sites?visual_editor=true will return sites with visual editing enabled. Manage access to visual editorSection titled “Manage access to visual editor” To manage access for the visual editor, you must have certain permissions. Learn more in Editorial permissions. Open the visual editorSection titled “Open the visual editor” When visual editing is enabled for a site, you can access the visual editor through the navigation after you select a site in the Netlify UI in the project details card Find the working status of the visual editorSection titled “Find the working status of the visual editor” The working status of the visual editor is shown near the project details card in the Netlify app UI. You can also find a status update in the visual editor interface. Disable visual editingSection titled “Disable visual editing” To turn off Netlify’s visual editor functionality for a a Developer or Owner, go to your project configuration page in app.netlify. Select the Disable the visual editor button and confirm you want to stop visual editing for the site. Last 14, 2025 PreviousCustomize editing experienceNextVisual editor walkthrough help Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.353Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1414}}169{"id":"doc-content_driven_development_netlify_docs-a656be3a","source":"documentation","title":"Content-driven development | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/concepts/content-driven-development/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Control code through content Avoid developer intervention Apply guardrails to behavior Degrees of composability Template-based pages Composable pages Find the right balance Use Visual Editor for balance On this page Overview Control code through content Avoid developer intervention Apply guardrails to behavior Degrees of composability Template-based pages Composable pages Find the right balance Use Visual Editor for balance For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Concepts / Content-driven development Copy page View as Markdown Copy as Markdown View as Markdown Empowering non-technical editors to make structural changes to a website without the help of a developer. Content-driven development is the practice of using editable content to drive the behavior of code. This can be as simple as having a title field that renders text within a <h1> element on the page, but can be taken as far as dynamically driving page structure, layout, and styling. Control code through contentSection titled “Control code through content” The primary benefit to letting content dictate more than just text seen on the page is that it empowers non-technical editors to be able to make structural changes to the website without breaking it and without the intervention of a developer. Avoid developer interventionSection titled “Avoid developer intervention” Building websites is a lot of fun for developers. Making small adjustments to accommodate the ongoing needs of editors after the site has been launched is not as much fun. When content drives the structure and behavior of a site, anyone who can edit that content can control that structure and behavior. The more power developers can put into the hands of editors when handing the project over, the fewer smaller tasks and feature requests will be needed following the site's launch. That's good for everyone. Apply guardrails to behaviorSection titled “Apply guardrails to behavior” Ultimate flexibility is provided with access to the markup rendered on the screen. This is possible with direct access to the code. For many years (and still today), developers have provided editors with ultimate flexibility by opening up control over the HTML code that the browser renders. This is very bad in practice. It's hard for developers to get HTML code right, let alone someone who doesn't write code all day. Content-driven development promotes editing through some interface that stores content in a structured way. This means that developers choose the degree to which a page can be edited, while editors have much less chance of breaking the site. This is because the changes being made can be expected. Degrees of composabilitySection titled “Degrees of composability” There are two ends of the spectrum when it comes to how composable (flexible, customizable, etc.) a page can be. Template-based pages are rigid and map fields directly to a location on the page, while composable pages provide a flexible way to structure and style content. Template-based pagesSection titled “Template-based pages” Consider a blog post. Most sites have an expected design and structure for blog posts. The heading, body, and other meta attributes will have a predictable position and style on the public page. In cases like this, having structured content models that represent these fields makes a lot of sense. It maximizes the productivity for editors because they don't have to think about where content belongs or how it should look. They just add and publish the content. Composable pagesSection titled “Composable pages” Many sites have other pages (e.g. landing pages) where the style, structure, and layout of content is highly dynamic. It can often vary greatly depending on the copy and purpose of that page. In this case, editors should have more control to be able to control the visual output of the page. Let's look at an example that combines structured content with composable pages. Here, the page object coming from the content source is a structured object that has an id attribute (home-page), along with an embedded array of component data, as the sections property. This sections data get mapped through your code (shown in the next graphic) to create a page made up of flexible content. This enables content editors to compose pages in any way they want. This particular process varies from project to project. The simple example above is a stripped-down version of a JSX page that would handle the rendering of content in the browser shown on the right. Find the right balanceSection titled “Find the right balance” The key isn't giving editors flexibility, but finding the right degree of flexibility needed to meet their needs. Many site builders struggle in this area because they go too far with flexibility. And every bit of flexibility you add makes managing the code more complex. Therefore, flexibility should be introduced to the degree to which it best serves the site and its editors. A blog site probably doesn't need much flexibility, while a marketing site that consistently runs new campaigns is probably going to need to be much more flexible to serve the changing needs of each campaign. Use Visual Editor for balanceSection titled “Use Visual Editor for balance” This is where Visual Editor comes into play. Our visual editor is designed to flex to the needs of each individual editor by providing control for developers to introduce the exact degree of flexibility needed for each site. Last 23, 2025 PreviousStructured contentNextReusable content Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.354Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2054}}170{"id":"doc-visual_editor_concepts_overview_netlify_docs-d11f991b","source":"documentation","title":"Visual Editor concepts overview | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/concepts/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Visual Editor’s role in your stack Choose a starting point When to add Visual Editor Migrate to a modern stack Concepts documentation On this page Overview Visual Editor’s role in your stack Choose a starting point When to add Visual Editor Migrate to a modern stack Concepts documentation For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Concepts / Visual Editor concepts overview Copy page View as Markdown Copy as Markdown View as Markdown A deeper dive into how Visual Editor fits into your modern web stack and how its major elements work. Visual Editor enables developers to compose a custom site-building experience for the unique needs of their sites, by providing a mechanism for connecting content sources and third-party marketing tools into a single website management experience. This experience is controlled through configuration files that live alongside your code, with zero impact on your production application. Learn how the visual editor works. Visual Editor can make content from any source editable both in context and through standard and custom form controls. Additional features and third-party tools can also be integrated to enable your team to have a single source of truth for website management while continuing to use your preferred tools. Visual Editor’s role in your stackSection titled “Visual Editor’s role in your stack” Visual Editor plays no role in your production application. Visual Editor only interacts with your site while it is running the development server. Note Visual Editor has no effect on your production production application can run completely independent of Visual Editor. Development dependencies we require are development dependencies. Loading method by which you retrieve and deliver content to your pages and components is independent of how Visual Editor loads and stores content during the editing process. Choose a starting pointSection titled “Choose a starting point” Although we have a number of templates and examples, many developers choose to bring Visual Editor into an existing site. Most sites and frameworks can be compatible with Visual Editor, though they may require custom configuration. (Talk to us to learn more.) When to add Visual EditorSection titled “When to add Visual Editor” Visual Editor sits in a unique position in your stack. While it doesn't run in production, it plays a crucial production role in bringing together all tools and services necessary to edit and manage your site in a single environment. Having this tool at your disposal throughout the development process is vital to optimizing content modeling, catching design issues, and generally minimizing rework. While integration tends to be relatively seamless regardless of where you are in the process, we recommend bringing Visual Editor in as early as possible. Migrate to a modern stackSection titled “Migrate to a modern stack” Because we're concerned with bringing together the myriad of tools and services required to build a modern site, we often play a role in helping our customers choose what will serve them best. However, this answer is unique to each team and each project. The best way to get started is to send us a message. Concepts documentationSection titled “Concepts documentation” To learn more about key concepts for Visual Editor, check out the concepts docs. How the visual editor through the core concepts of how Visual Editor works by following a developer's typical journey. Content-driven non-technical editors to make structural changes to a website without the help of a developer. Reusable content editors work faster by providing a starting point for content. Structured Visual Editor works with structured content, along with content modeling basics. Two-way content Editor stores content back to the appropriate source, while also listening for changes from each source. Last 14, 2025 PreviousVisual editor glossaryNextHow visual editor works Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.354Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1654}}171{"id":"doc-how_visual_editor_works_netlify_docs-ffa2dbbc","source":"documentation","title":"How Visual Editor works | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/concepts/how-visual-editor-works/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Working modes Start with local development Visual Editor development server Project requirements Structured content Visual Editor configuration Content source connections Content editing Two-way content sync Traditional CMS editing Basic page editing Advanced editing Reusable content Collaboration Service provisioning Content publishing Next steps Get started tutorial Explore documentation On this page Overview Working modes Start with local development Visual Editor development server Project requirements Structured content Visual Editor configuration Content source connections Content editing Two-way content sync Traditional CMS editing Basic page editing Advanced editing Reusable content Collaboration Service provisioning Content publishing Next steps Get started tutorial Explore documentation For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Concepts / How Visual Editor works Copy page View as Markdown Copy as Markdown View as Markdown Walk through the core concepts of how Visual Editor works by following a developer's typical journey. Understanding how Visual Editor works is easiest when we follow a developer's typical journey, where each step builds on concepts and practices from those before it. Try it yourself You can put many of the concepts in this guide into action by following the getting started tutorial. Working modesSection titled “Working modes” You can use the visual editor in local development mode or in cloud setup mode. Start with local developmentSection titled “Start with local development” Developers typically start by working locally to build out a visual editing experience to suit their project's needs, while collaborating with content editors occurs in the cloud, which is covered near the end of this guide. Learn more about Local Development→ Visual Editor development serverSection titled “Visual Editor development server” Working locally with Visual Editor is made possible by using the CLI. The stackbit dev command runs in parallel with your site's development server to create a visual editing environment that enables developers to prepare a site before bringing in content editors. See the CLI reference→ Project requirementsSection titled “Project requirements” Visual Editor is fully composable, which means that most content sources and site frameworks can be supported (with varying levels of required configuration). Although Visual Editor services a large variety of sites, the one thing all sites have in common — what we consider to be the sole prerequisite — is that content must be structured and separated from code. We think of this as having a content-driven architecture. Read more on Content-Driven Development→ Structured contentSection titled “Structured content” For Visual Editor to be able to empower editors to change content, that content must be structured, which means it has a predictable shape, as defined by a content schema. Visual Editor will inherit content schema when it is defined in the source. When Visual Editor can't infer the schema (e.g. file-based content), you must provide a schema definition through Visual Editor configuration. Structured content requirements→ Visual Editor configurationSection titled “Visual Editor configuration” Visual Editor’s behavior for any given project is controlled by the configuration file, stackbit.config.js|ts. Configuration is how Visual Editor knows how to retrieve and store content, which content models represent pages, how editing features should work, and so on. See the config reference→ Content source connectionsSection titled “Content source connections” Perhaps the most critical configuration property is identifying the source(s) of a site's content, which is (usually) done through the contentSources config property. Each content source implements Visual Editor’s Content Source Interface, the mechanism that enables two-way content sync between Netlify and the source. Learn about Content Source Interface→ Content editingSection titled “Content editing” Once a site is properly configured, its content can be immediately edited through Visual Editor. Two-way content syncSection titled “Two-way content sync” One of the most powerful capabilities of Visual Editor is its two-way content synching mechanism, which provides the ability changes from Visual Editor that get saved back to the content source. Update content in Visual Editor when changes are made directly at the source. Automatically update the site preview when content changes have been made. Dive deep into Two-Way Content Sync→ Traditional CMS editingSection titled “Traditional CMS editing” When a content source is properly configured, all the models within the source will be available to edit within Visual Editor’s content editor panel. When working with content from a headless CMS, this requires no additional configuration, as Visual Editor can automatically detect content models and fields from the CMS. Learn more about the content editor panel→ Basic page editingSection titled “Basic page editing” To be able to edit with the page editor panel, you must tell Visual Editor which models represent pages. This is handled by content source modules. See `contentSources` property reference→ Advanced editingSection titled “Advanced editing” Editing can then be taken to the next level by enabling editing to click on elements in the preview and make the changes inline. This is made possible by annotating components by adding specific data attributes to inform Visual Editor how the structure of your content maps the elements in the DOM. More on inline editing→ Reusable contentSection titled “Reusable content” As powerful as inline editing is, it's made even more powerful when content editors can reuse content. Although there are multiple ways to do this, Visual Editor’s content presets feature tends to boost editors' productivity the most. Learn more about Content Presets→ CollaborationSection titled “Collaboration” When you’re ready to collaborate with content editors in the containerized version of your visual editor in the cloud, you can set up your site for visual editing. You can do this in these your site’s Git repository Enable visual editing for an existing site deployed through Netlify Service provisioningSection titled “Service provisioning” The visual editor provisions services based on your site and configuration. While many of your services will already be configured, the visual editor does the visual editor deploys your site to a [site].stackbit.app site on Netlify, unless your organization is configured to skip this step. visual editor creates a container that powers the editing experience for your site. This replaces stackbit dev, used when working locally. Provisioning configuration options→ Content publishingSection titled “Content publishing” Once editors have been added to Visual Editor project, they can begin publishing content to production. This process can also be customized, though it is through the visual editor settings. More on Publishing and Git Workflows→ Next stepsSection titled “Next steps” This concludes the overview on how Visual Editor works. Here are a few suggestions on what to do next. Get started tutorialSection titled “Get started tutorial” Follow the get started tutorial if you haven't. This provides a quick way to put some of these concepts into action. Choose a get started tutorial→ Explore documentationSection titled “Explore documentation” We've covered a lot of the basics, but there are other features and concepts to explore. Explore feature guides→ Last 14, 2025 PreviousConcepts overviewNextStructured content Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.356Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2579}}172{"id":"doc-troubleshoot_visual_editor_setup_netlify_docs-d21abfdd","source":"documentation","title":"Troubleshoot visual editor setup | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/get-started/troubleshoot-visual-editor-setup/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Site framework setup required Configuration file help GitHub App installation errors BitBucket access key errors Works locally but not on Netlify Site Framework related error Regenerate Deploy Key for visual editor On this page Overview Site framework setup required Configuration file help GitHub App installation errors BitBucket access key errors Works locally but not on Netlify Site Framework related error Regenerate Deploy Key for visual editor For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Get Started / Troubleshoot visual editor setup Copy page View as Markdown Copy as Markdown View as Markdown Get help setting up the visual editor for your site. Beyond setup For ongoing troubleshooting help after you’ve set up your visual editor, check out Troubleshoot visual editor or our official Support Guides. Site framework setup requiredSection titled “Site framework setup required” If your site relies on a framework or setup that uses SSG (or Static site generator) architecture, then you will need to configure the visual editor for SSG. For example, you may need to include the ssgName or ssg property in your visual editing configuration file. Examples using the ssgName propertySection titled “Examples using the ssgName property” Next.js and Contentful starter site Astro and Sanity Next.js and Git as the content source (Git CMS) Configuration file helpSection titled “Configuration file help” Many setup errors can happen if the visual editor configuration file is misconfigured or missing. The visual editor requires a properly configured stackbit.config.ts that tells the visual editor how to understand the content structure of your site and where to find its content files. For examples of working configuration files, check out the stackbit.config.ts file of these template site repositoryContent sourceOptimized forContentOps StarterGit CMS- learning about content types with over 35 content types - try more complex content type scenariosAuto-annotated portfolioGit CMS- learning about auto annotating your site - lots of auto annotated components What is Git CMS? For the visual editor, Git CMS refers to storing content in files and managing them directly in those files with Git version control. GitHub App installation errorsSection titled “GitHub App installation errors” You may find various errors when you try to install the GitHub App for the Netlify visual editor. To troubleshoot these, we recommend the to your GitHub App settings to check if the GitHub App for the Netlify visual editor is already installed and for which GitHub account. Noting that you may have installed the app for a different GitHub account than the one where the site repo is installed. To learn more, check out the managing app permissions GitHub docs. BitBucket access key errorsSection titled “BitBucket access key errors” If your BitBucket access key is failing, we recommend confirming you're using the right access key. To learn more, check out the BitBucket access key docs. Works locally but not on NetlifySection titled “Works locally but not on Netlify” If you find the visual editor works locally but on Netlify, check that your local updates to the visual editor configuration file (stackbit.config.ts) are also merged to your remote site repository. For example, if your site map works locally but on Netlify you have a missing site map error, then confirm that your local updates are on the configured working branch for the visual editor. So if your working branch is set to preview on Netlify, confirm that these changes have been pushed to your remote repository. To check your remote working branch on a site on Netlify, go to Project configuration > Visual editor > Preview settings. Site Framework related errorSection titled “Site Framework related error” Your site’s framework may require additional configuration for the visual editor to work. To learn more, check out the visual editing framework docs or check out the configuration file (stackbit.config.ts) of some template site repositories. Learn more about what your framework may require to set up the visual editing. Regenerate Deploy Key for visual editorSection titled “Regenerate Deploy Key for visual editor” When a GitHub repository is connected with the Visual Editor, a GitHub Deploy Key is generated on behalf of the user who makes the connection. In the case that you need to regenerate this deploy key, you'll first manually remove the deploy key at GitHub. Once the deploy key is removed, you can re-create the deploy key by relinking the repository. This can be done by navigating to the site where visual editing is enabled, then visiting Project Configuration > Build and Deploy > Repository. Last 6, 2026 PreviousVisual editor walkthrough helpNextVisual editor glossary Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.357Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1865}}173{"id":"doc-structured_content_netlify_docs-139e8c9f","source":"documentation","title":"Structured content | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/concepts/structured-content/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Content requirements Types of models Content modeling for headless CMS Distinguish model types Content modeling for Git CMS On this page Overview Content requirements Types of models Content modeling for headless CMS Distinguish model types Content modeling for Git CMS For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Concepts / Structured content Copy page View as Markdown Copy as Markdown View as Markdown How Visual Editor works with structured content, along with content modeling basics. Visual Editor sites rely on structured content that can drive both the presentation and behavior of your site, an approach we call content-driven development. This guide explores how Visual Editor works with structured content in content-driven sites. Content requirementsSection titled “Content requirements” Visual Editor’s only real requirement that affects your site's code is that content must be structured and separated from code. For a page to be editable in Visual Editor, its content must be represented by a structured data object coming from a content source. This type of object is referred to as a document. For components to be editable, they must also be represented by structured content, either as their own document or embedded inside another document (more on this below). Documents of a similar structure are grouped together in the content source using a model. In other words, we can say that every editable page and component is represented by a model in your content source. Types of modelsSection titled “Types of models” Visual Editor uses three types of : That which represents the shape of a page, as mentioned above. blog site that uses a Post model for its individual blog posts. objects which are meant either to stand alone and be accessed globally, or to be referenced from a page. Global Header model that contains content for a site's main menu. Reference blog site uses an Author model to apply rich attributes to Post content (via a reference field). content that is embedded in another model (of any type). Component models are typically object models. See the composable page section below for a detailed example. Here's an example of how elements on a web page may be header and footer content comes from globally-shared content objects of a data model. The content specific to the page is wrapped in a page object. Content for components within that page are of the object type, and are embedded within the page object. Content modeling for headless CMSSection titled “Content modeling for headless CMS” Visual Editor automatically inherits the schema (collection of models) from the API CMS. However, because most API content management systems don't have the concept of pages, page models must be extended with Visual Editor-specific attributes by setting type, which is often handled by extending page models. See `modelExtensions` property reference→ Distinguish model typesSection titled “Distinguish model types” Whether Visual Editor can resolve the distinction between the data and object type for the remaining (non-page) models depends on the behavior of the CMS. Contentful exampleSection titled “Contentful example” Contentful has no concept of model types. Everything is an entry. Therefore, all non-page models from Contentful are assumed to be data models. Learn more about using Contentful as a content source. Sanity exampleSection titled “Sanity example” Because Sanity has the concept of documents and objects, all documents that aren't pages become data in Visual Editor, while Sanity objects remain object models in Visual Editor. Learn more about using Sanity as a content source. Content modeling for Git CMSSection titled “Content modeling for Git CMS” When using Git CMS as the content source (files in the repository), you may not have any concept of modeling, as you can technically use files as a content source without any sort of schema. Visual Editor requires that all content objects be defined by some model. Therefore, file-based content must be represented by the models property in the Git CMS content source configuration. See the content modeling reference→ Last 14, 2025 PreviousHow visual editor worksNextContent-driven development Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.358Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1723}}174{"id":"doc-visual_editor_analytics_data_overlay_netlify_doc-cd78c634","source":"documentation","title":"Visual Editor analytics data overlay | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/analytics/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Access your analytics data Add a data overlay On this page Overview Access your analytics data Add a data overlay For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Visual Editor analytics data overlay Copy page View as Markdown Copy as Markdown View as Markdown Integrate analytics reporting into Visual Editor’s editing environment. Typically, accessing web and product analytics data requires using specialized expert systems that are out of a content editor's typical workflow and expertise. However, you can make this data easily accessible to all editors by adding an analytics layer to the visual editor. This integration has another significant having analytics data immediately visible on all pages, editors are encouraged to make their work more data-driven, based on real-world signals rather than guesswork. We have implemented this capability for an example site, pulling data from Google Analytics both at the page level as well as for specific section. Here's how it looks For a live demo based on Google Analytics, please contact us. Paying customers get access to the source code for this demo. Access your analytics dataSection titled “Access your analytics data” Ideally, your tool of choice already provides an online API for getting report data (e.g. Google Analytics Data API, Adobe Analytics Reporting API, whether historical (i.e. last X days) or real-time. If your vendor only allows for exporting data in bulk (typically to cloud storage), you'd need to write your own code to read and serve this data online. In either case, the client-side should not have the credentials to directly access the analytics tool's API. your own API endpoint to expose only needed KPIs. Keep needed credentials only on the server side. Your API endpoint and any client-side code should only be enabled in non-production environments. Check-in your code that process.env.NODE_ENV is not set to production. Add a data overlaySection titled “Add a data overlay” How you render analytics data depends on the web framework and components you use. Here are a few General only show analytics data on the client when your website is running inside Visual Editor, check that the environment variable process.env.STACKBIT_PREVIEW is defined (note: to maintain business-sensitive data confidential, always also make sure the server does not provide this data in production). Wrap your page component with a higher-order component to show a floating widget with page level data. Set a high z-index to ensure the widget is visible over all other controls. When navigating between pages, ensure data is refreshed. Ensure that any errors in fetching data are caught and do not fail page rendering. Let content editors control the widget's visibility, plus any other global settings, by creating a dedicated webpage that is quickly accessible with a sidebar button. To learn more, contact us! Last 14, 2025 PreviousTwo-way content syncNextAutomatic content reload Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.358Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1409}}175{"id":"doc-visual_editor_walkthrough_help_netlify_docs-ce56b1e5","source":"documentation","title":"Visual editor walkthrough help | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/get-started/visual-editor-walkthrough-help/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Before you begin Step site to Netlify Step up the preview environment Step visual editing Unlock visual editing for Git CMS Unlock visual editing for headless CMS Step 5. Restart the preview Step 6. Try the visual editor Next steps On this page Overview Before you begin Step site to Netlify Step up the preview environment Step visual editing Unlock visual editing for Git CMS Unlock visual editing for headless CMS Step 5. Restart the preview Step 6. Try the visual editor Next steps For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\";import { GitContentSource } from \"@stackbit/cms-git\"; export default defineStackbitConfig({ // ... contentSources: [ new GitContentSource({ , contentDirs: [\"content\"], models: [ { name: \"Post\", urlPath: \"/{slug}\", // Tell the visual editor where to find content filePath: \"content/pages/{slug}.md\", fields: [{ name: \"title\", type: \"string\", }] } ], }) ]}); For this content file, the visual editor would infer a document looking like: { // There would be more fields but the \"fields\" key is what I was trying to highlight \"id\": \"/content/pages/my-first-post.md\", \"fields\": [ { name: \"title\", type: \"string\", , value: \"My post title\" }, { name: \"slug\", type: \"slug\", value: \"my-first-post\", // not sure if the type here is true { name: \"markdown_content\", value: \"My post body\", type: \"markdown_content\" } ]} Next, tell the visual editor which models (structured data objects) represent pages. For example, add the type property: // stackbit.config.ts import { defineStackbitConfig } from \"@stackbit/types\"; import { GitContentSource } from \"@stackbit/cms-git\"; export default defineStackbitConfig({ // ... contentSources: [ new GitContentSource({ , contentDirs: [\"content\"], models: [ { name: \"Post\", type: \"page\", urlPath: \"/{slug}\", filePath: \"content/pages/{slug}.md\", fields: [{ name: \"title\", type: \"string\", }] } ], }) ] }); To let the visual editor know where your content lives, specify the URL path for your pages. This connects page models to specific URLs. There are two ways to do this. You can add a siteMap function which offers more control (most commonly used) or take a static route and specify the urlPath property for each page model in the modelExtensions property. Example specifying urlPathSection titled “Example specifying urlPath” In this example, you specify urlPath property for each model defined in your modelExtensions // stackbit.config.tsimport { defineStackbitConfig, SiteMapEntry } from \"@stackbit/types\"; export default defineStackbitConfig({ // ... contentSources: [ new GitContentSource({ , contentDirs: [\"content\"], models: [ { name: \"Post\", type: \"page\", // Static URL path derived from the \"slug\" field urlPath: \"/{slug}\", filePath: \"content/pages/{slug}.md\", fields: [{ name: \"title\", type: \"string\", }] }, // ... ], }) ],}); Unlock visual editing for headless CMSSection titled “Unlock visual editing for headless CMS” In general, the visual editor automatically inherits the schema (collection of models) from the API CMS. However, most Headless CMS options don’t have the concept of a “page” in their content model so you need to tell the visual editor what counts as a page with the modelExtensions property. Quick overview - Models for visual editor Key terms for how the visual editor structures : Represent the structure of content.There are three models represent the shape of a page. Data models represent content meant to stand alone or be referenced from a page. Object models represent repeatable content embedded in another model. For example, elements on a web page can be modeled in this more about how to model content for a headless CMS in these structured content docs or in the examples below in this setup guide. To configure the page editor for a site using headless to your site’s stackbit.config.ts file and tell the visual editor which of your models (or structured data objects) are pages. For example, if your CMS has a model called post , then you can indicate it’s a page model by implementing the modelExtensions property with { name: \"post\", type: \"page\" }: // stackbit.config.ts import { defineStackbitConfig } from \"@stackbit/types\"; export default defineStackbitConfig({ // ... modelExtensions: [ // Extend the \"page\" and \"post\" models by defining them as page models { name: \"post\", type: \"page\" } ] }); Now that we know which models are pages, we need to connect them to URL routes so the visual editor knows where your site’s editable pages are. To connect page models to URLs, you can add a siteMap function which offers more control (most commonly used) or take a static route and specify the urlPath property for each page model in the modelExtensions property. Step 5. Restart the previewSection titled “Step 5. Restart the preview” Confirm you have merged changes you made in stackbit.config.ts into the visual editor's working branch, which is preview by default, on your site’s remote repository on GitHub or BitBucket. If the Preview Server for the visual editor was already running, it will automatically restart. If the Preview Server was not already running, it will start automatically when you open visual editor. You can verify that your Preview Server has restarted by going to Preview Servers. Step 6. Try the visual editorSection titled “Step 6. Try the visual editor” After the Preview Server has successfully restarted, you can try the visual editor. From your site overview, select Open visual editor. Checkpoint You should now be able to open the visual editor and use the page editor to make changes to your site.If this is not true, let us know in the docs feedback form at the bottom of this page. More details are helpful. Next stepsSection titled “Next steps” For next steps, you can customize the visual editor further for your team’s workflow and explore its advanced features. Developers typically further customize visual editing inline editing to make changes directly in the preview Configuring asset sources Learn more about how to customize the visual editing experience. Last 14, 2025 PreviousManage visual editingNextTroubleshoot visual editor setup Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n---type: Post # The `type` property is a reserved word that tells the visual editor which model this content file belongs totitle: My post title---\nMy post body\n```\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";import { GitContentSource } from \"@stackbit/cms-git\";\nexport default defineStackbitConfig({  // ...  contentSources: [    new GitContentSource({      rootPath: __dirname,      contentDirs: [\"content\"],      models: [        {          name: \"Post\",          urlPath: \"/{slug}\",          // Tell the visual editor where to find content          filePath: \"content/pages/{slug}.md\",          fields: [{ name: \"title\", type: \"string\", required: true }]        }      ],    })  ]});\n```\n\nExample:\n```text\n{  // There would be more fields but the \"fields\" key is what I was trying to highlight  \"id\": \"/content/pages/my-first-post.md\",  \"fields\": [    { name: \"title\", type: \"string\", required: true, value: \"My post title\" },    { name: \"slug\", type: \"slug\", value: \"my-first-post\",    // not sure if the type here is true    { name: \"markdown_content\", value: \"My post body\", type: \"markdown_content\" }  ]}\n```\n\nExample:\n```text\n// stackbit.config.ts    import { defineStackbitConfig } from \"@stackbit/types\";    import { GitContentSource } from \"@stackbit/cms-git\";\n    export default defineStackbitConfig({      // ...      contentSources: [        new GitContentSource({          rootPath: __dirname,          contentDirs: [\"content\"],          models: [            {              name: \"Post\",              type: \"page\",              urlPath: \"/{slug}\",              filePath: \"content/pages/{slug}.md\",              fields: [{ name: \"title\", type: \"string\", required: true }]            }          ],        })      ]    });\n```\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig, SiteMapEntry } from \"@stackbit/types\";\nexport default defineStackbitConfig({  // ...  contentSources: [    new GitContentSource({      rootPath: __dirname,      contentDirs: [\"content\"],      models: [        {          name: \"Post\",          type: \"page\",          // Static URL path derived from the \"slug\" field          urlPath: \"/{slug}\",          filePath: \"content/pages/{slug}.md\",          fields: [{ name: \"title\", type: \"string\", required: true }]        },        // ...      ],    })  ],});\n```\n\nExample:\n```text\n// stackbit.config.ts import { defineStackbitConfig } from \"@stackbit/types\";\n export default defineStackbitConfig({   // ...   modelExtensions: [     // Extend the \"page\" and \"post\" models by defining them as page models     { name: \"post\", type: \"page\" }   ] });\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.360Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":6,"totalLines":38,"estimatedTokens":2844}}176{"id":"doc-content_presets_netlify_docs-53c9117a","source":"documentation","title":"Content presets | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/content-presets/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview How presets work File-based presets API-based presets Create presets How Save as Preset works Use Save as Preset Preset categories Build presets from scratch Edit presets Delete presets Share presets across projects Develop shared presets Handle nested objects Standalone child presets Handle references On this page Overview How presets work File-based presets API-based presets Create presets How Save as Preset works Use Save as Preset Preset categories Build presets from scratch Edit presets Delete presets Share presets across projects Develop shared presets Handle nested objects Standalone child presets Handle references For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending API-based presetsSection titled “API-based presets” Visual Editor will store presets in a remote content source under the following contentSources property is used to define the content source. A defined content source includes a stackbitPreset model, with the following (string) thumbnail (media/image) data (json/text) Note After configuring the visual editor in the cloud, the container must be restarted for the remote preset source to be picked up. Using this feature has the following side-effects and Editor will use the first stackbitPreset model it finds from sources defined in contentSources, starting from the first element in the array. File-based presets can not also be used and the presetSource property will be ignored. Create presetsSection titled “Create presets” The easiest way to create presets is to use the Save as Preset feature, available to content editors. How Save as Preset worksSection titled “How Save as Preset works” When a preset is created, Visual Editor does the the preset's content in the appropriate location, based on configuration. Generates a thumbnail preview of the component, and places the file in the appropriate source. (For file-based presets, this is in the ; Develop shared presetsSection titled “Develop shared presets” When building shared presets, you want to make sure they are going to be available to your shared projects before publishing. To do so, we recommend working locally with an example project that links to some other local directory (or Git submodule) to ensure the presets are configured properly. Handle nested objectsSection titled “Handle nested objects” When a content source supports nested content, Visual Editor will store presets with appropriately nested content. As a result, a preset may contain information relating to more than one model. Standalone child presetsSection titled “Standalone child presets” Any component represented by a model can also have standalone presets. For example, a CardGrid preset could include Card presets, and you could also have separate presets for Card objects. The benefit of this is an editor adds the grid preset, they have some placeholder content for cards (rather than an empty space). Editors also have a series of options when creating new cards. After they've added a grid, they can then move quickly in adding new cards as needed. Handle referencesSection titled “Handle references” When a component contains a reference field, how the reference is created depends on your configuration. Note Changes you make to the global configuration of presets only apply to new presets, given that presets are stored as files. Last 14, 2025 PreviousAutomatic content reloadNextCustom actions Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n{  \"model\": \"Card\",  \"presets\": [    // preset config ...  ]}\n```\n\nExample:\n```text\nexport default {  presetSource: {    type: \"files\",    presetDirs: [\"node_modules/some-package/.stackbit/presets\", \"my-presets\"]  }  // other properties ...};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.361Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":13,"estimatedTokens":1558}}177{"id":"doc-custom_actions_netlify_docs-53c2fee7","source":"documentation","title":"Custom actions | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/custom-actions/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Types of actions Global actions Bulk document actions Model actions Field actions Accept input Supported field types Use input data Handling state Supported state State example Examples Generate a title Fix formatting on field Status messages Success status example Error status example On this page Overview Types of actions Global actions Bulk document actions Model actions Field actions Accept input Supported field types Use input data Handling state Supported state State example Examples Generate a title Fix formatting on field Status messages Success status example Error status example For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Custom actions Copy page View as Markdown Copy as Markdown View as Markdown Integrate workflow, automation and other custom tasks into Visual Editor. Custom actions create the ability to perform site and content tasks in a single location. Visual Editor already handles normalizing and syncing content among any number of content sources. This makes the visual editing environment the perfect candidate for triggering content, workflow, automation, and other tasks for a site. There are multiple points at which actions can hook into Visual Editor and content flow. See below for explanations, use cases, and examples. Types of actionsSection titled “Types of actions” There are four types of actions Bulk document actions Model actions Field actions Each action differs in the following location (in the UI) Configuration options Callback parameters See below for use cases and further instruction on working with each of these types. Global actionsSection titled “Global actions” Global actions are performed on the site as a whole. For a Deploy Preview for the current version of a site. Send a custom workflow event to reviewers. Run a performance test on the entire site. Check for broken links throughout the site. These actions are triggered from the top bar, next to the site name. Global actions are configured as a property in the main configuration object. //stackbit.config.tsexport default defineStackbitConfig({ stackbitVersion: \"0.6.0\", contentSources: [ /* ... */ ], actions: [ { type: \"global\", name: \"name_of_action\", options => { // Perform the action ... } // Other options ... } ]}); See the configuration reference for more information. Bulk document actionsSection titled “Bulk document actions” Bulk document actions are performed on a selected set of documents. For a set of pages to a translation service. Editors can choose the set of documents on which to trigger the action. Like global actions, bulk actions are configured as a property in the main configuration object, specified by the type property. // stackbit.config.tsexport default defineStackbitConfig({ stackbitVersion: \"0.6.0\", contentSources: [ /* ... */ ], actions: [ { type: \"bulk\", name: \"name_of_action\", options => { // Perform the action ... } // Other options ... } ]}); See the configuration reference for more information. Model actionsSection titled “Model actions” Model actions are performed on an individual document. For an object based on input values Sending a document to a translation service Taking a snapshot of a document in its current state These actions can be triggered where the document context is presented. When defined, it will always appear near the title in page and content editing modes. If using inline editing and if a proper data-sb-object-id annotation has been provided, the triggers will also be available in the toolbar when highlighting the document. Model actions are configured directly on the model definition. (When using a headless CMS, the model definition is an extension of the schema defined in the source.) import { PageModel } from \"@stackbit/types\"; export const = { name: \"Post\", type: \"page\", fields: [], // Other properties ... actions: [ { name: \"generate-title\", label: \"Generate Title\", options => { // Perform the action ... } } ]}; See the reference for more information. Field actionsSection titled “Field actions” Field actions are performed against a field on a document. For AI content for a specific field (optionally based on some input). Suggest fixing spelling and grammar. Fill certain fields with custom data from an external API. Translate a field using an external API. These actions can be triggered wherever the field input is displayed. If using inline editing and proper data-sb-object-id and data-sb-field-path annotations have been provided, the triggers will also be available in the toolbar when highlighting the field. Field actions are configured as a property on a field within a model definition. When using a headless CMS, the model definition is an extension of the schema defined in the source. Adding an action on a field that has been defined in an external schema only requires adding the name to identify the field. import { PageModel } from \"@stackbit/types\"; export const = { name: \"Post\", type: \"page\", fields: [ { name: \"title\", actions: [ { name: \"sanitize-title\", label: \"Sanitize Title\", options => { // Perform the action ... } } ] } ] // Other properties ...}; See the reference for more information. Accept inputSection titled “Accept input” Actions can accept input from editors by supplying the inputFields property with field definitions. These field definitions are identical to Visual Editor schema field definitions. Supported field typesSection titled “Supported field types” The following field types are color date datetime enum html markdown number reference slug string text url Use input dataSection titled “Use input data” The input data is passed to the run function in an inputData object, where the key is the name of the field and the value is the user value. Here's a simple example: // stackbit.config.tsexport default defineStackbitConfig({ actions: [ { type: \"bulk\", name: \"name_of_action\", inputFields: [{ name: \"prompt\", type: \"string\", }], options => { const { prompt } = options.inputData; // Do something with `prompt` ... } } ]}); Handling stateSection titled “Handling state” The action trigger can be given a state to provide feedback to the user. The state can be set in the return object from the run function. Visual Editor will also check for updates to the state using the state property. Supported stateSection titled “Supported state” The following states are disabled hidden running State exampleSection titled “State example” The state function is most useful in long running actions when the state of the action may depend on external factors or maybe the field values of the document itself. Let's assume the run function calls a translation API that submits a whole document and requires humans to translate the content. The whole translation process may take several days. We don't expect the run function to run for several days. Instead, after calling the translation API, the run function will return immediately and return the proper state. const actions = [ { options => { // Do something with the translation API ... return { state: \"running\" }; } }]; This overrides the default Visual Editor behavior, which would change the state back to enabled. Every time the Studio requests the document with that action, the state function will check with the translation service if that document is still being translated or is finished, and return a matching state. const actions = [ { options => { // Check translation status ... return { state: \"...\" }; }, options => { // ... } }]; ExamplesSection titled “Examples” Here are a few more complete examples to help get started with custom actions. Generate a titleSection titled “Generate a title” This is a model action that uses Faker to generate a random title. This is shared for brevity. A more useful application might send a user prompt to an AI service. import { PageModel } from \"@stackbit/types\"; export const = { name: \"Post\", type: \"page\", fields: [{ name: \"title\" /* ... */ }], actions: [ { name: \"generate-title\", label: \"Generate Title\", options => { const { faker } = await import(\"@faker-js/faker\"); const document = options.currentPageDocument; if (!document) return; // Send feedback in the appropriate context const logger = options.getLogger(); logger.debug(`Running generate-title action on page: ${document.id}`); // Generate title const newTitle = faker.lorem.words(4); logger.debug(`Setting title to: ${newTitle}`); // Update the document with the new random title options.contentSourceActions.updateDocument({ document, ( document.srcType ), operations: [ { opType: \"set\", fieldPath: [\"title\"], !.find( field => field.name === \"title\" ) as FieldString, field: { type: \"string\", } } ] }); logger.debug(\"Finished generate-title action\"); } } ]}; Fix formatting on fieldSection titled “Fix formatting on field” In this example, we can force a field into a specific format. (Note that you could more strictly enforce this behavior with document hooks.) import { PageModel } from \"@stackbit/types\"; export const = { name: \"Post\", type: \"page\", fields: [ { type: \"string\", name: \"title\", , actions: [ { name: \"sanitize-title\", label: \"Sanitize Title\", inputFields: [], options => { const document = options.currentPageDocument; if (!document) return; // Send feedback to the appropriate context const logger = options.getLogger(); logger.debug( `Running sanitize-title action on page: ${document.id}` ); // Get the current title const currentTitleField = document.fields.title; if (!currentTitleField || !(\"value\" in currentTitleField)) return; // Clean it up const sanitizedTitle = currentTitleField.value .replace(/\\b(\\w)/g, s => s.toUpperCase()) .trim(); // Store the updated title on the document options.contentSourceActions.updateDocument({ document, ( options.parentDocument.srcType ), operations: [ { opType: \"set\", fieldPath: [\"title\"], , field: { type: \"string\", } } ] }); logger.debug(\"Finished sanitize-title action\"); } } ] } ]}; Status messagesSection titled “Status messages” Status messages allow you to customize a success, error, or other type of message to show users in the visual editor. Custom actions used for status messages use the run method. If a custom action is run from custom control, then the result property can be used. The result is returned to the user when the user executes a custom action in custom control using window.stackbit.runCustomAction: const result = await window.stackbit.runCustomAction({ actionName: 'test' });console.log(result); // result is either `result` attribute returned by custom action// or success/error messages if no `result` provided Success status exampleSection titled “Success status example” To return a success notification, the action’s run method needs to return an object with a success property containing the success message (this is also included in the return type of the run method): { (options) => { return { success: 'Action complete 🎉' } }} Error status exampleSection titled “Error status example” To return an error status, the custom action’s run method needs to return an object with an error property containing a human readable error message. This message can be returned as a result of running customAction from the custom control. The error message will be shown in a standard red notification in the visual : async (options) => { return { error: 'oops, something went wrong' }} The custom action’s run method can also throw an error object. In this case, the error’s message () => { throw new Error('oops, something went wrong');} Or, if the run function is asynchronous, it can reject with an error : async (options) => { await new Promise((resolve, reject) => { setTimeout(() => { reject(new Error('oops, something went wrong 😱')) }, 3000) })} If your handler run method throws an error, the message of the error will be returned as an error property with the prepended string Error running run () { throw new Error('oops') Last 18, 2026 PreviousContent presetsNextDocument hooks Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n//stackbit.config.tsexport default defineStackbitConfig({  stackbitVersion: \"0.6.0\",  contentSources: [    /* ... */  ],  actions: [    {      type: \"global\",      name: \"name_of_action\",      run: async options => {        // Perform the action ...      }      // Other options ...    }  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  stackbitVersion: \"0.6.0\",  contentSources: [    /* ... */  ],  actions: [    {      type: \"bulk\",      name: \"name_of_action\",      run: async options => {        // Perform the action ...      }      // Other options ...    }  ]});\n```\n\nExample:\n```text\nimport { PageModel } from \"@stackbit/types\";\nexport const Post: PageModel = {  name: \"Post\",  type: \"page\",  fields: [],  // Other properties ...  actions: [    {      name: \"generate-title\",      label: \"Generate Title\",      run: async options => {        // Perform the action ...      }    }  ]};\n```\n\nExample:\n```text\nimport { PageModel } from \"@stackbit/types\";\nexport const Post: PageModel = {  name: \"Post\",  type: \"page\",  fields: [    {      name: \"title\",      actions: [        {          name: \"sanitize-title\",          label: \"Sanitize Title\",          run: async options => {            // Perform the action ...          }        }      ]    }  ]  // Other properties ...};\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  actions: [    {      type: \"bulk\",      name: \"name_of_action\",      inputFields: [{ name: \"prompt\", type: \"string\", required: true }],      run: async options => {        const { prompt } = options.inputData;        // Do something with `prompt` ...      }    }  ]});\n```\n\nExample:\n```text\nconst actions = [  {    run: async options => {      // Do something with the translation API ...      return { state: \"running\" };    }  }];\n```\n\nExample:\n```text\nconst actions = [  {    state: async options => {      // Check translation status ...      return { state: \"...\" };    },    run: async options => {      // ...    }  }];\n```\n\nExample:\n```text\nimport { PageModel } from \"@stackbit/types\";\nexport const Post: PageModel = {  name: \"Post\",  type: \"page\",  fields: [{ name: \"title\" /* ... */ }],  actions: [    {      name: \"generate-title\",      label: \"Generate Title\",      run: async options => {        const { faker } = await import(\"@faker-js/faker\");        const document = options.currentPageDocument;        if (!document) return;        // Send feedback in the appropriate context        const logger = options.getLogger();        logger.debug(`Running generate-title action on page: ${document.id}`);        // Generate title        const newTitle = faker.lorem.words(4);        logger.debug(`Setting title to: ${newTitle}`);        // Update the document with the new random title        options.contentSourceActions.updateDocument({          document,          userContext: options.getUserContextForContentSourceType(            document.srcType          ),          operations: [            {              opType: \"set\",              fieldPath: [\"title\"],              modelField: options.model.fields!.find(                field => field.name === \"title\"              ) as FieldString,              field: { type: \"string\", value: newTitle }            }          ]        });        logger.debug(\"Finished generate-title action\");      }    }  ]};\n```\n\nExample:\n```text\nimport { PageModel } from \"@stackbit/types\";\nexport const Post: PageModel = {  name: \"Post\",  type: \"page\",  fields: [    {      type: \"string\",      name: \"title\",      required: true,      actions: [        {          name: \"sanitize-title\",          label: \"Sanitize Title\",          inputFields: [],          run: async options => {            const document = options.currentPageDocument;            if (!document) return;            // Send feedback to the appropriate context            const logger = options.getLogger();            logger.debug(              `Running sanitize-title action on page: ${document.id}`            );            // Get the current title            const currentTitleField = document.fields.title;            if (!currentTitleField || !(\"value\" in currentTitleField)) return;            // Clean it up            const sanitizedTitle = currentTitleField.value              .replace(/\\b(\\w)/g, s => s.toUpperCase())              .trim();            // Store the updated title on the document            options.contentSourceActions.updateDocument({              document,              userContext: options.getUserContextForContentSourceType(                options.parentDocument.srcType              ),              operations: [                {                  opType: \"set\",                  fieldPath: [\"title\"],                  modelField: options.modelField,                  field: { type: \"string\", value: sanitizedTitle }                }              ]            });            logger.debug(\"Finished sanitize-title action\");          }        }      ]    }  ]};\n```\n\nExample:\n```text\nconst result = await window.stackbit.runCustomAction({ actionName: 'test' });console.log(result);\n// result is either `result` attribute returned by custom action// or success/error messages if no `result` provided\n```\n\nExample:\n```text\n{  run: async (options) => {    return {      success: 'Action complete 🎉'    }  }}\n```\n\nExample:\n```text\nrun: async (options) => {  return {    error: 'oops, something went wrong'  }}\n```\n\nExample:\n```text\nrun: async () => {  throw new Error('oops, something went wrong');}\n```\n\nExample:\n```text\nrun: async (options) => {  await new Promise((resolve, reject) => {    setTimeout(() => {      reject(new Error('oops, something went wrong 😱'))    }, 3000)  })}\n```\n\nExample:\n```text\nasync run () {  throw new Error('oops')\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.363Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":15,"totalLines":83,"estimatedTokens":5104}}178{"id":"doc-manage_domains_for_a_site_or_app_netlify_docs-699db2e9","source":"documentation","title":"Manage domains for a site or app | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/manage-domains-for-a-site-app","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Manage production domains from the Netlify UI Manage domains for a site Review domains for a team Review a domain’s DNS records Review a domain’s Netlify name servers Manage domains from the API On this page Overview Manage production domains from the Netlify UI Manage domains for a site Review domains for a team Review a domain’s DNS records Review a domain’s Netlify name servers Manage domains from the API For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Manage domains for a site or app Copy page View as Markdown Copy as Markdown View as Markdown Manage domains for a site or app from the Netlify UI or the Netlify API. Manage production domains from the Netlify UISection titled “Manage production domains from the Netlify UI” As a Developer, you can review domains for a team and add or change domains for a site. As an Owner, you can transfer domains between teams you own, or delete DNS records. Manage domains for a siteSection titled “Manage domains for a site” You can find the domains for your production site at Domain management > Production domains. You have several options for managing multiple domains for your production site. To manage domains for an individual site or to your site or app dashboard. Select Domain management from the left sidebar. Select the domain you want to manage. Review domains for a teamSection titled “Review domains for a team” To find a list of domains available to your to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. You’ll find a list of your domains available to your team’s sites. Note that some of these domains may not be assigned to a site yet. For more help reviewing DNS records, check out our docs on Managing DNS records. Review a domain’s DNS recordsSection titled “Review a domain’s DNS records” If applicable, you can check out a domain’s DNS records from your domain dashboard. Go to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. You'll find a list of all domains connected to your team account that are managed by Netlify DNS. To expand DNS records, select a domain from the list. For more help reviewing DNS records, check out our docs on Managing DNS records. Review a domain’s Netlify name serversSection titled “Review a domain’s Netlify name servers” Check out our docs at Netlify name servers. Manage domains from the APISection titled “Manage domains from the API” Check out the Netlify API reference for DNS endpoints for more information on managing domains from the API. You can find the domains associated with your site in the Domain management section of your site configuration. Last 19, 2026 PreviousAutomatic deploy subdomainsNextManage domains for branch deploys Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.364Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1309}}179{"id":"doc-branch_deploys_netlify_docs-475b70d9","source":"documentation","title":"Branch deploys | Netlify Docs","url":"https://docs.netlify.com/deploy/deploy-types/branch-deploys","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview Branch deploy controls On this page Overview Branch deploy controls For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Deploy Types / Branch deploys Copy page View as Markdown Copy as Markdown View as Markdown Branch deploy controlsSection titled “Branch deploy controls” You can set up a branch deploy for a specific branch or for all new branches in your repository through your project configuration. By default, Netlify will not generate a branch deploy unless a Developer or Owner has set up branch deploys for your site. Missing collaboration tools on your branch deploy? If you have an existing branch deploy that does not show the Netlify Drawer, try merging new changes into your branch to generate a refreshed branch deploy. For more help, check our troubleshooting docs. Set up a branch deploy for specific branchesSection titled “Set up a branch deploy for specific branches” To set up a branch deploy for one or more specific branches, such as staging or to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. Select Let me add individual branches and enter the name of each branch you want to deploy. You can also enter branch names you haven’t created yet in your repository. To deploy all branches with a specific prefix, add an asterisk to the end of your branch name, e.g. features/*. To confirm, select Save. Set up branch deploys for all new branchesSection titled “Set up branch deploys for all new branches” To automatically generate branch deploys for every new branch pushed to your remote site to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. Next to Branch deploys, select All. This excludes the designated production branch for your repository. To confirm, select Save. Turn off all branch deploys for your siteSection titled “Turn off all branch deploys for your site” To turn off all branch deploys for your to Project configuration > Build & deploy > Continuous Deployment > Branches and deploy contexts, and select Configure. For Branch deploys, select None. To confirm, select Save. Protect all branch deploys with a passwordSection titled “Protect all branch deploys with a password” You can control who can access your site's branch deploys by requiring a password. Learn more at our Password Protection docs. Use branch subdomains for branch deploysSection titled “Use branch subdomains for branch deploys” You can assign custom branch subdomains to your branch deploys using your site's primary custom domain. Learn more about custom branch subdomains for branch deploys. Last 18, 2026 PreviousProduction deployNextDeploy Previews Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.365Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1154}}180{"id":"doc-content_editor_netlify_docs-faa6867a","source":"documentation","title":"Content editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/content-editor","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure columns Filter documents Search Field filters Filter control Available field controls Multiple filters Filter groups Filter references Visible models Content source exceptions On this page Overview Configure columns Filter documents Search Field filters Filter control Available field controls Multiple filters Filter groups Filter references Visible models Content source exceptions For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Visual Editing / Content editor Copy page View as Markdown Copy as Markdown View as Markdown The content editor is a way to quickly edit structured pages and data objects. This is similar to traditional form-based editing within a CMS. The editor distinguishes between models (content types, collections, etc.) that represent pages and those that may globally affect any page on the site. The editor can always navigate content by content type using the list view. Additionally, teams have the option of implementing a dedicated tree view, for example, for sitemap navigation or to navigate content using categories. Configure columnsSection titled “Configure columns” The table in the content editor can be customized by clicking on the gear icon to the right of the column headers. The columns available are dependent on the current context. Document metadata is always available. When filtering by a content type, fields specific to that content type will also be available. This selection is unique to each user and will not affect views for other users. Filter documentsSection titled “Filter documents” Various filtering methods make it easier to pinpoint specific documents (entries, items, etc.) within the available models. SearchSection titled “Search” Using the search field will look into all documents (of all content types) and return results for that search. To get all the matches for a particular content type, use the Type a model, searching filters the list of visible documents based on the query. Field filtersSection titled “Field filters” It is possible to filter content entries both by metadata (e.g. the shared createdAt property, document status, etc.) or by individual fields, including references (e.g. posts with a specific author). Filter controlSection titled “Filter control” Field filters are controlled by the filter button next to the search input. Add as many filters as necessary to pinpoint the right subset of content. Available field controlsSection titled “Available field controls” The available fields change context based on documents available in the current viewing documents within a model, fields for that model will be shown. When viewing a models list, Visual Editor metadata fields will be available (createdAt, updatedAt, status, scheduledForPublish, scheduledDate). Content source exceptions Git CMS doesn’t provide accurate metadata for “Created” and “Modified” dates by default since data is only read from your working branch. These columns are therefore not available in the content editor. Multiple filtersSection titled “Multiple filters” Filters can be combined with an option to match any (OR) or all (AND) of the filters. When more than two filters are used, all filters inherit the first chosen operator (AND/OR). Filter groupsSection titled “Filter groups” Filters can be grouped together to create more complex filters. When using groups with multiple filters, the group's operator will always be the inverse of the first filter's operator. For example, if the filters are using AND, the filters within each group will use OR. Filter referencesSection titled “Filter references” When filtering by referenced objects, you’ll be prompted to select existing content entries. Opening the select dropdown will trigger a modal from which you can choose the appropriate entry. After choosing the appropriate document(s) and clicking Select, the selected documents will appear in the filter control. Visible modelsSection titled “Visible models” Visual Editor shows page and data models in the content tab, determined by the type property set on the model. Getting models to appear in the pages section often requires using the modelExtensions configuration property to set the type property for page models. Content source exceptionsSection titled “Content source exceptions” Some content sources have specific behavior on how models are inferred by Visual Editor. Refer to content source integrations for more information. Last 14, 2025 PreviousOverviewNextCustom fields Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.367Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1789}}181{"id":"doc-field_controls_netlify_docs-4bad5c85","source":"documentation","title":"Field controls | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/field-controls","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Automatic control inference Customize control types options On this page Overview Automatic control inference Customize control types options For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", modelExtensions: [ { name: \"grid\", fields: [ { name: \"arrangement\", controlType: \"thumbnails\", options: [ { label: \"Two column grid\", value: \"two-col-grid\", thumbnail: \"https://assets.stackbit.com/components/images/default/two-col-grid.png\" }, { label: \"Three column grid\", value: \"three-col-grid\", thumbnail: \"https://assets.stackbit.com/components/images/default/three-col-grid.png\" } // ... ] } ] } ]}); Last 23, 2025 PreviousCustom fieldsNextField groups Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  modelExtensions: [    {      name: \"grid\",      fields: [        {          name: \"arrangement\",          controlType: \"thumbnails\",          options: [            {              label: \"Two column grid\",              value: \"two-col-grid\",              thumbnail:                \"https://assets.stackbit.com/components/images/default/two-col-grid.png\"            },            {              label: \"Three column grid\",              value: \"three-col-grid\",              thumbnail:                \"https://assets.stackbit.com/components/images/default/three-col-grid.png\"            }            // ...          ]        }      ]    }  ]});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.367Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":9,"estimatedTokens":1032}}182{"id":"doc-get_started_with_netlify_visual_editor_netlify_d-ce6c8860","source":"documentation","title":"Get started with Netlify Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/get-started/get-started-overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Setup pathways Visual Editor Support Requirements Site repository requirements Content source requirements Example template sites Troubleshooting help On this page Overview Setup pathways Visual Editor Support Requirements Site repository requirements Content source requirements Example template sites Troubleshooting help For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Get Started / Get started with Netlify Visual Editor Copy page View as Markdown Copy as Markdown View as Markdown Get started with the Netlify Visual Editor by choosing your setup path and checking that your site meets the requirements to use the visual editor. Netlify Visual Editor is an environment for content editors to work with structured content in a visual way. It is designed for composable architectures, and is compatible with any site framework and API-enabled content source. The visual editor is optimized for giving Developers the most flexibility in setting up a visual editing environment and custom workflow for a Content team. This allows Content editors and other custom roles to build new pages with ease and publish content in a streamlined workflow. Learn more about how the visual editor works or learn as you go by getting started. Setup pathwaysSection titled “Setup pathways” There are several ways to start setting up the visual editor. We recommend you set up in different ways based on what you are optimizing for. Optimizing forSite TypeSetup guideFastest way to try out visual editor experience on Netlify with new siteNew site using a pre-configured templateVisual Editor QuickstartConfiguring more than one content source & advanced customizationAn existing site or new template siteSet up visual editor locallyExisting sites deployed on Netlify with simpler customizationExisting sitesVisual editor walkthrough setup guide After your initial setup of the visual editor, we recommend you customize the visual editor for your site and workflow needs. Learn more in the customize editing experience docs. Visual Editor Support RequirementsSection titled “Visual Editor Support Requirements” For the most success getting visual editing working for your site, you should have the framework that runs a development server on a local port using Node.js v16 or later. Content stored in a supported headless CMS or in individual content files separated from code. If your site doesn't meet these requirements, you can likely still get visual editing working with additional code and configuration. Contact us for help. Site repository requirementsSection titled “Site repository requirements” When you set up the visual editor for your site you need to have access to the site repository, including the remote site repository once your site is deployed to Netlify. The visual editor only supports site repository syncing from these Git providers at this BitBucket Your site repository also needs a unique working branch for visual editor changes. The default working branch is preview. Content source requirementsSection titled “Content source requirements” If using an API-based CMS, you must also have a user account with read and write access to that content source. If using file-based content, the content must be defined by a schema that the visual editor can understand. This requires adding content modeling properties to your visual editor configuration file. We'll cover a bit on configuration later in this guide. Learn more about how Visual Editor works with structured content. Example template sitesSection titled “Example template sites” Explore a template site pre-configured for visual editing. Consider starting with the quickstart or local setup guide for a template site that is closer to your site’s needs. Site repositoryContent sourceOptimized forContentOps StarterGit CMS- learning about content types with over 35 content types - try more complex content type scenariosAuto-annotated portfolioGit CMS- learning about auto annotating your site - lots of auto annotated components Troubleshooting helpSection titled “Troubleshooting help” For help getting the visual editor setup, check out troubleshoot visual editor setup. Last 6, 2026 PreviousVisual editor overviewNextVisual editor quickstart Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.368Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1726}}183{"id":"doc-field_groups_netlify_docs-f4fd9132","source":"documentation","title":"Field groups | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/field-groups","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Default field group Customize field groups Use icons styles group On this page Overview Default field group Customize field groups Use icons styles group For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", modelExtensions: [ { name: \"hero\", fieldGroups: [{ name: \"styles\", label: \"Styles\", icon: \"palette\" }], fields: [{ name: \"bgColor\", group: \"styles\" }] } ]}); The result would show Content and Styles tabs, similar to the image at the top of this document. Last 23, 2025 PreviousField controlsNextInline editor Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  modelExtensions: [    {      name: \"hero\",      fieldGroups: [{ name: \"styles\", label: \"Styles\", icon: \"palette\" }],      fields: [{ name: \"bgColor\", group: \"styles\" }]    }  ]});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.369Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":9,"estimatedTokens":882}}184{"id":"doc-custom_fields_netlify_docs-5c4286bd","source":"documentation","title":"Custom fields | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/custom-fields","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Types of custom fields Inline fields Modal fields How custom fields work Field types vs control types Hook into the editor Use JavaScript bundle Best practices HTML file location Add styles Use external assets Avoid public directories Emoji field example Emoji field React example On this page Overview Types of custom fields Inline fields Modal fields How custom fields work Field types vs control types Hook into the editor Use JavaScript bundle Best practices HTML file location Add styles Use external assets Avoid public directories Emoji field example Emoji field React example For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export const = { name: \"HeroSection\", type: \"object\", fields: [ { type: \"string\", name: \"title\", label: \"Heading\" }, { type: \"string\", name: \"emoji\", controlType: \"custom-inline-html\", controlFilePath: \".stackbit/fields/emoji.html\" } ]}; In the example above, the emoji field is defined as a string field type, but the controlType is set to custom-inline-html. This field is presented as an iframe using the contents of ; window.stackbit.onUpdate = options => { if (options.init) { const buttons = document.querySelectorAll(\"button\"); buttons.forEach(button => button.addEventListener(\"click\", event => { // Update the field's value ... }) ); } };</script> Tip It is safest to manually initialize the window.stackbit object, as it may not be available when the script is executed. See below for a more complete example. Use JavaScript bundleSection titled “Use JavaScript bundle” When controlType is set to either custom-inline-script or custom-modal-script, the visual editor expects that value of controlFilePath is a link to the JavaScript bundle. The visual editor will cache the code of the control, making it render faster. Also, React and ReactDOM is exposed within the iframe, which decreases and optimizes the bundle size of the custom control. Read more about controlFilePath. Best practicesSection titled “Best practices” This section provides some common practices for working with custom fields, before moving on to an example. HTML file locationSection titled “HTML file location” The HTML file can be placed anywhere in the project. Because Visual Editor plays no role in production, we recommend that this be placed in a directory that isn’t published to the web and that doesn’t interfere with your application. In the examples shared in this doc, we’re using a button { solid { background: // Safely initialize the stackbit objectwindow.stackbit = window.stackbit || {}; window.stackbit.onUpdate = options => { // Helper function to get the current value of the field. This is most useful // when a document has nested content fields. function getCurrentValue() { try { return options.fieldPath.reduce((acc, curr) => { const newValue = acc[curr]; if (\"items\" in newValue) return newValue.items; if (\"fields\" in newValue) return newValue.fields; return newValue; }, options.document.fields).value; } catch (err) { return; } } // Use the init option to attach event listeners to elements within the custom // field. if (options.init) { const currentValue = getCurrentValue(); // Highlight the currently selected emoji if (currentValue) { document \"]`) ); // Attach click event listeners to each button document.querySelectorAll(\"button\").forEach(button => button.addEventListener(\"click\", event => { const value = event.target.dataset.value; // Update the document in the content source with the selected value options .updateDocument({ operations: [ { opType: \"set\", , , field: { ?.type ?? \"string\", value } } ] }) // Highlight the selected emoji after content has been updated ) ); }) ); }}; Emoji field React exampleSection titled “Emoji field React example” This example shows how to create the same emoji component, but using React. This control can be used when setting controlType to either custom-inline-script or custom-modal-script. webpack.config.js emoji.css emoji.js module.exports = { entry: './index.tsx', output: { (__dirname, 'dist'), filename: 'index.js' }, // decrease bundle size by using React as external dependency externals: { react: 'React', 'react-dom': 'ReactDOM' }, externalsType: 'global'}; body { %;} button { solid { * as React from \"react\";import * as ReactDOM from \"react-dom/client\"; const Emojis = [ { name: \"grinning\", emoji: \"😃\" }, { name: \"slightly_smiling_face\", emoji: \"🙂\" }, { name: \"neutral_face\", emoji: \"😐\" }, { name: \"slightly_frowning_face\", emoji: \"🙁\" }, { name: \"frowning_face\", emoji: \"☹️\" }]; function Component() { const [value, setValue] = React.useState(\"\"); React.useEffect(() => { // Safely initialize the stackbit object if (!window.stackbit) { window.stackbit = {}; } const handler = (options) => { setValue(options.documentField?.value ?? \"\"); if (options.init) { // Set the desired size of the control. options.setDesiredControlSize({ , }); } }; if (window.stackbit.options) { window.stackbit.options.setDesiredControlSize({ , }); handler(window.stackbit.options); } window.stackbit.onUpdate = handler; return () => { delete window.stackbit!.onUpdate; }; }, []); return ( <div class=\"grid\"> {Emojis.map(({ emoji, name }) => ( <button key={name} className={value === name ? \"active\" : \"\"} onClick={() => { const options = window.stackbit.options; if (!options) { return; } options.updateDocument({ operations: [ { opType: \"set\", , , field: { ?.type ?? \"string\", value } } ] }).catch((err) => { console.error(\"Could not update emoji field\", err); }); }} > {emoji} </button> ))} </div> );} const root = document.getElementById(\"root\") ?? document.body;ReactDOM.createRoot(root).render(<Component />); Last 25, 2025 PreviousContent editorNextField controls Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { ObjectModel } from \"@stackbit/types\";\nexport const HeroSection: ObjectModel = {  name: \"HeroSection\",  type: \"object\",  fields: [    {      type: \"string\",      name: \"title\",      label: \"Heading\"    },    {      type: \"string\",      name: \"emoji\",      controlType: \"custom-inline-html\",      controlFilePath: \".stackbit/fields/emoji.html\"    }  ]};\n```\n\nExample:\n```text\n<script>  window.stackbit = window.stackbit || {};\n  window.stackbit.onUpdate = options => {    if (options.init) {      const buttons = document.querySelectorAll(\"button\");      buttons.forEach(button =>        button.addEventListener(\"click\", event => {          // Update the field's value ...        })      );    }  };</script>\n```\n\nExample:\n```text\n<!DOCTYPE html><html lang=\"en\">  <head>    <!-- ... -->    <link rel=\"stylesheet\" href=\"emoji.css\" />  </head>  <body>    <!-- ... -->\n    <script src=\"emoji.js\"></script>  </body></html>\n```\n\nExample:\n```text\n<!DOCTYPE html><html lang=\"en\">  <head>    <meta charset=\"UTF-8\" />    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />    <title>Emoji Field</title>    <link rel=\"stylesheet\" href=\"emoji.css\" />  </head>  <body>    <div class=\"grid\">      <button data-value=\"grinning\">😃</button>      <button data-value=\"slightly_smiling_face\">🙂</button>      <button data-value=\"neutral_face\">😐</button>      <button data-value=\"slightly_frowning_face\">🙁</button>      <button data-value=\"frowning_face\">☹️</button>    </div>\n    <script src=\"emoji.js\"></script>  </body></html>\n```\n\nExample:\n```text\nbody {  max-width: 100%;}\nbutton {  font-size: 2rem;  padding: 0.5rem;  background: none;  cursor: pointer;  border: 1px solid #cfcfcf;  border-radius: 0.25rem;  line-height: 1;  transition: background 0.3s ease;}\nbutton.active {  border-color: teal;}\nbutton:hover {  background: #efefef;}\n.grid {  display: flex;  gap: 1rem;}\n```\n\nExample:\n```text\n// Safely initialize the stackbit objectwindow.stackbit = window.stackbit || {};\nwindow.stackbit.onUpdate = options => {  // Helper function to get the current value of the field. This is most useful  // when a document has nested content fields.  function getCurrentValue() {    try {      return options.fieldPath.reduce((acc, curr) => {        const newValue = acc[curr];        if (\"items\" in newValue) return newValue.items;        if (\"fields\" in newValue) return newValue.fields;        return newValue;      }, options.document.fields).value;    } catch (err) {      return;    }  }\n  // Use the init option to attach event listeners to elements within the custom  // field.  if (options.init) {    const currentValue = getCurrentValue();    // Highlight the currently selected emoji    if (currentValue) {      document        .querySelector(`button[data-value=\"${currentValue}\"]`)        .classList.add(\"active\");    }\n    // Set the desired size of the control.    options.setDesiredControlSize({ width: 350, height: 60 });\n    // Attach click event listeners to each button    document.querySelectorAll(\"button\").forEach(button =>      button.addEventListener(\"click\", event => {        const value = event.target.dataset.value;        // Update the document in the content source with the selected value        options          .updateDocument({            operations: [              {                opType: \"set\",                fieldPath: options.fieldPath,                modelField: options.modelField,                field: { type: options.fieldModel?.type ?? \"string\", value }              }            ]          })          // Highlight the selected emoji after content has been updated          .then(() => {            document              .querySelectorAll(\"button\")              .forEach(button => button.classList.remove(\"active\"));            document              .querySelector(`button[data-value=\"${value}\"]`)              .classList.add(\"active\");          })          .catch(err => {            console.error(\"Could not update emoji field\", err);          });      })    );  }};\n```\n\nExample:\n```text\nmodule.exports = {  entry: './index.tsx',  output: {    path: path.resolve(__dirname, 'dist'),    filename: 'index.js'  },\n  // decrease bundle size by using React as external dependency  externals: {    react: 'React',    'react-dom': 'ReactDOM'  },  externalsType: 'global'};\n```\n\nExample:\n```text\nimport * as React from \"react\";import * as ReactDOM from \"react-dom/client\";\nconst Emojis = [  { name: \"grinning\", emoji: \"😃\" },  { name: \"slightly_smiling_face\", emoji: \"🙂\" },  { name: \"neutral_face\", emoji: \"😐\" },  { name: \"slightly_frowning_face\", emoji: \"🙁\" },  { name: \"frowning_face\", emoji: \"☹️\" }];\nfunction Component() {  const [value, setValue] = React.useState(\"\");\n  React.useEffect(() => {    // Safely initialize the stackbit object    if (!window.stackbit) {      window.stackbit = {};    }\n    const handler = (options) => {      setValue(options.documentField?.value ?? \"\");\n      if (options.init) {        // Set the desired size of the control.        options.setDesiredControlSize({ width: 350, height: 60 });      }    };\n    if (window.stackbit.options) {        window.stackbit.options.setDesiredControlSize({ width: 100, height: 600 });        handler(window.stackbit.options);    }    window.stackbit.onUpdate = handler;\n    return () => {        delete window.stackbit!.onUpdate;    };  }, []);\n  return (    <div class=\"grid\">      {Emojis.map(({ emoji, name }) => (        <button          key={name}          className={value === name ? \"active\" : \"\"}          onClick={() => {            const options = window.stackbit.options;            if (!options) {                return;            }            options.updateDocument({              operations: [                {                  opType: \"set\",                  fieldPath: options.fieldPath,                  modelField: options.modelField,                  field: {                    type: options.fieldModel?.type ?? \"string\",                    value                  }                }              ]            }).catch((err) => {              console.error(\"Could not update emoji field\", err);            });          }}        >          {emoji}        </button>      ))}    </div>  );}\nconst root = document.getElementById(\"root\") ?? document.body;ReactDOM.createRoot(root).render(<Component />);\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.370Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":8,"totalLines":65,"estimatedTokens":3665}}185{"id":"doc-launchdarkly_integration_netlify_docs-958eca39","source":"documentation","title":"LaunchDarkly integration | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/setup-guides/launchdarkly-integration","text":"Example:\n```text\nnpm i @netlify/launchdarkly-server-sdk\n```\n\nExample:\n```text\nyarn add @netlify/launchdarkly-server-sdk\n```\n\nExample:\n```text\nimport { init as initLD } from \"@netlify/launchdarkly-server-sdk\";\nexport default {  async fetch(request: Request, env: Bindings): Promise<Response> {    const clientSideID = \"my-client-side-id\";    const flagKey = \"enableMyNewFeature\";    const context = { kind: \"user\", key: \"my-user-key-1\" };\n    const client = initLD(clientSideID);    await client.waitForInitialization();    const flagValue = await client.variation(flagKey, context, false);\n    return new Response(`${flagKey}: ${flagValue}`);  }};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.371Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":3,"totalLines":19,"estimatedTokens":167}}186{"id":"doc-how_visual_editor_works_netlify_docs-f637c7e7","source":"documentation","title":"How Visual Editor works | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/concepts/how-visual-editor-works","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Working modes Start with local development Visual Editor development server Project requirements Structured content Visual Editor configuration Content source connections Content editing Two-way content sync Traditional CMS editing Basic page editing Advanced editing Reusable content Collaboration Service provisioning Content publishing Next steps Get started tutorial Explore documentation On this page Overview Working modes Start with local development Visual Editor development server Project requirements Structured content Visual Editor configuration Content source connections Content editing Two-way content sync Traditional CMS editing Basic page editing Advanced editing Reusable content Collaboration Service provisioning Content publishing Next steps Get started tutorial Explore documentation For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Concepts / How Visual Editor works Copy page View as Markdown Copy as Markdown View as Markdown Walk through the core concepts of how Visual Editor works by following a developer's typical journey. Understanding how Visual Editor works is easiest when we follow a developer's typical journey, where each step builds on concepts and practices from those before it. Try it yourself You can put many of the concepts in this guide into action by following the getting started tutorial. Working modesSection titled “Working modes” You can use the visual editor in local development mode or in cloud setup mode. Start with local developmentSection titled “Start with local development” Developers typically start by working locally to build out a visual editing experience to suit their project's needs, while collaborating with content editors occurs in the cloud, which is covered near the end of this guide. Learn more about Local Development→ Visual Editor development serverSection titled “Visual Editor development server” Working locally with Visual Editor is made possible by using the CLI. The stackbit dev command runs in parallel with your site's development server to create a visual editing environment that enables developers to prepare a site before bringing in content editors. See the CLI reference→ Project requirementsSection titled “Project requirements” Visual Editor is fully composable, which means that most content sources and site frameworks can be supported (with varying levels of required configuration). Although Visual Editor services a large variety of sites, the one thing all sites have in common — what we consider to be the sole prerequisite — is that content must be structured and separated from code. We think of this as having a content-driven architecture. Read more on Content-Driven Development→ Structured contentSection titled “Structured content” For Visual Editor to be able to empower editors to change content, that content must be structured, which means it has a predictable shape, as defined by a content schema. Visual Editor will inherit content schema when it is defined in the source. When Visual Editor can't infer the schema (e.g. file-based content), you must provide a schema definition through Visual Editor configuration. Structured content requirements→ Visual Editor configurationSection titled “Visual Editor configuration” Visual Editor’s behavior for any given project is controlled by the configuration file, stackbit.config.js|ts. Configuration is how Visual Editor knows how to retrieve and store content, which content models represent pages, how editing features should work, and so on. See the config reference→ Content source connectionsSection titled “Content source connections” Perhaps the most critical configuration property is identifying the source(s) of a site's content, which is (usually) done through the contentSources config property. Each content source implements Visual Editor’s Content Source Interface, the mechanism that enables two-way content sync between Netlify and the source. Learn about Content Source Interface→ Content editingSection titled “Content editing” Once a site is properly configured, its content can be immediately edited through Visual Editor. Two-way content syncSection titled “Two-way content sync” One of the most powerful capabilities of Visual Editor is its two-way content synching mechanism, which provides the ability changes from Visual Editor that get saved back to the content source. Update content in Visual Editor when changes are made directly at the source. Automatically update the site preview when content changes have been made. Dive deep into Two-Way Content Sync→ Traditional CMS editingSection titled “Traditional CMS editing” When a content source is properly configured, all the models within the source will be available to edit within Visual Editor’s content editor panel. When working with content from a headless CMS, this requires no additional configuration, as Visual Editor can automatically detect content models and fields from the CMS. Learn more about the content editor panel→ Basic page editingSection titled “Basic page editing” To be able to edit with the page editor panel, you must tell Visual Editor which models represent pages. This is handled by content source modules. See `contentSources` property reference→ Advanced editingSection titled “Advanced editing” Editing can then be taken to the next level by enabling editing to click on elements in the preview and make the changes inline. This is made possible by annotating components by adding specific data attributes to inform Visual Editor how the structure of your content maps the elements in the DOM. More on inline editing→ Reusable contentSection titled “Reusable content” As powerful as inline editing is, it's made even more powerful when content editors can reuse content. Although there are multiple ways to do this, Visual Editor’s content presets feature tends to boost editors' productivity the most. Learn more about Content Presets→ CollaborationSection titled “Collaboration” When you’re ready to collaborate with content editors in the containerized version of your visual editor in the cloud, you can set up your site for visual editing. You can do this in these your site’s Git repository Enable visual editing for an existing site deployed through Netlify Service provisioningSection titled “Service provisioning” The visual editor provisions services based on your site and configuration. While many of your services will already be configured, the visual editor does the visual editor deploys your site to a [site].stackbit.app site on Netlify, unless your organization is configured to skip this step. visual editor creates a container that powers the editing experience for your site. This replaces stackbit dev, used when working locally. Provisioning configuration options→ Content publishingSection titled “Content publishing” Once editors have been added to Visual Editor project, they can begin publishing content to production. This process can also be customized, though it is through the visual editor settings. More on Publishing and Git Workflows→ Next stepsSection titled “Next steps” This concludes the overview on how Visual Editor works. Here are a few suggestions on what to do next. Get started tutorialSection titled “Get started tutorial” Follow the get started tutorial if you haven't. This provides a quick way to put some of these concepts into action. Choose a get started tutorial→ Explore documentationSection titled “Explore documentation” We've covered a lot of the basics, but there are other features and concepts to explore. Explore feature guides→ Last 14, 2025 PreviousConcepts overviewNextStructured content Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.372Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2579}}187{"id":"doc-optimizely_edge_delivery_extension_netlify_docs-aa69ae94","source":"documentation","title":"Optimizely Edge Delivery extension | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/setup-guides/optimizely-edge-delivery","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Install & use Install & use Overview Extensions and integrations Build plugins Setup guides Netlify App for Slack Netlify Email integration Auth0 Contentful integration GPT action LaunchDarkly integration Optimizely Edge Delivery PlanetScale integration Supabase integration Stripe Projects On this page Overview How it works Before you begin Get started with Optimizely Edge Delivery Modify your configuration Disable the extension on your site Uninstall the extension On this page Overview How it works Before you begin Get started with Optimizely Edge Delivery Modify your configuration Disable the extension on your site Uninstall the extension For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Install And Use / Setup Guides / Optimizely Edge Delivery extension Copy page View as Markdown Copy as Markdown View as Markdown Optimizely enables teams to manage and optimize their digital content using experimentation features. How it worksSection titled “How it works” After you install the Optimizely Edge Delivery extension for your team and enable it on your Netlify site, the extension automatically injects edge functions into your site during the build process. The edge function is named optimizely-edge-delivery_run-experiment. The edge function leverages the Optimizely Edge Delivery SDK, which allows you to run experiments at the edge without relying on a client-side script. Before you beginSection titled “Before you begin” To integrate Optimizely with your Netlify site, make sure you have the Optimizely account a deployed site on Netlify Get started with Optimizely Edge DeliverySection titled “Get started with Optimizely Edge Delivery” As a Team Owner, you can install the Optimizely Edge Delivery extension for your team to to the Optimizely Edge Delivery extension details page. On the details page, select Install. From your team’s Sites list, select the site you plan to use with Optimizely, and navigate to Project configuration > Build & deploy > Optimizely Edge Delivery. Select Enable and follow the prompts to configure and enable Optimizely. Select Save. Select Redeploy The extension automatically creates site environment variables for the configuration values you NETLIFY_OPTIMIZELY_EDGE_DELIVERY_ENABLED NETLIFY_OPTIMIZELY_EDGE_DELIVERY_SNIPPET_ID You can review these variables at any time by navigating to Project configuration > Environment variables. Modify your configurationSection titled “Modify your configuration” To update the Optimizely Edge Delivery configuration settings for your the Netlify UI, navigate to Project configuration > Build & deploy > Optimizely Edge Delivery for the site you want to edit. Update your configuration. Select Save. Select Redeploy Alternatively, you can update the environment variables directly and then redeploy. Disable the extension on your siteSection titled “Disable the extension on your site” To disable the Optimizely Edge Delivery extension for your the Netlify UI, navigate to Project configuration > Build & deploy > Optimizely Edge Delivery for the site you want to disable the Optimizely Edge Delivery extension. Select Disable. Redeploy your site, navigate to Deploys select Trigger deploy with the clear cache option. Alternatively, you can remove the environment variables directly and then redeploy. Uninstall the extensionSection titled “Uninstall the extension” As a Team Owner, to uninstall the Optimizely Edge Delivery to the Optimizely Edge Delivery extension details page. On the details page, navigate to the Danger zone section, and then select Uninstall this extension. Last 14, 2025 PreviousLaunchDarkly integrationNextPlanetScale integration Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.372Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1299}}188{"id":"doc-git_branching_netlify_docs-754cc38a","source":"documentation","title":"Git branching | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/cloud-setup/git-branching","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Working branch External updates Content publishing branch (Git CMS only) Branch synchronization (Git CMS only) Configure branches Change working branch On this page Overview Working branch External updates Content publishing branch (Git CMS only) Branch synchronization (Git CMS only) Configure branches Change working branch For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Cloud Setup / Git branching Copy page View as Markdown Copy as Markdown View as Markdown The visual editor interacts with branches in your remote Git repository when in cloud setup mode (not local development). In this mode, the visual editor works with two Git branches — working branch and a content publishing branch. Working branchSection titled “Working branch” The visual editor uses the working branch to run your site in the container. The working branch is the branch that content editors work with. This branch name defaults to preview, which gets automatically created when visual editing is enabled for a site. Learn more about changing the working branch. External updatesSection titled “External updates” Visual Editor uses webhooks to listen for updates to the working branch in its remote repository, then immediately updates the local branch. Content publishing branch (Git CMS only)Section titled “Content publishing branch (Git CMS only)” The visual editor uses the content publishing branch to merge or send a pull request with content changes. The content publishing branch defaults to the default branch of the repository (e.g. main or master) when enabling visual editing for the first time. For sites with content managed from a headless CMS, configuring a content publishing branch is not needed because content changes are pushed directly to the content source(s). Branch synchronization (Git CMS only)Section titled “Branch synchronization (Git CMS only)” The content publishing branch is only used during the publishing process. Keeping the working branch in sync with changes committed to the content publishing branch must be handled separately. This should not be needed if content changes are made from the visual editor exclusively. Configure branchesSection titled “Configure branches” You can override these defaults from your visual editor settings or when you enable visual editing for the first time. Change working branchSection titled “Change working branch” As a Developer or Owner, you can adjust the working branch of your site for use with the visual editor. Go to your visual editor your site workspace in the visual editor, select the options icon next to your site name and select Visual editor settings from the drop-down menu. From your Site overview where you manage site deploys, go to Project configuration > Visual Editor > General. Then select Edit. Choose an existing branch to use as the working branch. Note that you will not find the target branch as an option. You must work on a separate branch. Before you start editing and publishing, we recommend you confirm you’re using the correct branches. Last 14, 2025 PreviousContainerNextImport Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.373Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1439}}189{"id":"doc-local_development_netlify_docs-6e9f6686","source":"documentation","title":"Local development | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/local-development","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Prerequisites How to use Run Next.js locally Install & run the CLI How it works Things to know Work with cookies Troubleshooting tips On this page Overview Prerequisites How to use Run Next.js locally Install & run the CLI How it works Things to know Work with cookies Troubleshooting tips For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Local development Copy page View as Markdown Copy as Markdown View as Markdown Develop and test your Visual Editor site in your local development environment. Visual Editor supports developing your project's code locally, including the ability to view your running local site inside Visual Editor’s user interface with full visual editing. This is a powerful way to iterate quickly when developing your site - especially when you're making changes to content models or annotations and want to immediately test these changes in the visual editing environment. Note that viewing your local site within Visual Editor webapp is optional. You can develop locally with just Next.js, without having to run our tooling for visual editing. PrerequisitesSection titled “Prerequisites” Operating , Windows or Linux (the same as Next.js supports. Node or later (which comes packaged with npm v6 or later). Chrome is currently required. Support for other browsers is planned. Tip You may want to use a tool like nvm to run your local site with the best matching Node and NPM versions, while not affecting other installed versions. How to useSection titled “How to use” Run Next.js locallySection titled “Run Next.js locally” Once the project's repository was transferred to you, you can clone and run the project locally. Option netlify clone (recommended) The simplest way to clone and link your project is with the Netlify CLI. Use the repository URL shown in the Settings windownetlify clone owner/repository-namecd <repository-name>git checkout <branch>nvm use # Optional - only if you're using nvm!npm installnpm run dev Or with the full repository windownetlify clone git@github.com:owner/repository-namecd <repository-name>git checkout <branch>nvm use # Optional - only if you're using nvm!npm installnpm run dev Option clone with Git The Settings dialog will show you the manual git commands to clone the project. The commands are similar to the below, with the repository URL already filled and for the preview branch - but you can create or pick any other branch to fit your needs. Terminal windowgit clone git@github.com:<user>/<repository-name>cd <repository-name>git checkout <branch>nvm use # Optional - only if you're using nvm!npm installnpm run dev At this point, Next.js should be running in dev mode on Check it out! You can already make changes to code & content files, and Next.js will refresh the page automatically. Now, let's leave this process running and get your local site displayed within Visual Editor webapp. Install & run the CLISection titled “Install & run the CLI” Install the Stackbit CLI for Visual Editor from the windownpm install -g @stackbit/cli The above command specifies the -g flag to install the package globally and have its executable available everywhere. This may require installing with sudo, depending on your setup (not needed when using nvm). Run from your local repository's windowstackbit dev or windowstackbit dev -d <path-to-dir> Open http://localhost:8090/_stackbit in your browser. This will redirect you straight to Visual Editor editor showing your local site. You can bookmark this URL if you want. You can now highlight elements, make content changes that will get reflected in your local files, or make code changes locally and see them reflected immediately. That's all there is to it! Make sure to read things to know. If something's wrong, jump to troubleshooting tips below. How it worksSection titled “How it works” By default, visual editor sites are backed by a remote container managed by us, which is running the site’s preview branch. What you're seeing in the webapp is that container's output, loaded through an code iframe and proxied by our servers to provide the highlighting and editing experience. Everyone working on the same site’s visual editing experience locally work with that container. In local development mode, the webapp loads the iframe directly from your local proxy (the stackbit dev process). This proxy serves what your local SSG is rendering, but adds a layer on top to support visual highlights, authenticated content changes, and more. The URL of the page (e.g. https://create.netlify.com/studio/7620acff1hs75ak19ad) is unique to you and is hard-wired to communicate with the stackbit dev process running on your local machine. It will only work correctly when opened on your machine. Things to knowSection titled “Things to know” Important There is no association between local development mode and the regular Visual Editor project you've created through the UI. You can use local development to edit any repository that you have cloned locally.Content editors and other Developers should keep working with the regular project accessible from the dashboard, as usual. Regular Visual Editor projects always reflect the code in the project's preview branch. When you push code to that branch by whatever means, the webapp will update automatically and changes will be visible to anyone currently working on the project. So make sure to test beforehand. If you have multiple projects in Visual Editor, you can use local development to work with any of them. To switch between code repositories, stop the stackbit dev process and re-run it from the relevant directory. shown URL does not change per repository. Also note the following the webapp is in local development mode, the buttons to share & publish are disabled, as these actions are not applicable. Logs are not shown in the webapp. Check the logs locally (both the web server and stackbit dev emit logs to the terminal). As mentioned above, you decide whether and when to commit and push, and which code repository and branch to work with. stackbit dev treats the runnable directory as the directory in which the command was run. You can change this with the --dir (alias: -d) option. development, it's natural to make mistakes when defining models or manually editing content files, which can result in rendering errors and stuff generally not working. It's recommended to regularly run stackbit validate when making such changes to get a verbose check-up of content & models in your code. Work with cookiesSection titled “Work with cookies” When working with cookies in your application, they are often set for the domain and port on which your development server is running (e.g. ). Because Visual Editor Dev proxies your dev server through local port 8090, your cookies need to run on You can achieve this by setting the following windowSameSite=lax Troubleshooting tipsSection titled “Troubleshooting tips” If the webapp keeps showing \"Connecting to local dev environment\" with a loading message means that the webapp cannot connect to the local stackbit dev process. Here's what to sure stackbit dev is working on your local machine and its log shows no errors. Make sure you're using Google Chrome as your browser, on that same machine. If you use multiple user accounts on Visual Editor (this is normally not required, as the same user can be a member of multiple organizations): re-run stackbit dev after logging-in to the desired user, and click the shown URL to open the webapp. When the connection to stackbit dev is re-established, the webapp should refresh automatically. If nothing of the above works, re-run stackbit dev --log-level debug and share the output with us. If you're seeing \"Failed to connect to your site's local server\": This means that stackbit dev is working, but cannot access your Next's local dev server (launched with npm run dev). This usually happens only when Next.js is down or unresponsive. Make sure that Next.js is running in its default port (3000). Look for errors in the Next.js terminal output. Try to restart Next.js. Hot module reloading in dev mode can sometimes get the server unstable. Last 19, 2025 PreviousGlobal stylesNextLocalization Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nnetlify clone owner/repository-namecd <repository-name>git checkout <branch>nvm use # Optional - only if you're using nvm!npm installnpm run dev\n```\n\nExample:\n```text\nnetlify clone git@github.com:owner/repository-namecd <repository-name>git checkout <branch>nvm use # Optional - only if you're using nvm!npm installnpm run dev\n```\n\nExample:\n```text\ngit clone git@github.com:<user>/<repository-name>cd <repository-name>git checkout <branch>nvm use # Optional - only if you're using nvm!npm installnpm run dev\n```\n\nExample:\n```text\nnpm install -g @stackbit/cli\n```\n\nExample:\n```text\nstackbit dev\n```\n\nExample:\n```text\nstackbit dev -d <path-to-dir>\n```\n\nExample:\n```text\nSameSite=lax\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.375Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":7,"totalLines":38,"estimatedTokens":2890}}190{"id":"doc-visual_editor_walkthrough_help_netlify_docs-59677719","source":"documentation","title":"Visual editor walkthrough help | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/get-started/visual-editor-walkthrough-help","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Before you begin Step site to Netlify Step up the preview environment Step visual editing Unlock visual editing for Git CMS Unlock visual editing for headless CMS Step 5. Restart the preview Step 6. Try the visual editor Next steps On this page Overview Before you begin Step site to Netlify Step up the preview environment Step visual editing Unlock visual editing for Git CMS Unlock visual editing for headless CMS Step 5. Restart the preview Step 6. Try the visual editor Next steps For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\";import { GitContentSource } from \"@stackbit/cms-git\"; export default defineStackbitConfig({ // ... contentSources: [ new GitContentSource({ , contentDirs: [\"content\"], models: [ { name: \"Post\", urlPath: \"/{slug}\", // Tell the visual editor where to find content filePath: \"content/pages/{slug}.md\", fields: [{ name: \"title\", type: \"string\", }] } ], }) ]}); For this content file, the visual editor would infer a document looking like: { // There would be more fields but the \"fields\" key is what I was trying to highlight \"id\": \"/content/pages/my-first-post.md\", \"fields\": [ { name: \"title\", type: \"string\", , value: \"My post title\" }, { name: \"slug\", type: \"slug\", value: \"my-first-post\", // not sure if the type here is true { name: \"markdown_content\", value: \"My post body\", type: \"markdown_content\" } ]} Next, tell the visual editor which models (structured data objects) represent pages. For example, add the type property: // stackbit.config.ts import { defineStackbitConfig } from \"@stackbit/types\"; import { GitContentSource } from \"@stackbit/cms-git\"; export default defineStackbitConfig({ // ... contentSources: [ new GitContentSource({ , contentDirs: [\"content\"], models: [ { name: \"Post\", type: \"page\", urlPath: \"/{slug}\", filePath: \"content/pages/{slug}.md\", fields: [{ name: \"title\", type: \"string\", }] } ], }) ] }); To let the visual editor know where your content lives, specify the URL path for your pages. This connects page models to specific URLs. There are two ways to do this. You can add a siteMap function which offers more control (most commonly used) or take a static route and specify the urlPath property for each page model in the modelExtensions property. Example specifying urlPathSection titled “Example specifying urlPath” In this example, you specify urlPath property for each model defined in your modelExtensions // stackbit.config.tsimport { defineStackbitConfig, SiteMapEntry } from \"@stackbit/types\"; export default defineStackbitConfig({ // ... contentSources: [ new GitContentSource({ , contentDirs: [\"content\"], models: [ { name: \"Post\", type: \"page\", // Static URL path derived from the \"slug\" field urlPath: \"/{slug}\", filePath: \"content/pages/{slug}.md\", fields: [{ name: \"title\", type: \"string\", }] }, // ... ], }) ],}); Unlock visual editing for headless CMSSection titled “Unlock visual editing for headless CMS” In general, the visual editor automatically inherits the schema (collection of models) from the API CMS. However, most Headless CMS options don’t have the concept of a “page” in their content model so you need to tell the visual editor what counts as a page with the modelExtensions property. Quick overview - Models for visual editor Key terms for how the visual editor structures : Represent the structure of content.There are three models represent the shape of a page. Data models represent content meant to stand alone or be referenced from a page. Object models represent repeatable content embedded in another model. For example, elements on a web page can be modeled in this more about how to model content for a headless CMS in these structured content docs or in the examples below in this setup guide. To configure the page editor for a site using headless to your site’s stackbit.config.ts file and tell the visual editor which of your models (or structured data objects) are pages. For example, if your CMS has a model called post , then you can indicate it’s a page model by implementing the modelExtensions property with { name: \"post\", type: \"page\" }: // stackbit.config.ts import { defineStackbitConfig } from \"@stackbit/types\"; export default defineStackbitConfig({ // ... modelExtensions: [ // Extend the \"page\" and \"post\" models by defining them as page models { name: \"post\", type: \"page\" } ] }); Now that we know which models are pages, we need to connect them to URL routes so the visual editor knows where your site’s editable pages are. To connect page models to URLs, you can add a siteMap function which offers more control (most commonly used) or take a static route and specify the urlPath property for each page model in the modelExtensions property. Step 5. Restart the previewSection titled “Step 5. Restart the preview” Confirm you have merged changes you made in stackbit.config.ts into the visual editor's working branch, which is preview by default, on your site’s remote repository on GitHub or BitBucket. If the Preview Server for the visual editor was already running, it will automatically restart. If the Preview Server was not already running, it will start automatically when you open visual editor. You can verify that your Preview Server has restarted by going to Preview Servers. Step 6. Try the visual editorSection titled “Step 6. Try the visual editor” After the Preview Server has successfully restarted, you can try the visual editor. From your site overview, select Open visual editor. Checkpoint You should now be able to open the visual editor and use the page editor to make changes to your site.If this is not true, let us know in the docs feedback form at the bottom of this page. More details are helpful. Next stepsSection titled “Next steps” For next steps, you can customize the visual editor further for your team’s workflow and explore its advanced features. Developers typically further customize visual editing inline editing to make changes directly in the preview Configuring asset sources Learn more about how to customize the visual editing experience. Last 14, 2025 PreviousManage visual editingNextTroubleshoot visual editor setup Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n---type: Post # The `type` property is a reserved word that tells the visual editor which model this content file belongs totitle: My post title---\nMy post body\n```\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";import { GitContentSource } from \"@stackbit/cms-git\";\nexport default defineStackbitConfig({  // ...  contentSources: [    new GitContentSource({      rootPath: __dirname,      contentDirs: [\"content\"],      models: [        {          name: \"Post\",          urlPath: \"/{slug}\",          // Tell the visual editor where to find content          filePath: \"content/pages/{slug}.md\",          fields: [{ name: \"title\", type: \"string\", required: true }]        }      ],    })  ]});\n```\n\nExample:\n```text\n{  // There would be more fields but the \"fields\" key is what I was trying to highlight  \"id\": \"/content/pages/my-first-post.md\",  \"fields\": [    { name: \"title\", type: \"string\", required: true, value: \"My post title\" },    { name: \"slug\", type: \"slug\", value: \"my-first-post\",    // not sure if the type here is true    { name: \"markdown_content\", value: \"My post body\", type: \"markdown_content\" }  ]}\n```\n\nExample:\n```text\n// stackbit.config.ts    import { defineStackbitConfig } from \"@stackbit/types\";    import { GitContentSource } from \"@stackbit/cms-git\";\n    export default defineStackbitConfig({      // ...      contentSources: [        new GitContentSource({          rootPath: __dirname,          contentDirs: [\"content\"],          models: [            {              name: \"Post\",              type: \"page\",              urlPath: \"/{slug}\",              filePath: \"content/pages/{slug}.md\",              fields: [{ name: \"title\", type: \"string\", required: true }]            }          ],        })      ]    });\n```\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig, SiteMapEntry } from \"@stackbit/types\";\nexport default defineStackbitConfig({  // ...  contentSources: [    new GitContentSource({      rootPath: __dirname,      contentDirs: [\"content\"],      models: [        {          name: \"Post\",          type: \"page\",          // Static URL path derived from the \"slug\" field          urlPath: \"/{slug}\",          filePath: \"content/pages/{slug}.md\",          fields: [{ name: \"title\", type: \"string\", required: true }]        },        // ...      ],    })  ],});\n```\n\nExample:\n```text\n// stackbit.config.ts import { defineStackbitConfig } from \"@stackbit/types\";\n export default defineStackbitConfig({   // ...   modelExtensions: [     // Extend the \"page\" and \"post\" models by defining them as page models     { name: \"post\", type: \"page\" }   ] });\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.376Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":6,"totalLines":38,"estimatedTokens":2844}}191{"id":"doc-netlify_email_integration_netlify_docs-4c985501","source":"documentation","title":"Netlify Email Integration | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/setup-guides/email-integration","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Install & use Install & use Overview Extensions and integrations Build plugins Setup guides Netlify App for Slack Netlify Email integration Auth0 Contentful integration GPT action LaunchDarkly integration Optimizely Edge Delivery PlanetScale integration Supabase integration Stripe Projects On this page Overview Before you begin Supported email providers Enable Netlify Email Integration for your site Enable with the Netlify UI Enable with netlify.toml Required environment variables Add email templates Add a template file Add HTML to the template Style the template Create a template with MJML Preview email templates Send a test email from the Preview UI Trigger an email from your code Create a function to send the email Call the function from an event Add attachments to your email Limitations On this page Overview Before you begin Supported email providers Enable Netlify Email Integration for your site Enable with the Netlify UI Enable with netlify.toml Required environment variables Add email templates Add a template file Add HTML to the template Style the template Create a template with MJML Preview email templates Send a test email from the Preview UI Trigger an email from your code Create a function to send the email Call the function from an event Add attachments to your email Limitations For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending </h1> <p>We hope you enjoy our super simple emails!</p> <p>Thanks for subscribing!</p> </body></html> Style the templateSection titled “Style the template” You can also add custom styling to your templates. To do this, add inline CSS blocks using the style attribute inside the HTML elements of your template file. <html> <body style=\" font-family: 'Open Sans', 'Helvetica Neue', sans-serif; auto; \" > <div style=\" \" > <h1>{{name}} has RSVP'd</h1> <button style=\"border-radius: 10px;\"> Visit dashboard </button> </div> </body></html> Create a template with MJMLSection titled “Create a template with MJML” The Netlify Email Integration supports templates created with MJML. MJML enables you to create templates that are responsive and compliant across most browsers. To create an email template using MJML, save your template file as index.mjml instead of index.html. Visit the MJML documentation to learn more about styling your template. Preview email templatesSection titled “Preview email templates” You can preview your email templates during the development process by launching the Preview UI. The Preview UI generates the template-specific code snippets you’ll need to send a request to the email handler when you trigger the email. Use the Netlify CLI to launch the Preview UI and generate this code. Ensure you have the latest version of Netlify CLI windownpm install netlify-cli -g Build your project. Terminal windownetlify build Launch Netlify Dev to start a development environment that can run your email windownetlify dev Visit http://localhost:8888/.netlify/functions/emails to launch the Preview UI. The preview endpoint is not available in production and is only made available locally through Netlify Dev. Select your email template from the template list. Send a test email from the Preview UISection titled “Send a test email from the Preview UI” When you launch the preview, you can send a test email directly from the Preview UI. To trigger the test the email template you plan to test from the available templates. Optionally, enter any parameters you’d like to preview. Select Send test email. Enter your subject, to, and from parameters. Select Send, which will send the email from your email provider. Trigger an email from your codeSection titled “Trigger an email from your code” When you preview your email template, Netlify generates two code snippets that you can use to trigger an email: @netlify/emails: snippet that utilizes a package that contains the raw fetch route and an environment variable To trigger an email directly from your project code, copy and paste your preferred snippet into your project and populate the parameters for your email. Create a function to send the emailSection titled “Create a function to send the email” Because the snippet generated in the preview contains an environment variable, NETLIFY_EMAILS_SECRET, we recommend pasting the code snippet into a Netlify Function to avoid sharing sensitive information in client-side code. You can learn more about the format of functions on the get started with functions. The function file should be in your netlify/functions directory. Following the fetch code example below, this example file’s path would be netlify/functions/triggerSubscribeEmail.ts. import type { Handler } from \"@netlify/functions\";import fetch from \"node-fetch\"; const = async function(event) { if (event.body === null) { return { , (\"Payload required\"), }; } const requestBody = JSON.parse(event.body) as { }; //automatically generated snippet from the email preview //sends a request to an email handler for a subscribed email await fetch(`${process.env.URL}/.netlify/functions/emails/subscribed`, { headers: { \"netlify-emails-secret\": process.env.NETLIFY_EMAILS_SECRET as string, }, method: \"POST\", ({ , , subject: \"You've been subscribed\", parameters: { , , }, }), }); return { , (\"Subscribe email sent!\"), };}; export { handler }; Next, you'll add an event in your code to call this function. Call the function from an eventSection titled “Call the function from an event” There are many approaches you can take to triggering an email. For user clicks a button requesting information, subscribing to a newsletter, or updating their profile. A user scrolls to the bottom of a blog post so you trigger an email to send them more information on that post subject or other posts. A data event has reached a certain amount and you would like an email sent to notify your users. Here’s an example of the code to attach the email trigger to a Subscribe button in a Next.js app. In this React example, the parameters for the template are set using user input from the form on the page. With this process, you can populate the parameters of your email templates with any data being passed to your site, like a form or data from API calls to a user database. export default function Subscribe() { const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => { event.preventDefault(); const target = event.target as typeof event.target & { name: { }; email: { }; }; const data = { , }; //call to the Netlify Function you created fetch(\"./.netlify/functions/triggerSubscribeEmail\", { method: \"POST\", ({ , , inviteeEmail: \"info@netlify.com\" }) }); }; return ( <div className=\"subscribe-form-container\"> <form onSubmit={handleSubmit}> <label htmlFor=\"name\">Name</label> <input type=\"text\" id=\"name\" name=\"name\" required /> <label htmlFor=\"email\">Email</label> <input type=\"text\" id=\"email\" name=\"email\" required /> <button type=\"submit\">Subscribe</button> </form> </div> );} When the event is triggered, this invokes the function and the fetch call to an email handler. This handler prompts the email API service you configured to send the email. Add attachments to your emailSection titled “Add attachments to your email” When sending messages, you can also specify any files you’d like to attach. Make sure any files you plan to attach to an email are included when the function that sends the email is built and deployed. For example, to attach a PDF file saved in an assets directory, the project file structure could include a section like this: ├─ netlify/│ └─functions/│ └─ function.js│ └─ assets/│ └─ example.pdf└─package.json In this example, any PDF files in the assets directory would be included with the function using this netlify.toml entry: [functions][function.\"function\"] included_files = [\"./nelify/functions/assets/*.pdf\"] You can learn more in our blog post about including files in serverless functions. Using the snippet generated during the email preview, add the attachments property to the request body. The attachments property is an array that may contain three properties to attach your , filename, and type. Property NameTypeDescriptionRequiredcontentstringBase64 encoded string of the fileYesfilenamestringThe name of the file as it will appear in the emailYestypestringThe MIME type of content you are attachingYes, if Postmark Using the example project setup above, the following handler function parses the PDF file saved in the assets directory. Nested in the body object is an attachments array that lists the content, filename, and type properties for that file. import type { Handler } from \"@netlify/functions\";import fetch from \"node-fetch\";import {readFileSync} from \"fs\";import {resolve} from \"path\"; const = async () => { const file = readFileSync(resolve(\"./assets/example.pdf\"), \".\").toString(\"base64\"); const response = await fetch( `${process.env.URL}/.netlify/functions/emails/forgotten-password`, { headers: { \"netlify-emails-secret\": process.env.NETLIFY_EMAILS_SECRET, }, method: \"POST\", ({ from: \"sender@myemailsender.com\", cc: \"recipient@youremail.com\", to: \"recipient@youremail.com\", subject: \"Password Reset\", attachments: [ { , filename: \"example.pdf\", type: \"pdf\", } ], parameters: { name: \"Test\", } }) } ); const responseBody = await response.json(); return ( , (responseBody) );}; export { handler }; Refer to your email provider’s documentation to verify which types of content are valid for an attachment. Mailgun Postmark Sendgrid LimitationsSection titled “Limitations” Functions that call other functions on password-protected sites will get an error when calling the next function. If you’re using a password-protected site, you’ll likely receive a 401 error from your function that calls the email function. To avoid receiving this error, you need to forward the cookie from the initial function on to the email function. Here is an example of a workaround for this cookie = event.headers[\"Cookie\"] || event.headers[\"cookie\"]; // Send netlify email with fetch const response = await fetch( `${process.env.URL}/.netlify/functions/emails/the-template-name`, { method: \"POST\", headers: { cookie, \"netlify-emails-secret\": process.env.NETLIFY_EMAILS_SECRET as string, }, Last 14, 2025 PreviousNetlify App for SlackNextAuth0 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n[[plugins]]  package = \"@netlify/plugin-emails\"\n```\n\nExample:\n```text\nrepository-root or base directory/├─ emails/│  └─ subscribed/│   └─ index.html└─\n```\n\nExample:\n```text\n<html>  <body>    <h1>Welcome, {{name}}</h1>    <p>We hope you enjoy our super simple emails!</p>    <p>Thanks for subscribing!</p>  </body></html>\n```\n\nExample:\n```text\n<html>  <body    style=\"      font-family: 'Open Sans', 'Helvetica Neue', sans-serif;      margin: 0 auto;    \"  >    <div      style=\"        background-color: white;        display: inline-block;        text-align: center;      \"    >      <h1>{{name}} has RSVP'd</h1>      <button style=\"border-radius: 10px;\">        Visit dashboard      </button>    </div>  </body></html>\n```\n\nExample:\n```text\nnpm install netlify-cli -g\n```\n\nExample:\n```text\nnetlify build\n```\n\nExample:\n```text\nnetlify dev\n```\n\nExample:\n```text\nimport type { Handler } from \"@netlify/functions\";import fetch from \"node-fetch\";\nconst handler: Handler = async function(event) {  if (event.body === null) {    return {      statusCode: 400,      body: JSON.stringify(\"Payload required\"),    };  }\n  const requestBody = JSON.parse(event.body) as {    subscriberName: string;    subscriberEmail: string;    inviteeEmail: string;  };\n  //automatically generated snippet from the email preview  //sends a request to an email handler for a subscribed email  await fetch(`${process.env.URL}/.netlify/functions/emails/subscribed`, {    headers: {      \"netlify-emails-secret\": process.env.NETLIFY_EMAILS_SECRET as string,    },    method: \"POST\",    body: JSON.stringify({      from: requestBody.inviteeEmail,      to: requestBody.subscriberEmail,      subject: \"You've been subscribed\",      parameters: {        name: requestBody.subscriberName,        email: requestBody.subscriberEmail,      },    }),  });\n  return {    statusCode: 200,    body: JSON.stringify(\"Subscribe email sent!\"),  };};\nexport { handler };\n```\n\nExample:\n```text\nexport default function Subscribe() {  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {    event.preventDefault();    const target = event.target as typeof event.target & {      name: { value: string };      email: { value: string };    };\n    const data = {      subscriberName: target.name,      subscriberEmail: target.email    };    //call to the Netlify Function you created    fetch(\"./.netlify/functions/triggerSubscribeEmail\", {      method: \"POST\",      body: JSON.stringify({        subscriberName: data.subscriberName,        subscriberEmail: data.subscriberEmail,        inviteeEmail: \"info@netlify.com\"      })    });  };  return (    <div className=\"subscribe-form-container\">      <form onSubmit={handleSubmit}>        <label htmlFor=\"name\">Name</label>        <input type=\"text\" id=\"name\" name=\"name\" required />        <label htmlFor=\"email\">Email</label>        <input type=\"text\" id=\"email\" name=\"email\" required />        <button type=\"submit\">Subscribe</button>      </form>    </div>  );}\n```\n\nExample:\n```text\n├─ netlify/│  └─functions/│   └─ function.js│   └─ assets/│     └─ example.pdf└─package.json\n```\n\nExample:\n```text\n[functions][function.\"function\"]  included_files = [\"./nelify/functions/assets/*.pdf\"]\n```\n\nExample:\n```text\nimport type { Handler } from \"@netlify/functions\";import fetch from \"node-fetch\";import {readFileSync} from \"fs\";import {resolve} from \"path\";\nconst handler: Handler = async () => {  const file = readFileSync(resolve(\"./assets/example.pdf\"), \".\").toString(\"base64\");  const response = await fetch(    `${process.env.URL}/.netlify/functions/emails/forgotten-password`,    {      headers: {        \"netlify-emails-secret\": process.env.NETLIFY_EMAILS_SECRET,      },      method: \"POST\",      body: JSON.stringify({        from: \"sender@myemailsender.com\",        cc: \"recipient@youremail.com\",        to: \"recipient@youremail.com\",        subject: \"Password Reset\",        attachments: [            {            content: file,            filename: \"example.pdf\",            type: \"pdf\",          }        ],        parameters: {          name: \"Test\",        }      })    }  );\n  const responseBody = await response.json();\n  return (    statusCode: response.status,    body: JSON.stringify(responseBody)  );};\nexport { handler };\n```\n\nExample:\n```text\nconst cookie = event.headers[\"Cookie\"] || event.headers[\"cookie\"];\n  // Send netlify email with fetch  const response = await fetch(    `${process.env.URL}/.netlify/functions/emails/the-template-name`,    {      method: \"POST\",      headers: {        cookie,        \"netlify-emails-secret\": process.env.NETLIFY_EMAILS_SECRET as string,      },\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.378Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":13,"totalLines":79,"estimatedTokens":4085}}192{"id":"doc-use_git_cms_with_visual_editor_netlify_docs-a2e8a746","source":"documentation","title":"Use Git CMS with Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/content-sources/git","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Example configuration Prerequisites Options assetsConfig contentDirs models rootPath Annotations Limitations On this page Overview Example configuration Prerequisites Options assetsConfig contentDirs models rootPath Annotations Limitations For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\";import { GitContentSource } from \"@stackbit/cms-git\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", contentSources: [ new GitContentSource({ , contentDirs: [\"content\"], models: [ { name: \"Page\", type: \"page\", urlPath: \"/{slug}\", filePath: \"content/pages/{slug}.json\", fields: [{ name: \"title\", type: \"string\", }] } ], assetsConfig: { referenceType: \"static\", staticDir: \"public\", uploadDir: \"images\", publicPath: \"/\" } }) ]}); PrerequisitesSection titled “Prerequisites” The only thing required to work with Git CMS is to install the development dependencies. Terminal windownpm install -D @stackbit/types @stackbit/cms-git OptionsSection titled “Options” Git CMS is unique in that all content modeling must be done within content source configuration. The options to define the schema are documented below. Note that when Visual Editor reads and writes content to your remote repository, it uses the repository URL and branch you define in Git when you configure your project. These values aren’t used in local development because Visual Editor writes content changes to disk when running locally. assetsConfigSection titled “assetsConfig” Defines where local site assets are stored in your project and how other content references these assets. Required? No. : (required) specifies how content files reference asset files. , relative. uploadDir: (required) path inside assetsDir in which to store uploaded assets, relative to either staticDir (for static assets) or assetsDir (for relative assets). Additional properties for static : directory path relative to the project root in which the site framework copies files to the directory that get deployed. from which the static files are publicly available. Additional properties for relative : path to the directory containing all the assets to your project, relative to the project root. Static assetsSection titled “Static assets” Here's an example configuration for this object using static assets from a public/images directory. // stackbit.config.tsexport default defineStackbitConfig({ contentSources: [ new GitContentSource({ assetsConfig: { referenceType: \"static\", staticDir: \"public\", uploadDir: \"images\", publicPath: \"/\" } // ... }) ]}); All assets must be placed under the directory set in staticDir, either directly or in subdirectories. They cannot be colocated with page content or source code. The value is always relative to the root of the project. When the build is run, assets are served from the URL path set by publicPath. The full URLs are constructed as {publicPath}/{file path under staticDir}. With the example configuration above, an image file named public/images/image.png in your repository will be served from the URL /images/image.png. Images uploaded by editors would be saved in {staticDir}/{uploadDir}, or in the above case: {root}/public/images. Relative assetsSection titled “Relative assets” When asset files are colocated with content, use relative references. // stackbit.config.tsexport default defineStackbitConfig({ contentSources: [ new GitContentSource({ assetsConfig: { referenceType: \"relative\", assetsDir: \"src\", uploadDir: \"images\" } // ... }) ]}); assetsDir can include files of different types. However, only files with specific extensions will be treated as assets (png, jpg, jpeg, gif, svg, ico, etc.). Images uploaded by editors would be saved in {assetsDir}/{uploadDir}, or in the above case: {root}/src/images. contentDirsSection titled “contentDirs” Defines directories in which to look for content. Each document is mapped to a model using the value of the type property. Required? Yes. Allowed string representing a directory path, relative to the root of the project. // stackbit.config.tsexport default defineStackbitConfig({ contentSources: [ new GitContentSource({ contentDirs: [\"content\"] // ... }) ]}); modelsSection titled “models” This is your schema definition for all file-based content. Required? Yes. Allowed array of model definitions // stackbit.config.tsexport default defineStackbitConfig({ contentSources: [ new GitContentSource({ models: [ { name: \"Page\", type: \"page\", urlPath: \"/{slug}\", filePath: \"content/pages/{slug}.json\", fields: [{ name: \"title\", type: \"string\", }] } // ... ] // ... }) ]}); Model Properties Each defined model can be configured with a number of properties. These are detailed further in a separate document. Access the reference rootPathSection titled “rootPath” Absolute path to the root of your project. This is used to build relative paths for other configuration properties. Required? Yes. Allowed string representing the absolute path to the project root. // stackbit.config.tsexport default defineStackbitConfig({ contentSources: [ new GitContentSource({ // ... }) ]}); AnnotationsSection titled “Annotations” When specifying object ID for annotations, most content sources will have an obvious ID value. For Git CMS, this value is the path to the source file, relative to the root of the project, and including the file extension. For example, say a home page is located at content/pages/index.json. .└── content/ └── pages/ └── index.json The ID value would be content/pages/index.json. <div data-sb-object-id=\"content/pages/index.json\">...</div> LimitationsSection titled “Limitations” “Created” and “Modified” columns aren’t available for Git CMS. Git CMS doesn’t provide accurate metadata for “Created” and “Modified” dates by default since data is only read from your working branch. These columns are therefore not available in the content editor when you use Git CMS. Last 14, 2025 PreviousDatoCMSNextHygraph Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";import { GitContentSource } from \"@stackbit/cms-git\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  contentSources: [    new GitContentSource({      rootPath: __dirname,      contentDirs: [\"content\"],      models: [        {          name: \"Page\",          type: \"page\",          urlPath: \"/{slug}\",          filePath: \"content/pages/{slug}.json\",          fields: [{ name: \"title\", type: \"string\", required: true }]        }      ],      assetsConfig: {        referenceType: \"static\",        staticDir: \"public\",        uploadDir: \"images\",        publicPath: \"/\"      }    })  ]});\n```\n\nExample:\n```text\nnpm install -D @stackbit/types @stackbit/cms-git\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  contentSources: [    new GitContentSource({      assetsConfig: {        referenceType: \"static\",        staticDir: \"public\",        uploadDir: \"images\",        publicPath: \"/\"      }      // ...    })  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  contentSources: [    new GitContentSource({      assetsConfig: {        referenceType: \"relative\",        assetsDir: \"src\",        uploadDir: \"images\"      }      // ...    })  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  contentSources: [    new GitContentSource({      contentDirs: [\"content\"]      // ...    })  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  contentSources: [    new GitContentSource({      models: [        {          name: \"Page\",          type: \"page\",          urlPath: \"/{slug}\",          filePath: \"content/pages/{slug}.json\",          fields: [{ name: \"title\", type: \"string\", required: true }]        }        // ...      ]      // ...    })  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  contentSources: [    new GitContentSource({      rootPath: __dirname      // ...    })  ]});\n```\n\nExample:\n```text\n.└── content/    └── pages/        └── index.json\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.379Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":8,"totalLines":44,"estimatedTokens":2660}}193{"id":"doc-https_docs_netlify_com_ai_context_netlify_develo-3598c2ab","source":"documentation","title":"https://docs.netlify.com/ai-context/netlify-development.mdc","url":"https://docs.netlify.com/ai-context/netlify-development.mdc","text":"// Developers can override the content as needed, but it should all be placed in this section.\n\n## General - The `.netlify` folder is not for user code. Add it to `.gitignore`. - Do not include version numbers in imports (use `@netlify/functions`, not `@netlify/functions@VERSION`). - Never add CORS headers (e.g., `Access-Control-Allow-Origin`) unless explicitly requested by the user. - Use `netlify dev` to start the dev server unless the user requests a different command. ## Guidelines - Netlify for general object/state/data storage. - Netlify Image for on-demand, dynamic image optimization and caching (not for build/development-time image modifications). - Environment secrets, API keys, or sensitive/external values here—never in code. ## Local Development Troubleshooting - If Netlify platform primitives (Blobs, Functions, etc.) aren't working locally, ensure `@netlify/vite-plugin` is installed for Vite-powered projects (or `@netlify/nuxt` for Nuxt, or `@netlify/vite-plugin-tanstack-start` for TanStack Start), configured, and you're running the framework's dev command directly (e.g., `npm run dev`). This enables full local platform primitives emulation. ### Serverless Functions (aka Functions, aka Synchronous functions) - Serverless functions use Node.js and should attempt to use built-in methods where possible - When adding new npm modules, ensure \"node_modules\" is in the from \"@netlify/functions\"; export default async (req: Request, ) => { // user code return new Response(\"Hello, world!\") } export const = { // use this path instead of /.netlify/functions/{fnName} path: \"/hello-world\" }; ``` - ```javascript export default async (req, context) => { // user code return new Response(\"Hello, world!\") } export const config = { // use this path instead of /.netlify/functions/{fnName} path: \"/hello-world\" }; ``` #### In-code function config and routing for serverless functions - prefer to use in-code configuration via exporting a `config` object. This is the structure the config can prefer to provide a friendly path using the config object. - ONLY serverless functions use `/.netlify/functions/{function_name}` path by default. - If you set a specific path via this config or the netlify.toml, it will only be available at that new path. - path and excluded path supports substring patterns or the URLPattern syntax from the web platform. ``` { | string[], // Defines the URL path(s) that trigger the function. Can be a single string or an array of paths. excludedPath?: string | string[], // Optional. Defines paths that should be excluded from triggering the function. preferStatic?: boolean, // Optional. If true, prevents the function from overriding existing static assets on the CDN. } ``` ### Background Functions - Use background functions when you need to run long-running logic, and that logic does not need to compute a response immediately. - Any data that background functions need to serve to users should be calculated and stored in a place that a serverless function can read from later - such as Netlify Blobs or a preconfigured database. - Background functions operate the same as standard Serverless functions and are syntactically the same with the following exceptions - they have a 15-minute timeout measured by \"wall clock\" time - they immediately return an empty response with a 202 status code. Return values from these functions are ignored. - Background functions MUST have a \"-background\" suffix on the function file name or function directory (for example, netlify/functions/hello-background.mts or netlify/functions/hello-background/index.mts). #### Examples of the latest background function structures - ```typescript import { Context } from \"@netlify/functions\"; export default async (req: Request, ) => { await someLongRunningTask(); console.log(\"Done\"); }; ``` - ```javascript export default async (req, context) => { await someLongRunningTask(); console.log(\"Done\"); }; ``` ### Scheduled Functions - Use scheduled functions when the logic needs to run on an interval or can be defined via CRON timing. - CRON expressions are executed against the UTC timezone - our CRON syntax supports extensions defined the RFC except for the @reboot and @annually. - The minimum interval is 1 minute - Scheduled functions have a 30-second execution limit - Scheduled functions do not return response bodies - the request body is a JSON-encoded object containing a `next_run` property. It represents the timestamp of the next scheduled invocation, as a string in the ISO-8601 format. - in addition to in-code config, schedules can be defined in the `netlify.toml`. ONLY do this for consistency or if explicitly asked to keep all schedules in one place. ```toml [functions.\"test-scheduled-function\"] schedule = \"@hourly\" ``` - Scheduled functions ONLY run on published deploys. They don’t run on Deploy Previews or branch deploys. - For local tests, the Netlify CLI to run the project in dev mode and the `netlify ` [command](mdc:https:/cli.netlify.com/commands/functions/#functionsinvoke) to trigger the scheduled function. example: ```bash netlify myfunction ``` #### Examples of the latest background function structures - ```typescript import type { Config } from \"@netlify/functions\" export default async (req: Request) => { const { next_run } = await req.json() console.log(\"Received event! Next invocation at:\", next_run) } export const = { schedule: \"@hourly\" } ``` - ```javascript export default async (req) => { const { next_run } = await req.json() console.log(\"Received event! Next invocation at:\", next_run) } export const config = { schedule: \"@hourly\" } ``` ### Edge Functions - ALWAYS use the latest format of an edge function structure. - **DO NOT** add CORS headers (such as Access-Control-Allow-Origin) unless explicitly asked for them. - if using typescript, ensure types are installed from `npm install @netlify/edge-functions` - DO NOT put global logic outside of the exported function unless it is wrapped in a function definition - ONLY use vanilla javascript if there are other \".js\" files in the functions directory. - ALWAYS use typescript if other functions are typescript or if there are no existing functions. - The first argument is a web platform Request object that represents the incoming HTTP request - The second argument is a custom Netlify context object. - Edge functions have a global `Netlify` object that is also accessible. - ONLY use `Netlify.env.*` for interacting with environment variables in code. - Place function files in `YOUR_BASE_DIRECTORY/netlify/edge-functions` or a subdirectory. - The serverless functions director can be changed via`netlify.toml`: ```toml [build] edge_functions = \"my-custom-directory\" ``` - Edge functions use Deno as runtime and should attempt to use built-in methods where possible. See the list of available web APIs to know which built-ins to use. - **Module Support**: - Supports **Node.js built-in modules**, **Deno modules**, and **npm packages** (beta). - **Importing Modules**: - **Node.js built-in modules**: Use `node:` prefix (e.g., `import { randomBytes } from \"node:crypto\"`). - **Deno modules**: Use **URL imports** (e.g., `import React from \"https://esm.sh/react\"` or an **import map**). - **npm packages (beta)**: Install via `npm install` and import by package name (e.g., `import _ from \"lodash\"`). - Some npm packages with **native binaries** (e.g., Prisma) or **dynamic imports** (e.g., cowsay) may not work. - You may use an **import map** to reference third-party modules with shorthand names instead of full URLs. - **Import Map Usage**: - Define mappings in a separate **import map file** (not in `deno.json`). - The file can be placed anywhere in the project directory. - **Example Import Map (`import_map.json`)**: ```json { \"imports\": { \"html-rewriter\": \"https://ghuc.cc/worker-tools/html-rewriter/index.ts\" } } ``` - **Enabling Import Maps**: - Declare the import map in `netlify.toml`: ```toml [functions] deno_import_map = \"./path/to/your/import_map.json\" ``` - **Usage in Code**: - Modules can now be imported by name: ```javascript import { HTMLRewriter } from \"html-rewriter\"; ``` #### Examples of the latest Edge function structures - ```typescript import type { Context, Config } from \"@netlify/edge-functions\"; export default async (req: Request, ) => { // user code return new Response(\"Hello, world!\") } export const = { path: \"/hello-world\" }; ``` - ```javascript export default async (req, context) => { // user code return new Response(\"Hello, world!\") } export const config = { path: \"/hello-world\" }; ``` #### Extra properties on context argument for Edge Functions - these are ONLY available in Edge Functions ``` { ...ALL OTHER Context fields/methods, next: (options?: { sendConditionalRequest?: boolean }) => Promise, // Invokes the next item in the request chain, optionally using conditional requests. nextRequest: (request: Request, options?: { sendConditionalRequest?: boolean }) => Promise, // Same as next(), but requires an explicit Request object. } ``` #### Web APIs available in Edge Functions ONLY - console.* - atob - btoa - Fetch API - fetch - Request - Response - URL - File - Blob - TextEncoder - TextDecoder - TextEncoderStream - TextDecoderStream - Performance - Web Crypto API - randomUUID() - getRandomValues() - SubtleCrypto - WebSocket API - Timers - setTimeout - clearTimeout - setInterval - Streams API - ReadableStream - WritableStream - TransformStream - URLPattern API #### In-code function config and routing for Edge functions - prefer to use in-code configuration via exporting a `config` object. This is the structure the config can prefer to provide a friendly path using the config object. - Edge functions are configured with a path pattern and only paths matching those patterns will run the edge function - path and excludedPath supports substring patterns or the URLPattern syntax from the web platform. - unless explicitly asked to modify other properties, only set path, pattern, excludedPath when creating functions. ``` { path?: string | string[], // URLPattern expression defining paths where the edge function should run. Must start with '/'. excludedPath?: string | string[], // Optional. Defines paths to exclude from execution. Must start with '/'. pattern?: RegExp | RegExp[], // Alternative to `path`. Uses regex for path matching. excludedPattern?: RegExp | RegExp[], // Optional. Defines regex patterns to exclude certain routes. method?: string | string[], // Optional. Specifies HTTP methods that should trigger the function (e.g., \"GET\", [\"POST\", \"PUT\"]). onError?: \"continue\" | \"fail\" | \"fallback\", // Optional. Controls how the function handles errors. cache?: 'manual', // Optional. Enables response caching if set to 'manual'. } = { path: \"\", // Default value; should be set per function. }; ``` #### Configuring Edge Functions in netlify.toml - ONLY Use `netlify.toml` for precise function order control instead of inline declarations. - DO NOT use `netlify.toml` if there is not edge function ordering requirements. - When controlling order, it's important to include all edge functions for order control. - **Declare Edge Functions in `netlify.toml`**: - Allows multiple edge functions on the same path with explicit execution order. - Functions run **top-to-bottom**, except cached functions, which always run last. - **Edge Function Properties**: - `function`: Name of the edge function. - `path`: URL pattern to trigger the function (must start with `/`). - `excludedPath`: Excludes specific routes from `path` (supports string or array). - `pattern`: Regex-based path matching. - `excludedPattern`: Excludes specific regex patterns (single or array). - `cache`: Enables response caching (cached functions run after non-cached ones) set to 'manual' to opt in. - **Netlify.toml config examples** ```toml [[edge_functions]] path = \"/admin\" function = \"auth\" [[edge_functions]] path = \"/admin\" function = \"injector\" cache = \"manual\" [[edge_functions]] path = \"/blog/*\" function = \"auth\" [[edge_functions]] path = \"/blog/*\" function = \"rewriter\" [[edge_functions]] pattern = \"/products/(.*)\" excludedPattern = \"/products/things/(.*)\" function = \"highlight\" [[edge_functions]] path = \"/*\" excludedPath = \"/img/*\" function = \"common\" ``` - **Execution Order for Edge Functions**: 1. **Configuration-based** edge functions (`netlify.toml`) run first. 2. **Framework-generated** edge functions execute before user-defined functions. 3. **Non-cached** edge functions execute before cached functions. 4. **Inline-declared** edge functions override duplicate `netlify.toml` functions. 5. **Multiple inline edge functions** run alphabetically by filename. - **Caveats & Special Cases**: - If an edge function returns a response, redirects for that path DO NOT occur. - Edge functions DO NOT execute for rewritten static routing targets. - `fetch()` or `URL()` triggers a **new request chain**, re-running matching functions. - Use `context.next()` to continue processing instead of re-triggering functions. - Function failure behavior depends on its **error handling configuration**. #### Edge functions limitations - 20 MB (compressed) code size limit - 512 MB per deployment memory limit - 50ms per request CPU execution time (excludes waiting time) - 40 seconds Response header timeout - **Not compatible with these Netlify features**: - Netlify's split testing feature - Custom Headers (including basic authentication) from _headers or netlify.toml config - [Netlify prerendering feature](/build/post-processing/prerendering) on paths served by edge functions - Be aware that multiple framework adapters may generate conflicting edge functions - **Restrictions**: - Can only rewrite requests to same-site URLs (use `fetch()` for external content) - Cached edge functions override existing static files - No local caching; HTTP cache headers are ignored in local testing - Not included in Netlify’s HIPAA-compliant hosting offering ## Netlify Blobs - Prefer using Netlify Blobs over creating a new database unless a flat file is not appropriate data layer, if explicitly asking to use a tool, or the dev needs to created relational structures or search that's more appropriate for databases - Blobs do not require configuration to use, everything is automatically provisions, and devs can simply start using them via any Netlify compute. The API will be the same across all compute types. - ensure `@netlify/blobs` NPM module is installed - **Local development troubleshooting**: If you see \"The environment has not been configured to use Netlify Blobs. To use it manually, supply the following properties when creating a , token\" error, install `@netlify/vite-plugin` for Vite-based projects to automatically configure the local environment. This does NOT apply to legacy V1 functions which require manual siteID/token configuration. - Requirements and limits - Requires Fetch API support (Node.js 18+ recommended) - a fetch function can be provided to the store - Store names cannot exceed 64 bytes - Object keys cannot exceed 600 bytes - Maximum object - Local development uses a sandboxed store ### Netlify Blobs API ```typescript export interface BlobMetadata { [key: string]: any; } export interface BlobData { | null; } export interface ListResult { blobs: { }[]; directories?: string[]; } interface GetKeyOptions { type?: 'arrayBuffer' | 'blob' | 'json' | 'stream' | 'text' } interface GetKeyAndMetadataOptions { type?: 'arrayBuffer' | 'blob' | 'json' | 'stream' | 'text', etag?: string; } // THESE ARE THE ONLY STORE METHODS. DO NOT MAKE UP NEW ONES interface Store { // Creates or overwrites a blob entry. // store.set('key-name', 'contents-of key'); // - NEVER add metadata unless instructed to. set(key: string, | Blob | string, { metadata?: object }): Promise; // Stores a JSON-serializable object. // store.setJSON('key-name', {version: 'a', }); // - NEVER add metadata unless instructed to. setJSON(key: string, , { metadata?: object }): Promise; // Retrieves a stored blob. // store.get('key-name'); // - NEVER add the second arg unless you need an explicit type 'arrayBuffer' | 'blob' | 'json' | 'stream' | 'text'. // - Instead of using JSON.parse(blob), use store.get('key-name', {type: 'json'}) // - if the blob is missing, it will resolve the promise with a null value get(key: string, getOpt?: GetKeyOptions): Promise; // Retrieves a blob along with metadata // store.getWithMetadata('key-name'); // - NEVER add the second getOpts arg unless you need an explicit type or have an etag to check against. // - AVOID adding it unless it's reliably available but IF an etag is provided, it will only return the blob if the etag is different that what's stored. // - if the blob is missing, it will resolve the promise with a null value getWithMetadata(key: string, getOpts?: GetKeyAndMetadataOptions): Promise<{ , , } | null>; // Retrieves metadata of a blob WITHOUT downloading the data. // store.getMetadata('key-name'); // - NEVER add the second getOpts arg unless you need an explicit type or have an etag to check against. // - AVOID adding it unless it's reliably available but IF an etag is provided, it will only return the blob if the etag is different that what's stored. // - if the blob is missing, it will resolve the promise with a null value getMetadata(key: string, getOpts?: GetKeyAndMetadataOptions): Promise<{ , } | null>; // Lists blobs in the store with optional hierarchical browsing. // example: // const { blobs } = await store.list() // // blobs === [ { etag: 'etag1', key: 'some-key' }, { etag: 'etag2', key: 'another-key' } ] // // - NEVER add the options arg unless you need an explicit reduce the searched data. // -- ONLY if you have to reduce searched data, use `prefix: 'some-prefix'` to pull blobs that start with that prefix value. Use `directories: true` to include the full directory path on the `key` // - By default, the list() method retrieves all pages, meaning you'll always get the full list of results. This can be slow or memory intensive. To paginate, pass the `paginate: true` in the options to turn the response into an AsyncIterator that allows you to for-of loop through the blobs in the store. // - if store path is empty, the blobs will resolve the promise with an empty array list(options?: { directories?: boolean, paginate?: boolean. prefix?: string }): Promise<{ [], [] }> | AsyncIterable<{ [], [] }> // Deletes a blob. // store.delete('key-name'); // - The return value is always resolves to `undefined`, regardless of whether or not there was an object to delete. delete(key: string): Promise; } interface GetDeployStoreOptions extends Partial { deployID?: string; name?: string; region?: Region; } // Returns a store instance for managing blobs. This is global scoped data across all deploys. // store = getStore('my-store'); // - ONLY add the options argument if the user needs strong consistency export function getStore(name: string, options?: { consistency?: 'strong' | 'eventual' }): Store; // Returns a deploy-specific store instance for managing blobs tied to a deploy. // store = getDeployStore('my-store'); // - ONLY add the options argument if the user needs strong consistency declare const getDeployStore: (input?: GetDeployStoreOptions | string) => Store; interface GetStoreOptions extends Partial { deployID?: string; name?: string; } // Lists all stores available on a project. // example: // const { stores } = await listStores(); // // [ \"beauty\", \"construction\" ] // - By default, the listStores() method retrieves all pages, meaning you'll always get the full list of results. This can be slow or memory intensive. To paginate, pass the `paginate: true` in the options to turn the response into an AsyncIterator that allows you to for-of loop through the blobs in the store. // - DO NOT pass options unless paginating. declare function listStores(options?: { paginate?: boolean; }): Promise | AsyncIterable; interface ListStoresResponse { []; next_cursor?: string; } ``` ## File-Based Uploads With file-based uploads, write blobs to deploy-specific stores after the project’s build completes. Useful for frameworks and other tools integrating with Netlify as it does not require a build plugin. Put files in `.netlify/blobs/deploy/*` for deploy specific ``` ); await store.set(\"dog\", \"🐶\"); const dog = await store.get(\"dog\"); ``` ## Storage scopes - blobs can be stored in a deploy-specific scope or at a global scope - deploy-specific blobs sync with deploys and are removed with deploy deletions. `getDeployStore()` is used to interact with deploy specific stores. - global scope blobs are not automatically cleaned up and are consistent across all branches. `getStore()` is used for global scope. - Build plugins and file-based uploads must write to deploy-specific stores. - ALWAYS When creating logic that saves to global scope, ensure that non-production data does not get stored in these global stores. This keeps production data isolated from test data. To do that, check for the environment and choose which store to use depending on the environment. #### Examples of blob usage ```javascript // basic writing to a deploy store import { getDeployStore } from \"@netlify/blobs\"; const store = getDeployStore(\"construction\"); ``` ```javascript // basic writing to a global store import { getStore } from \"@netlify/blobs\"; const store = getStore(\"construction\"); ``` ```javascript // using global store if in production, otherwise use deploy scope store import { getStore, getDeployStore } from \"@netlify/blobs\"; function getBlobStore(...storeOptions){ if((Netlify.context?.deploy.context === 'production'){ return getStore(...storeOptions); } return getDeployStore(...storeOptions) } const store = getBlobStore(\"construction\"); ``` ## Netlify Image CDN - All Netlify projects have a `/.netlify/images` route supported by their project without any additional enablement. - Transform images via query parameters in requests to `/.netlify/images`. - NEVER introduce circular dependencies with urls redirecting to urls that redirect back to the same url in a loop - when using the ?url={URL} parameter, ensure the url is a URI encoded component. - Supported **source**: Required, specifies image URL (relative or remote). - **size**: `w` (width) and `h` (height) in pixels. - **fit**: Determines how the image is resized (`contain`, `cover`, `fill`). - **position**: Cropping alignment (`top`, `bottom`, `left`, `right`, `center`). - **format**: Convert to `avif`, `jpg`, `png`, `webp`, `gif`, or `blurhash`. - **quality**: Controls lossy format quality (`q`, 1-100, default 75). ### Example transformations ```html ``` ### Caching & deployment behavior - Transformed images are cached at the edge. - Source images are cached for future transformations. - After a new deploy cached images are invalidated and so images can be reprocessed in case of changes - Cache-busting via asset fingerprinting is recommended if you must finely control cache key. - In order to use externally hosted (aka remote) images the domain pattern must be allowlisted in the Netlify `netlify.toml`. - Allow remote sources using: ```toml [images] remote_images = [\"https://externalexample.com/.*\"] ``` - only absolute urls to external servers need to be in remote_images - Remote images must be publicly accessible. Fetches to remote sources do not include end-user credentials (`Authorization` and `Cookie` headers are not forwarded). For sources that require authentication, use URLs that carry their own authorization, such as S3 presigned URLs. ### Redirects & Rewrites - If you do not want to use the default `/.netlify/images` path, a redirect or rewrite can be used to have a different url. - Define reusable transformation routes in `_redirects` or `netlify.toml` files. - When doing so, the parameters can remain parameters to pass in or can be statically defined. - netlify.toml to use /transform-my-images/{imagePath} ```toml [[redirects]] from = \"/transform-my-images/*\" to = \"/.netlify/images?url=/:splat&w=50&h=50\" status = 200 ``` - _redirects to use /transform-all/{...imagePath} ``` /transform-all/* /.netlify/images?url=/:splat&w=50&h=50 200 ``` ### Custom headers - Custom headers can ONLY be applied to images hosted on the same domain. - ONLY do this when explicitly asked - netlify.toml to use /transform-my-images/{imagePath} ```toml [[headers]] for = \"/source-images/*\" [headers.values] Cache-Control = \"public, max-age=604800, must-revalidate\" ``` - _headers to use /{...imagePath} ``` /source-images/* , max-age=604800, must-revalidate ``` ### Image CDN framework support Netlify Image CDN integrates with frameworks for automatic **Angular**: `NgOptimizedImage` component will use Image CDN automatically - **Astro**: `` component will use Image CDN automatically - **Gatsby**: set `NETLIFY_IMAGE_CDN=true` and use the Contentful, Drupal, or WordPress source plugins. - **Next.js**: set `remotePatterns` in `next.config.js` - **Nuxt**: `nuxt/image` module will use Image CDN automatically ## Environment Variables - securely create, manage, and use environment variables across projects. These variables can be set via the UI, CLI, API, or configuration files. - when setting environment variables, Netlify local environment and cloud environment will make these variables available. - **Precedence**: `netlify.toml` overrides UI/CLI/API variables, and project-specific variables take precedence over shared ones. ### Creating Environment Variables Variables can be created and managed **Netlify UI**: Suggest using if they don't want to provide the values directly to this agent. They can navigate to it via the path \"Project configuration > Environment variables\". - **Netlify CLI**: Prefer using this if the agent can run commands. This requires the project to be linked. - **Netlify Configuration (`netlify.toml`)**: Defines variables at the repository level. ONLY use this for environment variables where the project is not linked yet and the values are not sensitive. ### Netlify CLI Command - The project must be linked first before the CLI will add variables. See the rules for initializing and linking projects for how to do this. - Use `env:set` for changes, `env:unset` to delete. `env:import` to import from a dotenv`.env` file. #### Example usage of env var CLI - Basic setting an environment variable for the project ```sh netlify API_KEY \"not-a-secret\" ``` - Setting an environment variable that should be treated as a secret ```sh netlify API_KEY \"secret-value\" --secret ``` ### Example `netlify.toml` Configuration - Using the netlify.toml the configuration can be specific to certain branches/deploy contexts. - examples ```toml # Production deploys from the Production branch # set in your project’s Branches settings in the Netlify UI will inherit # these settings. You can define environment variables # here but we recommend using the Netlify UI for sensitive # values to keep them out of your source repository. [context.production] publish = \"output/\" command = \"make publish\" environment = { NODE_VERSION = \"14.15.3\" } # Here is an example of how to define context-specific # environment variables. Be mindful when using this # option and avoid committing sensitive values to public # source repositories. [context.deploy-preview.environment] NOT_PRIVATE_ITEM = \"not so secret\" # Branch Deploy deploys that are not from # a pull/merge request or from the Production branch # will inherit these settings. [context.branch-deploy.environment] NODE_ENV = \"development\" # Dev variables set here # are available for local development environments # run using Netlify Dev. These values can be # overwritten on branches that have a more specific # branch context configured. [context.dev.environment] NODE_ENV = \"development\" # Specific branch deploys from # this specific branch will inherit these settings. [context.staging.environment] # “staging” is a branch name NODE_ENV = \"development\" ``` ### `.env` File Handling - Netlify builds do not read `.env` files directly - Import `.env` variables into Netlify using the UI or CLI (`netlify from \"vite\"; import netlify from \"@netlify/vite-plugin\"; export default defineConfig({ plugins: [netlify()] }); ``` **Nuxt (nuxt.config.ts):** For Nuxt projects, use `@netlify/nuxt` module instead: ```bash npx nuxi module add @netlify/nuxt ``` This does exactly what `@netlify/vite-plugin` does but specifically for Nuxt. It brings the complete Netlify platform directly into your `nuxt dev` , Edge Functions, Blobs, Image CDN, headers, redirects, environment variables. Alternatively, you can configure manually by installing as a dev dependency and adding to the modules array: ```bash npm install -D @netlify/nuxt ``` ```js export default defineNuxtConfig({ modules: [\"@netlify/nuxt\"] }); ``` **SvelteKit (vite.config.js):** ```js import { sveltekit } from \"@sveltejs/kit/vite\"; import netlify from \"@netlify/vite-plugin\"; export default defineConfig({ plugins: [sveltekit(), netlify()] }); ``` **TanStack Start (vite.config.ts):** For TanStack Start projects, use `@netlify/vite-plugin-tanstack-start` instead: ```bash npm install -D @netlify/vite-plugin-tanstack-start ``` ```typescript import { defineConfig } from 'vite' import { tanstackStart } from '@tanstack/react-start/plugin/vite' import netlify from '@netlify/vite-plugin-tanstack-start' export default defineConfig({ plugins: [ tanstackStart(), netlify(), ], }) ``` **Other metaframeworks:** Look for `vite` configuration key in the framework's config file (e.g., `astro.config.js`, `remix.config.js`). With `@netlify/vite-plugin` installed, users can run their regular dev command (`npm run dev`, `yarn dev`, `astro dev`, etc.) instead of `netlify dev`. Vite-powered frameworks , SvelteKit, Nuxt 3+ (use `@netlify/nuxt` module instead), TanStack Start (use `@netlify/vite-plugin-tanstack-start` instead), Remix 2.2.0+ (unless using Classic Compiler), SolidStart, Analog, Qwik City, VitePress. This does NOT apply to these frameworks (they do not use Vite): Next.js, Gatsby, Angular. ## Netlify Database - Prefer using Netlify Database when the data layer is relational or requires search, unless explicitly asked to use a flat file. - Using the `@netlify/database` NPM module is required. This is the main interface for interacting with the database. - There is no manual setup or configuration required. Installing `@netlify/database` and deploying (or running `netlify dev`) automatically provisions a Postgres database for the site. - The user does not need to create a database manually or manage connection strings. The connection string is configured automatically. - Netlify Database uses database deploys are the only ones that access the main database. Each deploy preview gets its own fully isolated database branch, created with a copy of the production data when the first deploy on that branch is created. All subsequent deploys on that branch share the same database branch. - If adding `path` to the exported `config` object in the Netlify Function, remember not to add the `/.netlify/functions/` prefix to the URI in API calls when you make them in the app ## Installation ```bash npm install @netlify/database ``` No other setup is needed. The database is provisioned automatically on deploy or when running `netlify dev`. ## Getting a connection string Use `getConnectionString()` if you want to use your own database driver or ORM. It returns the Postgres connection URL for the current environment, automatically pointing to the correct database branch. ```javascript import { getConnectionString } from \"@netlify/database\"; import pg from \"pg\"; const pool = new pg.Pool({ () }); const { } = await pool.query(\"SELECT * FROM users\"); ``` ## Using the Netlify Database driver Use `getDatabase()` to get a full-featured driver that automatically uses the best connection type for the current environment. The driver provides two ways of running `db.sql` — tagged template literal for simple, one-shot queries (recommended for most use cases) - `db.pool` — a `pg.Pool` connection pool for complex scenarios like transactions ### Examples with `sql` ```javascript import { getDatabase } from \"@netlify/database\"; const db = getDatabase(); // Select const users = await db.sql`SELECT * FROM users`; // Select with parameters (values are automatically parameterized) const user = await db.sql`SELECT * FROM users WHERE id = ${userId}`; // Insert await db.sql`INSERT INTO users (name, email) VALUES (${\"Ada\"}, ${\"ada@example.com\"})`; // Update await db.sql`UPDATE users SET name = ${\"Ada Lovelace\"} WHERE id = ${1}`; // Delete await db.sql`DELETE FROM users WHERE id = ${1}`; // Insert with RETURNING const [newUser] = await db.sql` INSERT INTO users (name, email) VALUES (${\"Ada\"}, ${\"ada@example.com\"}) RETURNING * `; // Bulk insert const data = db.sql.values([ [\"Ada\", \"ada@example.com\"], [\"Bob\", \"bob@example.com\"], ]); await db.sql`INSERT INTO users (name, email) VALUES ${data}`; // Dynamic identifiers (table/column names) const table = db.sql.identifier({ table: \"users\" }); const rows = await db.sql`SELECT * FROM ${table}`; // Streaming results for await (const row of db.sql`SELECT * FROM users`.stream()) { console.log(row); } ``` ### Example with `pool` (transactions) ```javascript import { getDatabase } from \"@netlify/database\"; const db = getDatabase(); const client = await db.pool.connect(); try { await client.query(\"BEGIN\"); await client.query(\"INSERT INTO users (name, email) VALUES ($1, $2)\", [\"Ada\", \"ada@example.com\"]); await client.query(\"INSERT INTO posts (author_id, title) VALUES ($1, $2)\", [1, \"First post\"]); await client.query(\"COMMIT\"); } catch (e) { await client.query(\"ROLLBACK\"); throw e; } finally { client.release(); } ``` ## Migrations - Migrations are SQL files that Netlify applies automatically during deploys - Place migrations in `netlify/database/migrations/` in your project - Each migration is a directory named `_` containing a `migration.sql` file - The number defines the relative order (typically a sequential number like `001` or a Unix timestamp) - Slugs must be lowercase alphanumeric with hyphens only (e.g. `001_create-users`) - Migrations are sorted lexicographically and applied in order - On production deploys, migrations are applied immediately before the deploy is published; a failure blocks publishing - On deploy previews, migrations are applied on every new deploy, immediately before it becomes available; a failure fails the deploy ### Migration directory structure ``` netlify/database/migrations/ ├── 20260301143000_create_users/ │ └── migration.sql ├── 20260318091500_add_posts/ │ └── migration.sql └── 20260425103000_create_comments/ └── migration.sql ``` ### Example migration ```sql -- netlify/database/migrations/20260301143000_create_users/migration.sql CREATE TABLE users ( id SERIAL PRIMARY KEY, name TEXT NOT NULL, email TEXT UNIQUE NOT NULL, created_at TIMESTAMP DEFAULT NOW() ); ``` ## API Reference Summary - `getConnectionString()` — Returns the Postgres connection URL for the current environment - `getDatabase(options?)` — Returns a Netlify Database driver object with `sql` and `pool` properties - `options.connectionString` — Override the automatic connection string - `options.debug` — Enable debug logging - `db.sql\\`...\\`` — Tagged template literal for parameterized SQL queries. Returns a thenable that resolves to an array of row objects. Also supports `.execute()`, `.stream()`, `.chunked()`, and `.toSQL()`. - `db.sql.identifier(value)` — Create safe SQL identifiers for dynamic table/column names - `db.sql.values(rows)` — Create value lists for bulk inserts - `db.sql.raw(value)` — Inject raw SQL (use with caution) - `db.sql.unsafe(query, params?)` — Execute raw SQL strings - `db.sql.default` — The SQL DEFAULT keyword - `db.pool` — A `pg.Pool` connection pool for transactions and complex queries\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.383Z","totalSectionsIncluded":2,"totalCodeBlocksIncluded":0,"totalLines":5,"estimatedTokens":8969}}194{"id":"doc-debug_with_vs_code_and_netlify_cli_netlify_docs-3420cdde","source":"documentation","title":"Debug with VS Code and Netlify CLI | Netlify Docs","url":"https://docs.netlify.com/api-and-cli-guides/cli-guides/debug-with-vscode","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI API & CLI guides API & CLI guides Overview API guides Get started with API Deploy project from a zip file with API Deploy zip file to production More API guides API reference docs Go client JS client CLI guides Get started with CLI Local development Manage functions Debug with VSCode More CLI guides CLI reference docs On this page Overview Create a configuration file Launch the debugger Debug functions On this page Overview Create a configuration file Launch the debugger Debug functions For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 API And CLI Guides / CLI Guides / Debug with VS Code and Netlify CLI Copy page View as Markdown Copy as Markdown View as Markdown You can use the VS Code debugger while you run your project with the Netlify CLI. This document outlines how to configure VS Code and how to launch the debugger. Create a configuration fileSection titled “Create a configuration file” Create a launch.json file under a .vscode directory in your project with the following content. { \"version\": \"0.2.0\", \"configurations\": [ { \"name\": \"netlify dev\", \"type\": \"node\", \"request\": \"launch\", \"skipFiles\": [\"<node_internals>/**\"], \"outFiles\": [\"${workspaceFolder}/.netlify/functions-serve/**/*.js\"], \"program\": \"${workspaceFolder}/node_modules/.bin/netlify\", \"args\": [\"dev\"], \"console\": \"integratedTerminal\", \"env\": { \"BROWSER\": \"none\" }, \"serverReadyAction\": { \"pattern\": \"Server now ready on (https?://[\\\\w:.-]+)\", \"uriFormat\": \"%s\", \"action\": \"debugWithChrome\" } }, { \"name\": \"netlify \", \"type\": \"node\", \"request\": \"launch\", \"skipFiles\": [\"<node_internals>/**\"], \"outFiles\": [\"${workspaceFolder}/.netlify/functions-serve/**/*.js\"], \"program\": \"${workspaceFolder}/node_modules/.bin/netlify\", \"args\": [\"functions:serve\"], \"console\": \"integratedTerminal\" } ]} Launch the debuggerSection titled “Launch the debugger” After you create the configuration file, launch the Run and Debug from the VS Code sidebar. To reduce noise, we recommend that you deactivate Caught Exceptions. In the top menu, select the command to run — either netlify dev or netlify Run the debugger. If you select netlify dev, the CLI will start a local development environment and open a browser with the site URL. If you select netlify , the CLI will start a standalone Netlify Functions server. Debug functionsSection titled “Debug functions” Use the --inspect Node.js option to debug functions. Visit managing functions for more information. Last 14, 2025 PreviousManage functionsNextMore CLI guides Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n{  \"version\": \"0.2.0\",  \"configurations\": [    {      \"name\": \"netlify dev\",      \"type\": \"node\",      \"request\": \"launch\",      \"skipFiles\": [\"<node_internals>/**\"],      \"outFiles\": [\"${workspaceFolder}/.netlify/functions-serve/**/*.js\"],      \"program\": \"${workspaceFolder}/node_modules/.bin/netlify\",      \"args\": [\"dev\"],      \"console\": \"integratedTerminal\",      \"env\": { \"BROWSER\": \"none\" },      \"serverReadyAction\": {        \"pattern\": \"Server now ready on (https?://[\\\\w:.-]+)\",        \"uriFormat\": \"%s\",        \"action\": \"debugWithChrome\"      }    },    {      \"name\": \"netlify functions:serve\",      \"type\": \"node\",      \"request\": \"launch\",      \"skipFiles\": [\"<node_internals>/**\"],      \"outFiles\": [\"${workspaceFolder}/.netlify/functions-serve/**/*.js\"],      \"program\": \"${workspaceFolder}/node_modules/.bin/netlify\",      \"args\": [\"functions:serve\"],      \"console\": \"integratedTerminal\"    }  ]}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.385Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":1241}}195{"id":"doc-automatic_content_reload_netlify_docs-5266140a","source":"documentation","title":"Automatic content reload | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/automatic-content-reload","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Automatic content reload Capture & handle change events Add an event listener Next.js example Conditional refresh Custom content reload When to go fully custom On this page Overview Automatic content reload Capture & handle change events Add an event listener Next.js example Conditional refresh Custom content reload When to go fully custom For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending ); See the event reference for more details on the event object. Next.js exampleSection titled “Next.js example” The event listener will run on all pages by using the App component. // src/pages/_app.jsimport * as React from \"react\"; const CHANGE_EVENT = \"stackbitObjectsChanged\"; export default function MyApp({ Component, pageProps }) { const onContentChange = e => { // Override the default refresh behavior just for a specific URL if (e.detail.currentUrl === \"/about\") { e.preventDefault(); /* myRefreshCodeJustForAbout() ... */ } }; /* When any page is mounted, add the listener. Note the function returned by the callback, which will be called on unmount, and the empty dependency array to prevent this from running on any re-render. */ React.useEffect(() => { window.addEventListener(CHANGE_EVENT, onContentChange); return () => { window.removeEventListener(CHANGE_EVENT, onContentChange); }; }, []); return <Component {...pageProps} />;} Conditional refreshSection titled “Conditional refresh” You can override Visual Editor’s default behavior just in certain conditions or for specific URLs, by conditionally calling e.preventDefault() just when appropriate. For example, if you're methodically annotating all content objects used to render a given page with data-sb-object-id data attributes, you can prevent a refresh when there's no intersection between changed objects and on-page onContentChange = e => { const intersects = e.detail.changedObjectIds.some(o => e.detail.visibleObjectIds.includes(o) ); if (!intersects) e.preventDefault();}; Custom content reloadSection titled “Custom content reload” To handle content change detection & refresh fully within your codebase, add the following to your configuration default { stackbitVersion: \"~0.6.0\", }; With customContentReload set to true Visual Editor will not notify you of content changes, nor will it refresh the page. When to go fully customSection titled “When to go fully custom” If you're using Sourcebit as many existing projects do.This package is optional and external to Visual Editor itself. It handles change detection & page refresh by itself for supported content sources & web frameworks. If your application implements a cache layer on top of your content source, you need to ensure that this cache is up-to-date with content changes before the page is being refreshed. This requires having your own pipeline for content change detection => cache update/invalidation => page refresh. You can find an example of that in the sourcebit-target-next plugin. Last 14, 2025 PreviousAnalyticsNextContent presets Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// src/pages/_app.jsimport * as React from \"react\";\nconst CHANGE_EVENT = \"stackbitObjectsChanged\";\nexport default function MyApp({ Component, pageProps }) {  const onContentChange = e => {    // Override the default refresh behavior just for a specific URL    if (e.detail.currentUrl === \"/about\") {      e.preventDefault();      /* myRefreshCodeJustForAbout() ... */    }  };\n  /*  When any page is mounted, add the listener.  Note the function returned by the callback, which will be called on unmount,  and the empty dependency array to prevent this from running on any re-render.  */  React.useEffect(() => {    window.addEventListener(CHANGE_EVENT, onContentChange);    return () => {      window.removeEventListener(CHANGE_EVENT, onContentChange);    };  }, []);\n  return <Component {...pageProps} />;}\n```\n\nExample:\n```text\nconst onContentChange = e => {  const intersects = e.detail.changedObjectIds.some(o =>    e.detail.visibleObjectIds.includes(o)  );  if (!intersects) e.preventDefault();};\n```\n\nExample:\n```text\nexport default {  stackbitVersion: \"~0.6.0\",  customContentReload: true};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.387Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":22,"estimatedTokens":1670}}196{"id":"doc-use_visual_editor_with_sveltekit_netlify_docs-324f6138","source":"documentation","title":"Use Visual Editor with SvelteKit | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/frameworks/sveltekit","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Visual Editor for a SvelteKit project Content reload Example On this page Overview Configure Visual Editor for a SvelteKit project Content reload Example For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Frameworks / Use Visual Editor with SvelteKit Copy page View as Markdown Copy as Markdown View as Markdown Learn how to use Visual Editor with a SvelteKit-based website. Warning SvelteKit is an up-and-coming framework gathering enthusiastic support. However, at the time of writing, SvelteKit is still in beta and breaking changes are expected and indeed released from time to time.When upgrading package versions, code changes may be necessary for either development and/or building for production. Configure Visual Editor for a SvelteKit projectSection titled “Configure Visual Editor for a SvelteKit project” SvelteKit is supported through the option (learn more. Follow the example repository for a concrete example of integrating Visual Editor with a SvelteKit. Here's an excerpt from Visual Editor configuration file: // stackbit.config.jsexport default { stackbitVersion: \"~0.6.0\", cmsName: \"contentful\", nodeVersion: \"16\", ssgName: \"custom\", devCommand: \"./node_modules/.bin/vite --port {PORT}\", experimental: { ssg: { name: \"sveltekit\", logPatterns: { up: [\" ready in \"] }, passthrough: [\"/vite-hmr/**\"] } }}; Note the use of some experimental configuration properties to ensure compatibility with Vite (the development server used by SvelteKit and others): experimental.ssg.logPatterns.up is set to [' ready in ']. This is part of the log message that appears when the Vite dev server is ready to accept requests. experimental.ssg.passthrough is set to a dedicated relative path to Vite's HMR Websocket endpoint. The path '/vite-hmr/' is configured accordingly in vite.config.js (see here. With this setting, any code changes will trigger a client refresh through Vite's HMR mechanism, without interference from our container. Content reloadSection titled “Content reload” In the example repository, content changes are handled the 'stackbitObjectsChanged' window event. Then, invalidating the JSON endpoint providing data to the current page, which will cause the current page to refresh. This behavior is found at the root __layout.svelte file, which enables it across the website without needing to further modify any other module. Here are the contents of this file (source: <script context=\"module\"> export async function load({ url }) { return { props: { , }, }; }</script> <script> import { invalidate } from \"$app/navigation\"; export let currentUrl; function onContentChange(event) { invalidate(`${currentUrl}.json`); console.log(\"Content update - invalidating current page\"); }</script> <svelte:window |preventDefault={onContentChange}/> <slot /> ExampleSection titled “Example” SvelteKit + Contentful Example. Originally adopted from this demo on GitHub, with added Visual Editor support and modifications for compatibility with the latest version of SvelteKit. Last 14, 2025 PreviousNuxt 3NextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.jsexport default {  stackbitVersion: \"~0.6.0\",  cmsName: \"contentful\",  nodeVersion: \"16\",  ssgName: \"custom\",  devCommand: \"./node_modules/.bin/vite --port {PORT}\",  experimental: {    ssg: {      name: \"sveltekit\",      logPatterns: { up: [\" ready in \"] },      passthrough: [\"/vite-hmr/**\"]    }  }};\n```\n\nExample:\n```text\n<script context=\"module\">  export async function load({ url }) {    return {      props: {        currentUrl: url.pathname,      },    };  }</script>\n<script>  import { invalidate } from \"$app/navigation\";  export let currentUrl;\n  function onContentChange(event) {    invalidate(`${currentUrl}.json`);    console.log(\"Content update - invalidating current page\");  }</script>\n<svelte:window  on:stackbitObjectsChanged|preventDefault={onContentChange}/>\n<slot />\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.387Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":17,"estimatedTokens":1637}}197{"id":"doc-page_editor_netlify_docs-27799a1e","source":"documentation","title":"Page editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/page-editor","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Enable the page editor Automatic document resolution Enable page editing manually Highlight active elements On this page Overview Enable the page editor Automatic document resolution Enable page editing manually Highlight active elements For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", contentSources: [ // ... ], modelExtensions: [{ name: \"page\", type: \"page\", urlPath: \"/{slug}\" }]}); Enable page editing manuallySection titled “Enable page editing manually” For cases where the there isn't a direct one-to-one mapping between document objects and URL paths, pages can be enabled by setting the document property when manually building the siteMap. // stackbit.config.tsimport { defineStackbitConfig, getLocalizedFieldForLocale, SiteMapEntry} from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", siteMap: ({ documents, models }) => { const pageModels = models.filter(m => m.type === \"page\").map(m => m.name); return documents ) .filter(Boolean) as SiteMapEntry[]; }}); Highlight active elementsSection titled “Highlight active elements” Visual Editor highlights elements in the preview that are actively focused in the page editor. Enabling this requires annotating pages and components. Last 23, 2025 PreviousInline editorNextSidebar buttons Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  contentSources: [    // ...  ],  modelExtensions: [{ name: \"page\", type: \"page\", urlPath: \"/{slug}\" }]});\n```\n\nExample:\n```text\n// stackbit.config.tsimport {  defineStackbitConfig,  getLocalizedFieldForLocale,  SiteMapEntry} from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  siteMap: ({ documents, models }) => {    const pageModels = models.filter(m => m.type === \"page\").map(m => m.name);    return documents      .filter(d => pageModels.includes(d.modelName))      .map(document => {        // ...        return {          document          // ...        };      })      .filter(Boolean) as SiteMapEntry[];  }});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.388Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":15,"estimatedTokens":1194}}198{"id":"doc-sidebar_buttons_netlify_docs-353a5cb7","source":"documentation","title":"Sidebar buttons | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/sidebar-buttons","text":"Example:\n```text\n// stackbit.config.jsexport default {  sidebarButtons: [    {      label: \"Site management\",      type: \"model\",      icon: \"tools\",      modelName: \"SiteConfig\"    }  ]};\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  sidebarButtons: [    {      label: \"Specific document\",      type: \"document\",      icon: \"user-management\",      documentId: \"content/data/config.json\"    }  ]};\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  sidebarButtons: [    {      label: \"Document in specific content source\",      type: \"document\",      icon: \"user-management\",      documentId: \"hGa71n3gba8\",      srcType: \"contentful\",      srcProjectId: process.env.CONTENTFUL_SPACE_ID    }  ]};\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  sidebarButtons: [    {      label: \"Internal page\",      type: \"link\",      icon: \"analytics\",      url: \"/internal-page\"    }  ]};\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  sidebarButtons: [    {      label: \"External link\",      type: \"link\",      icon: \"external-link\",      url: \"my-live-site.com\"    }  ]};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.390Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":5,"totalLines":26,"estimatedTokens":283}}199{"id":"doc-vercel_to_netlify_migration_checklist_netlify_do-38de5dbf","source":"documentation","title":"Vercel to Netlify migration checklist | Netlify Docs","url":"https://docs.netlify.com/resources/checklists/vercel-to-netlify-migration","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Checklists Checklists Overview Production checklist Onboard to Pro checklist Security checklist Vercel to Netlify migration checklist On this page Overview Pre-migration preparation Review your current setup Plan your migration Code and configuration migration Next.js applications Convert Vercel configuration to netlify.toml Environment variables and secrets Smooth migration checklist Domain and DNS setup Build and performance optimization Site configuration and branding Forms migration (if applicable) Monitoring and analytics Testing and validation Pre-launch testing Feature verification Go-live preparation Final steps Post-migration Helpful resources Next.js on Netlify Configuration and migration Production readiness Support and troubleshooting On this page Overview Pre-migration preparation Review your current setup Plan your migration Code and configuration migration Next.js applications Convert Vercel configuration to netlify.toml Environment variables and secrets Smooth migration checklist Domain and DNS setup Build and performance optimization Site configuration and branding Forms migration (if applicable) Monitoring and analytics Testing and validation Pre-launch testing Feature verification Go-live preparation Final steps Post-migration Helpful resources Next.js on Netlify Configuration and migration Production readiness Support and troubleshooting For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Checklists / Vercel to Netlify migration checklist Copy page View as Markdown Copy as Markdown View as Markdown Migrating from Vercel to Netlify can be seamless with the right preparation. This checklist covers the essential steps for successfully moving your projects, with special attention to Next.js applications, configuration migration, and production readiness. Next.js on Netlify Netlify provides zero-configuration deployment for Next.js 13.5+ with full support for App Router, SSR, ISR, and all modern Next.js features. Earlier versions use the legacy runtime. Pre-migration preparationSection titled “Pre-migration preparation” Review your current setupSection titled “Review your current setup” Document your current Vercel configuration (build commands, environment variables, redirects) Identify Next.js version and features in use (App Router, API routes, middleware, etc.) List all custom domains and DNS configurations Review existing environment variables and secrets Document any Vercel-specific features you're using (Edge Functions, Analytics, etc.) Plan your migrationSection titled “Plan your migration” Choose your Netlify plan based on your needs Set up your Netlify account and connect to your Git provider Plan your domain migration strategy to minimize downtime Code and configuration migrationSection titled “Code and configuration migration” Next.js applicationsSection titled “Next.js applications” Update to supported to Next.js 13.5+ for zero-configuration deployment Image next/image components work with Netlify Image CDN Convert Vercel configuration to netlify.tomlSection titled “Convert Vercel configuration to netlify.toml” Build Vercel build commands to netlify.toml configuration [build] command = \"next build\" publish = \".next\" Redirects and redirects to next.config.js for proper handling, or use Netlify redirects headers to next.config.js for proper handling, or use Netlify headers Vercel API routes to Netlify Functions if needed (Next.js API routes work automatically) Environment variables and secretsSection titled “Environment variables and secrets” Export environment variables from Vercel dashboard Import to .env file variables for consistency Review sensitive Secrets Controller for your most sensitive variables Set up scoped environment variable scopes for different deploy contexts Smooth migration checklistSection titled “Smooth migration checklist” Based on Netlify's production checklist, here are the essential steps for a smooth migration. For comprehensive production readiness guidance, see our complete production checklist. Domain and DNS setupSection titled “Domain and DNS setup” Plan DNS DNS changes to minimize downtime (see DNS cutover guidance) Add custom your custom domain in Netlify Configure www or subdomain as primary domain for optimal performance Set up secure connections for your site Build and performance optimizationSection titled “Build and performance optimization” Optimize build build settings for faster deployments Set function serverless functions region closest to your data sources Image Netlify Image CDN is properly configured Site configuration and brandingSection titled “Site configuration and branding” Search engine branch deploys from search indexing if needed Forms migration (if applicable)Section titled “Forms migration (if applicable)” Netlify Forms Vercel forms to Netlify Forms Spam spam filters Custom success custom success pages for better UX Monitoring and analyticsSection titled “Monitoring and analytics” Enable Web on Web Analytics for site monitoring Set up performance monitoring tools for ongoing optimization Testing and validationSection titled “Testing and validation” Pre-launch testingSection titled “Pre-launch testing” Deploy Preview your site using Deploy Previews Function all serverless functions work correctly Form all form submissions and integrations (if applicable) Performance performance tests and audits Cross-browser compatibility across target browsers Feature verificationSection titled “Feature verification” Next.js SSR, ISR, API routes, and middleware functionality Image images load correctly with Netlify Image CDN Redirects and all URL redirects and routing rules Environment all environment variables are working correctly Go-live preparationSection titled “Go-live preparation” Final stepsSection titled “Final steps” Emergency maintenance page process for unexpected issues Team team with rollback procedures Monitoring alerts and monitoring for production traffic DNS planned DNS migration with minimal downtime Post-migrationSection titled “Post-migration” Monitor for any performance regressions or issues Test all comprehensive testing of all site features Update internal documentation with new Netlify workflows Clean old Vercel configurations and deployments after confirming stability Helpful resourcesSection titled “Helpful resources” Next.js on NetlifySection titled “Next.js on Netlify” Next.js on Netlify overview Next.js platform starter template Configuration and migrationSection titled “Configuration and migration” Netlify configuration file reference Redirects and rewrites guide Environment variables setup Production readinessSection titled “Production readiness” Complete production checklist Performance optimization guide Security best practices Support and troubleshootingSection titled “Support and troubleshooting” Troubleshooting guide Fix failed deploys with AI Community forums Need help with your migration? The Netlify community and support team are here to help. Visit our community forums for migration questions or reach out to our support team if you need additional assistance. Last 31, 2026 PreviousSecurity checklistNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n[build]  command = \"next build\"  publish = \".next\"\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.390Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":2193}}200{"id":"doc-custom_actions_netlify_docs-4d27c371","source":"documentation","title":"Custom actions | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/custom-actions","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Types of actions Global actions Bulk document actions Model actions Field actions Accept input Supported field types Use input data Handling state Supported state State example Examples Generate a title Fix formatting on field Status messages Success status example Error status example On this page Overview Types of actions Global actions Bulk document actions Model actions Field actions Accept input Supported field types Use input data Handling state Supported state State example Examples Generate a title Fix formatting on field Status messages Success status example Error status example For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Custom actions Copy page View as Markdown Copy as Markdown View as Markdown Integrate workflow, automation and other custom tasks into Visual Editor. Custom actions create the ability to perform site and content tasks in a single location. Visual Editor already handles normalizing and syncing content among any number of content sources. This makes the visual editing environment the perfect candidate for triggering content, workflow, automation, and other tasks for a site. There are multiple points at which actions can hook into Visual Editor and content flow. See below for explanations, use cases, and examples. Types of actionsSection titled “Types of actions” There are four types of actions Bulk document actions Model actions Field actions Each action differs in the following location (in the UI) Configuration options Callback parameters See below for use cases and further instruction on working with each of these types. Global actionsSection titled “Global actions” Global actions are performed on the site as a whole. For a Deploy Preview for the current version of a site. Send a custom workflow event to reviewers. Run a performance test on the entire site. Check for broken links throughout the site. These actions are triggered from the top bar, next to the site name. Global actions are configured as a property in the main configuration object. //stackbit.config.tsexport default defineStackbitConfig({ stackbitVersion: \"0.6.0\", contentSources: [ /* ... */ ], actions: [ { type: \"global\", name: \"name_of_action\", options => { // Perform the action ... } // Other options ... } ]}); See the configuration reference for more information. Bulk document actionsSection titled “Bulk document actions” Bulk document actions are performed on a selected set of documents. For a set of pages to a translation service. Editors can choose the set of documents on which to trigger the action. Like global actions, bulk actions are configured as a property in the main configuration object, specified by the type property. // stackbit.config.tsexport default defineStackbitConfig({ stackbitVersion: \"0.6.0\", contentSources: [ /* ... */ ], actions: [ { type: \"bulk\", name: \"name_of_action\", options => { // Perform the action ... } // Other options ... } ]}); See the configuration reference for more information. Model actionsSection titled “Model actions” Model actions are performed on an individual document. For an object based on input values Sending a document to a translation service Taking a snapshot of a document in its current state These actions can be triggered where the document context is presented. When defined, it will always appear near the title in page and content editing modes. If using inline editing and if a proper data-sb-object-id annotation has been provided, the triggers will also be available in the toolbar when highlighting the document. Model actions are configured directly on the model definition. (When using a headless CMS, the model definition is an extension of the schema defined in the source.) import { PageModel } from \"@stackbit/types\"; export const = { name: \"Post\", type: \"page\", fields: [], // Other properties ... actions: [ { name: \"generate-title\", label: \"Generate Title\", options => { // Perform the action ... } } ]}; See the reference for more information. Field actionsSection titled “Field actions” Field actions are performed against a field on a document. For AI content for a specific field (optionally based on some input). Suggest fixing spelling and grammar. Fill certain fields with custom data from an external API. Translate a field using an external API. These actions can be triggered wherever the field input is displayed. If using inline editing and proper data-sb-object-id and data-sb-field-path annotations have been provided, the triggers will also be available in the toolbar when highlighting the field. Field actions are configured as a property on a field within a model definition. When using a headless CMS, the model definition is an extension of the schema defined in the source. Adding an action on a field that has been defined in an external schema only requires adding the name to identify the field. import { PageModel } from \"@stackbit/types\"; export const = { name: \"Post\", type: \"page\", fields: [ { name: \"title\", actions: [ { name: \"sanitize-title\", label: \"Sanitize Title\", options => { // Perform the action ... } } ] } ] // Other properties ...}; See the reference for more information. Accept inputSection titled “Accept input” Actions can accept input from editors by supplying the inputFields property with field definitions. These field definitions are identical to Visual Editor schema field definitions. Supported field typesSection titled “Supported field types” The following field types are color date datetime enum html markdown number reference slug string text url Use input dataSection titled “Use input data” The input data is passed to the run function in an inputData object, where the key is the name of the field and the value is the user value. Here's a simple example: // stackbit.config.tsexport default defineStackbitConfig({ actions: [ { type: \"bulk\", name: \"name_of_action\", inputFields: [{ name: \"prompt\", type: \"string\", }], options => { const { prompt } = options.inputData; // Do something with `prompt` ... } } ]}); Handling stateSection titled “Handling state” The action trigger can be given a state to provide feedback to the user. The state can be set in the return object from the run function. Visual Editor will also check for updates to the state using the state property. Supported stateSection titled “Supported state” The following states are disabled hidden running State exampleSection titled “State example” The state function is most useful in long running actions when the state of the action may depend on external factors or maybe the field values of the document itself. Let's assume the run function calls a translation API that submits a whole document and requires humans to translate the content. The whole translation process may take several days. We don't expect the run function to run for several days. Instead, after calling the translation API, the run function will return immediately and return the proper state. const actions = [ { options => { // Do something with the translation API ... return { state: \"running\" }; } }]; This overrides the default Visual Editor behavior, which would change the state back to enabled. Every time the Studio requests the document with that action, the state function will check with the translation service if that document is still being translated or is finished, and return a matching state. const actions = [ { options => { // Check translation status ... return { state: \"...\" }; }, options => { // ... } }]; ExamplesSection titled “Examples” Here are a few more complete examples to help get started with custom actions. Generate a titleSection titled “Generate a title” This is a model action that uses Faker to generate a random title. This is shared for brevity. A more useful application might send a user prompt to an AI service. import { PageModel } from \"@stackbit/types\"; export const = { name: \"Post\", type: \"page\", fields: [{ name: \"title\" /* ... */ }], actions: [ { name: \"generate-title\", label: \"Generate Title\", options => { const { faker } = await import(\"@faker-js/faker\"); const document = options.currentPageDocument; if (!document) return; // Send feedback in the appropriate context const logger = options.getLogger(); logger.debug(`Running generate-title action on page: ${document.id}`); // Generate title const newTitle = faker.lorem.words(4); logger.debug(`Setting title to: ${newTitle}`); // Update the document with the new random title options.contentSourceActions.updateDocument({ document, ( document.srcType ), operations: [ { opType: \"set\", fieldPath: [\"title\"], !.find( field => field.name === \"title\" ) as FieldString, field: { type: \"string\", } } ] }); logger.debug(\"Finished generate-title action\"); } } ]}; Fix formatting on fieldSection titled “Fix formatting on field” In this example, we can force a field into a specific format. (Note that you could more strictly enforce this behavior with document hooks.) import { PageModel } from \"@stackbit/types\"; export const = { name: \"Post\", type: \"page\", fields: [ { type: \"string\", name: \"title\", , actions: [ { name: \"sanitize-title\", label: \"Sanitize Title\", inputFields: [], options => { const document = options.currentPageDocument; if (!document) return; // Send feedback to the appropriate context const logger = options.getLogger(); logger.debug( `Running sanitize-title action on page: ${document.id}` ); // Get the current title const currentTitleField = document.fields.title; if (!currentTitleField || !(\"value\" in currentTitleField)) return; // Clean it up const sanitizedTitle = currentTitleField.value .replace(/\\b(\\w)/g, s => s.toUpperCase()) .trim(); // Store the updated title on the document options.contentSourceActions.updateDocument({ document, ( options.parentDocument.srcType ), operations: [ { opType: \"set\", fieldPath: [\"title\"], , field: { type: \"string\", } } ] }); logger.debug(\"Finished sanitize-title action\"); } } ] } ]}; Status messagesSection titled “Status messages” Status messages allow you to customize a success, error, or other type of message to show users in the visual editor. Custom actions used for status messages use the run method. If a custom action is run from custom control, then the result property can be used. The result is returned to the user when the user executes a custom action in custom control using window.stackbit.runCustomAction: const result = await window.stackbit.runCustomAction({ actionName: 'test' });console.log(result); // result is either `result` attribute returned by custom action// or success/error messages if no `result` provided Success status exampleSection titled “Success status example” To return a success notification, the action’s run method needs to return an object with a success property containing the success message (this is also included in the return type of the run method): { (options) => { return { success: 'Action complete 🎉' } }} Error status exampleSection titled “Error status example” To return an error status, the custom action’s run method needs to return an object with an error property containing a human readable error message. This message can be returned as a result of running customAction from the custom control. The error message will be shown in a standard red notification in the visual : async (options) => { return { error: 'oops, something went wrong' }} The custom action’s run method can also throw an error object. In this case, the error’s message () => { throw new Error('oops, something went wrong');} Or, if the run function is asynchronous, it can reject with an error : async (options) => { await new Promise((resolve, reject) => { setTimeout(() => { reject(new Error('oops, something went wrong 😱')) }, 3000) })} If your handler run method throws an error, the message of the error will be returned as an error property with the prepended string Error running run () { throw new Error('oops') Last 18, 2026 PreviousContent presetsNextDocument hooks Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n//stackbit.config.tsexport default defineStackbitConfig({  stackbitVersion: \"0.6.0\",  contentSources: [    /* ... */  ],  actions: [    {      type: \"global\",      name: \"name_of_action\",      run: async options => {        // Perform the action ...      }      // Other options ...    }  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  stackbitVersion: \"0.6.0\",  contentSources: [    /* ... */  ],  actions: [    {      type: \"bulk\",      name: \"name_of_action\",      run: async options => {        // Perform the action ...      }      // Other options ...    }  ]});\n```\n\nExample:\n```text\nimport { PageModel } from \"@stackbit/types\";\nexport const Post: PageModel = {  name: \"Post\",  type: \"page\",  fields: [],  // Other properties ...  actions: [    {      name: \"generate-title\",      label: \"Generate Title\",      run: async options => {        // Perform the action ...      }    }  ]};\n```\n\nExample:\n```text\nimport { PageModel } from \"@stackbit/types\";\nexport const Post: PageModel = {  name: \"Post\",  type: \"page\",  fields: [    {      name: \"title\",      actions: [        {          name: \"sanitize-title\",          label: \"Sanitize Title\",          run: async options => {            // Perform the action ...          }        }      ]    }  ]  // Other properties ...};\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  actions: [    {      type: \"bulk\",      name: \"name_of_action\",      inputFields: [{ name: \"prompt\", type: \"string\", required: true }],      run: async options => {        const { prompt } = options.inputData;        // Do something with `prompt` ...      }    }  ]});\n```\n\nExample:\n```text\nconst actions = [  {    run: async options => {      // Do something with the translation API ...      return { state: \"running\" };    }  }];\n```\n\nExample:\n```text\nconst actions = [  {    state: async options => {      // Check translation status ...      return { state: \"...\" };    },    run: async options => {      // ...    }  }];\n```\n\nExample:\n```text\nimport { PageModel } from \"@stackbit/types\";\nexport const Post: PageModel = {  name: \"Post\",  type: \"page\",  fields: [{ name: \"title\" /* ... */ }],  actions: [    {      name: \"generate-title\",      label: \"Generate Title\",      run: async options => {        const { faker } = await import(\"@faker-js/faker\");        const document = options.currentPageDocument;        if (!document) return;        // Send feedback in the appropriate context        const logger = options.getLogger();        logger.debug(`Running generate-title action on page: ${document.id}`);        // Generate title        const newTitle = faker.lorem.words(4);        logger.debug(`Setting title to: ${newTitle}`);        // Update the document with the new random title        options.contentSourceActions.updateDocument({          document,          userContext: options.getUserContextForContentSourceType(            document.srcType          ),          operations: [            {              opType: \"set\",              fieldPath: [\"title\"],              modelField: options.model.fields!.find(                field => field.name === \"title\"              ) as FieldString,              field: { type: \"string\", value: newTitle }            }          ]        });        logger.debug(\"Finished generate-title action\");      }    }  ]};\n```\n\nExample:\n```text\nimport { PageModel } from \"@stackbit/types\";\nexport const Post: PageModel = {  name: \"Post\",  type: \"page\",  fields: [    {      type: \"string\",      name: \"title\",      required: true,      actions: [        {          name: \"sanitize-title\",          label: \"Sanitize Title\",          inputFields: [],          run: async options => {            const document = options.currentPageDocument;            if (!document) return;            // Send feedback to the appropriate context            const logger = options.getLogger();            logger.debug(              `Running sanitize-title action on page: ${document.id}`            );            // Get the current title            const currentTitleField = document.fields.title;            if (!currentTitleField || !(\"value\" in currentTitleField)) return;            // Clean it up            const sanitizedTitle = currentTitleField.value              .replace(/\\b(\\w)/g, s => s.toUpperCase())              .trim();            // Store the updated title on the document            options.contentSourceActions.updateDocument({              document,              userContext: options.getUserContextForContentSourceType(                options.parentDocument.srcType              ),              operations: [                {                  opType: \"set\",                  fieldPath: [\"title\"],                  modelField: options.modelField,                  field: { type: \"string\", value: sanitizedTitle }                }              ]            });            logger.debug(\"Finished sanitize-title action\");          }        }      ]    }  ]};\n```\n\nExample:\n```text\nconst result = await window.stackbit.runCustomAction({ actionName: 'test' });console.log(result);\n// result is either `result` attribute returned by custom action// or success/error messages if no `result` provided\n```\n\nExample:\n```text\n{  run: async (options) => {    return {      success: 'Action complete 🎉'    }  }}\n```\n\nExample:\n```text\nrun: async (options) => {  return {    error: 'oops, something went wrong'  }}\n```\n\nExample:\n```text\nrun: async () => {  throw new Error('oops, something went wrong');}\n```\n\nExample:\n```text\nrun: async (options) => {  await new Promise((resolve, reject) => {    setTimeout(() => {      reject(new Error('oops, something went wrong 😱'))    }, 3000)  })}\n```\n\nExample:\n```text\nasync run () {  throw new Error('oops')\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.393Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":15,"totalLines":83,"estimatedTokens":5104}}201{"id":"doc-inline_editor_netlify_docs-b1cce78c","source":"documentation","title":"Inline editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/inline-editor","text":"Example:\n```text\nexport const ComposablePage = (props) => {  return (    <div data-sb-object-id={props.id}>      <h1 data-sb-field-path=\"title\">{props.title}</h1>    </div>  )}\n```\n\nExample:\n```text\n// MyComponent.jsxexport const MyComponent = props => {  return (    <>      <div data-sb-object-id={props.id}>        {/* Scoped to `props.id` */}        <h2 data-sb-field-path=\"heading\">{props.heading}</h2>      </div>      {/* Causes an error because there appears to be no scope for this field path. */}      <div        data-sb-field-path=\"body\"        dangerouslySetInnerHTML={{ __html: props.body }}      />    </>  );};\n```\n\nExample:\n```text\nexport default function Post(props) {  return (    <article data-sb-object-id={props.post.id}>      <h1 data-sb-field-path=\"title\">{props.post.title}</h1>      <div data-sb-object-id={props.post.author.id}>        <span data-sb-field-path=\"name\">{props.post.author.name}</span>      </div>    </article>  );}\n```\n\nExample:\n```text\n{  \"id\": \"1\",  \"type\": \"Post\",  \"title\": \"Blog Post Title\",  \"body\": \"<p>Hello World</p>\"}\n```\n\nExample:\n```text\nexport default function Post(props) {  return (    <article data-sb-object-id={props.post.id}>      <h1 data-sb-field-path=\"title\">{props.post.title}</h1>      <Markdown content={props.body} />    </article>  );}\n```\n\nExample:\n```text\nexport function Markdown(props) {  // Will not be editable unless the field name is `body` in the models  // making use of this component.  return (    <div      data-sb-field-path=\"body\"      dangerouslySetInnerHTML={{ __html: props.body }}    />  );}\n```\n\nExample:\n```text\n// components/Markdown.tsxexport function Markdown(props) {  return (    <div      data-sb-field-path={props.annotation || \"body\"}      dangerouslySetInnerHTML={{ __html: props.body }}    />  );}\n```\n\nExample:\n```text\n{  \"id\": \"1\",  \"type\": \"Post\",  \"author\": {    \"name\": \"Stephen King\"  }}\n```\n\nExample:\n```text\nexport default function Post(props) {  return (    <article data-sb-object-id={props.post.id}>      <div data-sb-field-path=\"author\">        <span data-sb-field-path=\".name\">{props.post.author.name}</span>      </div>    </article>  );}\n```\n\nExample:\n```text\nexport default function Post(props) {  return (    <article data-sb-object-id={props.post.id}>      <span data-sb-field-path=\"author.name\">{props.post.author.name}</span>    </article>  );}\n```\n\nExample:\n```text\nexport default function Post(props) {  return (    <article data-sb-object-id={props.post.id}>      <div data-sb-field-path=\"authors\">        {props.post.authors.map((author, index) => (          <span data-sb-field-path={`.${index}.name`}>            {props.post.author.name}          </span>        ))}      </div>    </article>  );}\n```\n\nExample:\n```text\n<article data-sb-object-id=\"1\">  <div data-sb-field-path=\"authors\">    <span data-sb-field-path=\".0.name\">Stephen King</span>    <span data-sb-field-path=\".1.name\">Dr. Seuss</span>  </div></article>\n```\n\nExample:\n```text\nexport function Post(props) {  return (    <div>      <span data-sb-field-path={`${props.post.id}:author.name`}>        {props.post.author.name}      </span>    </div>  );}\n```\n\nExample:\n```text\nexport function Post(props) {  return (    <div data-sb-field-path=\"title#text()[0]\">      {props.title}      <span>...</span>    </div>  );}\n```\n\nExample:\n```text\nexport function MyComponent(props) {  return (    <div className=\"author\" data-sb-field-path=\"first_name last_name\">      {author.first_name} {author.last_name}    </div>  );}\n```\n\nExample:\n```text\nexport function MyComponent(props) {  return (    <div className=\"author\">      <span data-sb-field-path=\"first_name\">{author.first_name}</span>      <span data-sb-field-path=\"last_name\">{author.last_name}</span>    </div>  );}\n```\n\nExample:\n```text\nexport function MyComponent(props) {  return (    <div data-sb-field-path=\"title#text()[0]\">      {props.title}      <span>...</span>    </div>  );}\n```\n\nExample:\n```text\nexport function MyComponent(props) {  return (    <div data-sb-field-path=\"title#text()[0] subtitle#text()[2]\">      {props.title}      <span>...</span>      {props.subtitle}    </div>  );}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.394Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":18,"totalLines":91,"estimatedTokens":1038}}202{"id":"doc-field_groups_netlify_docs-a21f6eae","source":"documentation","title":"Field groups | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/field-groups/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Default field group Customize field groups Use icons styles group On this page Overview Default field group Customize field groups Use icons styles group For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", modelExtensions: [ { name: \"hero\", fieldGroups: [{ name: \"styles\", label: \"Styles\", icon: \"palette\" }], fields: [{ name: \"bgColor\", group: \"styles\" }] } ]}); The result would show Content and Styles tabs, similar to the image at the top of this document. Last 23, 2025 PreviousField controlsNextInline editor Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  modelExtensions: [    {      name: \"hero\",      fieldGroups: [{ name: \"styles\", label: \"Styles\", icon: \"palette\" }],      fields: [{ name: \"bgColor\", group: \"styles\" }]    }  ]});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.395Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":9,"estimatedTokens":882}}203{"id":"doc-use_visual_editor_with_next_js_netlify_docs-d5b48cf4","source":"documentation","title":"Use Visual Editor with Next.js | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/frameworks/next/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Visual Editor for a Next.js project Dev command with cloud setup Content reload pnpm support Examples On this page Overview Configure Visual Editor for a Next.js project Dev command with cloud setup Content reload pnpm support Examples For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", ssgName: \"nextjs\", nodeVersion: \"18\" // ...}); Dev command with cloud setupSection titled “Dev command with cloud setup” When not working locally and using the cloud setup, the visual editor will launch the Next.js server by directly running next dev. (It does not run npm run dev.) If you need to use a different command, use the devCommand property. Content reloadSection titled “Content reload” When Visual Editor detects content changes, it will automatically call Next's router.replace() function to refresh the current page shown in Visual Editor. This maintains client-side state and does not trigger a full page reload. You can override this behavior in part or in full to implement site-specific optimizations. See Automatic Content Reload. pnpm supportSection titled “pnpm support” The visual editor supports using pnpm with a Next.js project but requires that you set the devCommand config option. // stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", ssgName: \"nextjs\", nodeVersion: \"18\", devCommand: \"node_modules/.bin/next dev -- --port {PORT} --hostname 127.0.0.1\" // ...}); ExamplesSection titled “Examples” Here are our most popular Next.js starter Ops Starter TypeScript Starter Contentful Starter Last 14, 2025 PreviousHydrogenNextNuxt 3 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  ssgName: \"nextjs\",  nodeVersion: \"18\"  // ...});\n```\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  ssgName: \"nextjs\",  nodeVersion: \"18\",  devCommand: \"node_modules/.bin/next dev -- --port {PORT} --hostname 127.0.0.1\"  // ...});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.396Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":15,"estimatedTokens":1205}}204{"id":"doc-sidebar_buttons_netlify_docs-98b5ae04","source":"documentation","title":"Sidebar buttons | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/sidebar-buttons/","text":"Example:\n```text\n// stackbit.config.jsexport default {  sidebarButtons: [    {      label: \"Site management\",      type: \"model\",      icon: \"tools\",      modelName: \"SiteConfig\"    }  ]};\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  sidebarButtons: [    {      label: \"Specific document\",      type: \"document\",      icon: \"user-management\",      documentId: \"content/data/config.json\"    }  ]};\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  sidebarButtons: [    {      label: \"Document in specific content source\",      type: \"document\",      icon: \"user-management\",      documentId: \"hGa71n3gba8\",      srcType: \"contentful\",      srcProjectId: process.env.CONTENTFUL_SPACE_ID    }  ]};\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  sidebarButtons: [    {      label: \"Internal page\",      type: \"link\",      icon: \"analytics\",      url: \"/internal-page\"    }  ]};\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  sidebarButtons: [    {      label: \"External link\",      type: \"link\",      icon: \"external-link\",      url: \"my-live-site.com\"    }  ]};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.397Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":5,"totalLines":26,"estimatedTokens":283}}205{"id":"doc-field_controls_netlify_docs-1668a96c","source":"documentation","title":"Field controls | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/field-controls/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Automatic control inference Customize control types options On this page Overview Automatic control inference Customize control types options For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", modelExtensions: [ { name: \"grid\", fields: [ { name: \"arrangement\", controlType: \"thumbnails\", options: [ { label: \"Two column grid\", value: \"two-col-grid\", thumbnail: \"https://assets.stackbit.com/components/images/default/two-col-grid.png\" }, { label: \"Three column grid\", value: \"three-col-grid\", thumbnail: \"https://assets.stackbit.com/components/images/default/three-col-grid.png\" } // ... ] } ] } ]}); Last 23, 2025 PreviousCustom fieldsNextField groups Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  modelExtensions: [    {      name: \"grid\",      fields: [        {          name: \"arrangement\",          controlType: \"thumbnails\",          options: [            {              label: \"Two column grid\",              value: \"two-col-grid\",              thumbnail:                \"https://assets.stackbit.com/components/images/default/two-col-grid.png\"            },            {              label: \"Three column grid\",              value: \"three-col-grid\",              thumbnail:                \"https://assets.stackbit.com/components/images/default/three-col-grid.png\"            }            // ...          ]        }      ]    }  ]});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.397Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":9,"estimatedTokens":1032}}206{"id":"doc-content_editor_netlify_docs-eb5e8212","source":"documentation","title":"Content editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/content-editor/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure columns Filter documents Search Field filters Filter control Available field controls Multiple filters Filter groups Filter references Visible models Content source exceptions On this page Overview Configure columns Filter documents Search Field filters Filter control Available field controls Multiple filters Filter groups Filter references Visible models Content source exceptions For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Visual Editing / Content editor Copy page View as Markdown Copy as Markdown View as Markdown The content editor is a way to quickly edit structured pages and data objects. This is similar to traditional form-based editing within a CMS. The editor distinguishes between models (content types, collections, etc.) that represent pages and those that may globally affect any page on the site. The editor can always navigate content by content type using the list view. Additionally, teams have the option of implementing a dedicated tree view, for example, for sitemap navigation or to navigate content using categories. Configure columnsSection titled “Configure columns” The table in the content editor can be customized by clicking on the gear icon to the right of the column headers. The columns available are dependent on the current context. Document metadata is always available. When filtering by a content type, fields specific to that content type will also be available. This selection is unique to each user and will not affect views for other users. Filter documentsSection titled “Filter documents” Various filtering methods make it easier to pinpoint specific documents (entries, items, etc.) within the available models. SearchSection titled “Search” Using the search field will look into all documents (of all content types) and return results for that search. To get all the matches for a particular content type, use the Type a model, searching filters the list of visible documents based on the query. Field filtersSection titled “Field filters” It is possible to filter content entries both by metadata (e.g. the shared createdAt property, document status, etc.) or by individual fields, including references (e.g. posts with a specific author). Filter controlSection titled “Filter control” Field filters are controlled by the filter button next to the search input. Add as many filters as necessary to pinpoint the right subset of content. Available field controlsSection titled “Available field controls” The available fields change context based on documents available in the current viewing documents within a model, fields for that model will be shown. When viewing a models list, Visual Editor metadata fields will be available (createdAt, updatedAt, status, scheduledForPublish, scheduledDate). Content source exceptions Git CMS doesn’t provide accurate metadata for “Created” and “Modified” dates by default since data is only read from your working branch. These columns are therefore not available in the content editor. Multiple filtersSection titled “Multiple filters” Filters can be combined with an option to match any (OR) or all (AND) of the filters. When more than two filters are used, all filters inherit the first chosen operator (AND/OR). Filter groupsSection titled “Filter groups” Filters can be grouped together to create more complex filters. When using groups with multiple filters, the group's operator will always be the inverse of the first filter's operator. For example, if the filters are using AND, the filters within each group will use OR. Filter referencesSection titled “Filter references” When filtering by referenced objects, you’ll be prompted to select existing content entries. Opening the select dropdown will trigger a modal from which you can choose the appropriate entry. After choosing the appropriate document(s) and clicking Select, the selected documents will appear in the filter control. Visible modelsSection titled “Visible models” Visual Editor shows page and data models in the content tab, determined by the type property set on the model. Getting models to appear in the pages section often requires using the modelExtensions configuration property to set the type property for page models. Content source exceptionsSection titled “Content source exceptions” Some content sources have specific behavior on how models are inferred by Visual Editor. Refer to content source integrations for more information. Last 14, 2025 PreviousOverviewNextCustom fields Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.398Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1789}}207{"id":"doc-visual_editing_overview_netlify_docs-99ad5fe1","source":"documentation","title":"Visual editing overview | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Editing methods Page editor Content editor Inline editor Editor extensions Sidebar shortcuts Field controls Field groups Custom fields Additional features Document statuses On this page Overview Editing methods Page editor Content editor Inline editor Editor extensions Sidebar shortcuts Field controls Field groups Custom fields Additional features Document statuses For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Visual editing overview Copy page View as Markdown Copy as Markdown View as Markdown Understand methods for adjusting code and content in Visual Editor. Editing methodsSection titled “Editing methods” The visual editor is an editing application that provides three different ways to directly edit code and content. Page panel that changes based on the context of the current page in the preview. Content CMS mode, with the ability to edit content within page and data models. Inline around elements in the preview that enable direct, in-place editing. While inline editing is done directly on the preview, all others are enabled through icons on the left sidebar in the visual editing application. Page editorSection titled “Page editor” The page editor is a panel on the left side of the screen that changes context based on actions taken within the preview and sitemap navigator. Learn more about Visual Editor's page editor→ Content editorSection titled “Content editor” The content editor provides a means to quickly edit structured pages and data objects. This is similar to traditional form-based editing within a CMS. Learn more about Visual Editor's content editor→ Inline editorSection titled “Inline editor” Visual Editor provides the ability to make changes directly in the preview by clicking directly on editable content. Learn more about Visual Editor's inline editor→ Editor extensionsSection titled “Editor extensions” These editing methods can be further customized with various editing features. Sidebar Shortcuts customize sidebar buttons in Visual Editor. Field form fields are displayed for content editors. Field up form fields into tabbed groups. Custom your own field controls. Sidebar shortcutsSection titled “Sidebar shortcuts” Custom buttons can be added to the sidebar as direct links and shortcuts to content or editing controls. Learn more about customizing the sidebar→ Field controlsSection titled “Field controls” Visual Editor infers field editor controls as best as possible. Fields can then be further customized through model extensions. Learn more about customizing field controls→ Field groupsSection titled “Field groups” Fields can be broken up into tabbed groups for better organization when using the page or content editors. Learn more about grouping fields→ Custom fieldsSection titled “Custom fields” When the default field controls are not enough, you can bring your own custom field controls. Learn more about custom fields→ Additional featuresSection titled “Additional features” This section contains additional features to aid with visual editing. Document statusesSection titled “Document statuses” Document titles are paired with labels (in some cases) to indicate their current status, providing a quick visual representation of the state of content. Learn more about document status labels→ Last 14, 2025 PreviousSvelteKitNextContent editor Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.399Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1499}}208{"id":"doc-use_visual_editor_with_sveltekit_netlify_docs-62bfbc60","source":"documentation","title":"Use Visual Editor with SvelteKit | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/frameworks/sveltekit/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Visual Editor for a SvelteKit project Content reload Example On this page Overview Configure Visual Editor for a SvelteKit project Content reload Example For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Frameworks / Use Visual Editor with SvelteKit Copy page View as Markdown Copy as Markdown View as Markdown Learn how to use Visual Editor with a SvelteKit-based website. Warning SvelteKit is an up-and-coming framework gathering enthusiastic support. However, at the time of writing, SvelteKit is still in beta and breaking changes are expected and indeed released from time to time.When upgrading package versions, code changes may be necessary for either development and/or building for production. Configure Visual Editor for a SvelteKit projectSection titled “Configure Visual Editor for a SvelteKit project” SvelteKit is supported through the option (learn more. Follow the example repository for a concrete example of integrating Visual Editor with a SvelteKit. Here's an excerpt from Visual Editor configuration file: // stackbit.config.jsexport default { stackbitVersion: \"~0.6.0\", cmsName: \"contentful\", nodeVersion: \"16\", ssgName: \"custom\", devCommand: \"./node_modules/.bin/vite --port {PORT}\", experimental: { ssg: { name: \"sveltekit\", logPatterns: { up: [\" ready in \"] }, passthrough: [\"/vite-hmr/**\"] } }}; Note the use of some experimental configuration properties to ensure compatibility with Vite (the development server used by SvelteKit and others): experimental.ssg.logPatterns.up is set to [' ready in ']. This is part of the log message that appears when the Vite dev server is ready to accept requests. experimental.ssg.passthrough is set to a dedicated relative path to Vite's HMR Websocket endpoint. The path '/vite-hmr/' is configured accordingly in vite.config.js (see here. With this setting, any code changes will trigger a client refresh through Vite's HMR mechanism, without interference from our container. Content reloadSection titled “Content reload” In the example repository, content changes are handled the 'stackbitObjectsChanged' window event. Then, invalidating the JSON endpoint providing data to the current page, which will cause the current page to refresh. This behavior is found at the root __layout.svelte file, which enables it across the website without needing to further modify any other module. Here are the contents of this file (source: <script context=\"module\"> export async function load({ url }) { return { props: { , }, }; }</script> <script> import { invalidate } from \"$app/navigation\"; export let currentUrl; function onContentChange(event) { invalidate(`${currentUrl}.json`); console.log(\"Content update - invalidating current page\"); }</script> <svelte:window |preventDefault={onContentChange}/> <slot /> ExampleSection titled “Example” SvelteKit + Contentful Example. Originally adopted from this demo on GitHub, with added Visual Editor support and modifications for compatibility with the latest version of SvelteKit. Last 14, 2025 PreviousNuxt 3NextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.jsexport default {  stackbitVersion: \"~0.6.0\",  cmsName: \"contentful\",  nodeVersion: \"16\",  ssgName: \"custom\",  devCommand: \"./node_modules/.bin/vite --port {PORT}\",  experimental: {    ssg: {      name: \"sveltekit\",      logPatterns: { up: [\" ready in \"] },      passthrough: [\"/vite-hmr/**\"]    }  }};\n```\n\nExample:\n```text\n<script context=\"module\">  export async function load({ url }) {    return {      props: {        currentUrl: url.pathname,      },    };  }</script>\n<script>  import { invalidate } from \"$app/navigation\";  export let currentUrl;\n  function onContentChange(event) {    invalidate(`${currentUrl}.json`);    console.log(\"Content update - invalidating current page\");  }</script>\n<svelte:window  on:stackbitObjectsChanged|preventDefault={onContentChange}/>\n<slot />\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.399Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":17,"estimatedTokens":1637}}209{"id":"doc-checklists_overview_netlify_docs-954640ad","source":"documentation","title":"Checklists overview | Netlify Docs","url":"https://docs.netlify.com/resources/checklists/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Checklists Checklists Overview Production checklist Onboard to Pro checklist Security checklist Vercel to Netlify migration checklist On this page Overview Available checklists On this page Overview Available checklists For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Checklists / Checklists overview Copy page View as Markdown Copy as Markdown View as Markdown Ensure your Netlify projects are secure and ready for production with our checklists. Use them to plan your projects or to give your AI tools or agents to further customize or check for completeness. Available checklistsSection titled “Available checklists” Production checklist - Essential steps before launching your project to production Onboard to Pro checklist - Get your team set up for collaboration, billing stability, and production readiness on Netlify Pro Security checklist - Security best practices for your Netlify projects Last 1, 2026 PreviousVercel to Netlify migration with AI agentNextProduction checklist Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.400Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":634}}210{"id":"doc-api_cli_guides_netlify_docs-3ca8ba51","source":"documentation","title":"API & CLI Guides | Netlify Docs","url":"https://docs.netlify.com/api-and-cli-guides/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI API & CLI guides API & CLI guides Overview API guides Get started with API Deploy project from a zip file with API Deploy zip file to production More API guides API reference docs Go client JS client CLI guides Get started with CLI Local development Manage functions Debug with VSCode More CLI guides CLI reference docs On this page Overview API Guides CLI Guides On this page Overview API Guides CLI Guides For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 API And CLI Guides / API & CLI Guides Copy page View as Markdown Copy as Markdown View as Markdown Learn best practices from our guides on working with the Netlify API & CLI. API GuidesSection titled “API Guides” Learn how to integrate with Netlify's REST API to programmatically manage your projects, deploys, and more. You can also start a new project directly from the Netlify API as the video link below shows. CLI GuidesSection titled “CLI Guides” Discover how to use the Netlify CLI for local development, deploy and project management. You can also start a new project directly from the Netlify CLI as the video link below shows. Last 25, 2025 PreviousBecome AI partnerNextGet started with API Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.400Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":674}}211{"id":"doc-custom_fields_netlify_docs-9bcb4124","source":"documentation","title":"Custom fields | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/custom-fields/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Types of custom fields Inline fields Modal fields How custom fields work Field types vs control types Hook into the editor Use JavaScript bundle Best practices HTML file location Add styles Use external assets Avoid public directories Emoji field example Emoji field React example On this page Overview Types of custom fields Inline fields Modal fields How custom fields work Field types vs control types Hook into the editor Use JavaScript bundle Best practices HTML file location Add styles Use external assets Avoid public directories Emoji field example Emoji field React example For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export const = { name: \"HeroSection\", type: \"object\", fields: [ { type: \"string\", name: \"title\", label: \"Heading\" }, { type: \"string\", name: \"emoji\", controlType: \"custom-inline-html\", controlFilePath: \".stackbit/fields/emoji.html\" } ]}; In the example above, the emoji field is defined as a string field type, but the controlType is set to custom-inline-html. This field is presented as an iframe using the contents of ; window.stackbit.onUpdate = options => { if (options.init) { const buttons = document.querySelectorAll(\"button\"); buttons.forEach(button => button.addEventListener(\"click\", event => { // Update the field's value ... }) ); } };</script> Tip It is safest to manually initialize the window.stackbit object, as it may not be available when the script is executed. See below for a more complete example. Use JavaScript bundleSection titled “Use JavaScript bundle” When controlType is set to either custom-inline-script or custom-modal-script, the visual editor expects that value of controlFilePath is a link to the JavaScript bundle. The visual editor will cache the code of the control, making it render faster. Also, React and ReactDOM is exposed within the iframe, which decreases and optimizes the bundle size of the custom control. Read more about controlFilePath. Best practicesSection titled “Best practices” This section provides some common practices for working with custom fields, before moving on to an example. HTML file locationSection titled “HTML file location” The HTML file can be placed anywhere in the project. Because Visual Editor plays no role in production, we recommend that this be placed in a directory that isn’t published to the web and that doesn’t interfere with your application. In the examples shared in this doc, we’re using a button { solid { background: // Safely initialize the stackbit objectwindow.stackbit = window.stackbit || {}; window.stackbit.onUpdate = options => { // Helper function to get the current value of the field. This is most useful // when a document has nested content fields. function getCurrentValue() { try { return options.fieldPath.reduce((acc, curr) => { const newValue = acc[curr]; if (\"items\" in newValue) return newValue.items; if (\"fields\" in newValue) return newValue.fields; return newValue; }, options.document.fields).value; } catch (err) { return; } } // Use the init option to attach event listeners to elements within the custom // field. if (options.init) { const currentValue = getCurrentValue(); // Highlight the currently selected emoji if (currentValue) { document \"]`) ); // Attach click event listeners to each button document.querySelectorAll(\"button\").forEach(button => button.addEventListener(\"click\", event => { const value = event.target.dataset.value; // Update the document in the content source with the selected value options .updateDocument({ operations: [ { opType: \"set\", , , field: { ?.type ?? \"string\", value } } ] }) // Highlight the selected emoji after content has been updated ) ); }) ); }}; Emoji field React exampleSection titled “Emoji field React example” This example shows how to create the same emoji component, but using React. This control can be used when setting controlType to either custom-inline-script or custom-modal-script. webpack.config.js emoji.css emoji.js module.exports = { entry: './index.tsx', output: { (__dirname, 'dist'), filename: 'index.js' }, // decrease bundle size by using React as external dependency externals: { react: 'React', 'react-dom': 'ReactDOM' }, externalsType: 'global'}; body { %;} button { solid { * as React from \"react\";import * as ReactDOM from \"react-dom/client\"; const Emojis = [ { name: \"grinning\", emoji: \"😃\" }, { name: \"slightly_smiling_face\", emoji: \"🙂\" }, { name: \"neutral_face\", emoji: \"😐\" }, { name: \"slightly_frowning_face\", emoji: \"🙁\" }, { name: \"frowning_face\", emoji: \"☹️\" }]; function Component() { const [value, setValue] = React.useState(\"\"); React.useEffect(() => { // Safely initialize the stackbit object if (!window.stackbit) { window.stackbit = {}; } const handler = (options) => { setValue(options.documentField?.value ?? \"\"); if (options.init) { // Set the desired size of the control. options.setDesiredControlSize({ , }); } }; if (window.stackbit.options) { window.stackbit.options.setDesiredControlSize({ , }); handler(window.stackbit.options); } window.stackbit.onUpdate = handler; return () => { delete window.stackbit!.onUpdate; }; }, []); return ( <div class=\"grid\"> {Emojis.map(({ emoji, name }) => ( <button key={name} className={value === name ? \"active\" : \"\"} onClick={() => { const options = window.stackbit.options; if (!options) { return; } options.updateDocument({ operations: [ { opType: \"set\", , , field: { ?.type ?? \"string\", value } } ] }).catch((err) => { console.error(\"Could not update emoji field\", err); }); }} > {emoji} </button> ))} </div> );} const root = document.getElementById(\"root\") ?? document.body;ReactDOM.createRoot(root).render(<Component />); Last 25, 2025 PreviousContent editorNextField controls Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { ObjectModel } from \"@stackbit/types\";\nexport const HeroSection: ObjectModel = {  name: \"HeroSection\",  type: \"object\",  fields: [    {      type: \"string\",      name: \"title\",      label: \"Heading\"    },    {      type: \"string\",      name: \"emoji\",      controlType: \"custom-inline-html\",      controlFilePath: \".stackbit/fields/emoji.html\"    }  ]};\n```\n\nExample:\n```text\n<script>  window.stackbit = window.stackbit || {};\n  window.stackbit.onUpdate = options => {    if (options.init) {      const buttons = document.querySelectorAll(\"button\");      buttons.forEach(button =>        button.addEventListener(\"click\", event => {          // Update the field's value ...        })      );    }  };</script>\n```\n\nExample:\n```text\n<!DOCTYPE html><html lang=\"en\">  <head>    <!-- ... -->    <link rel=\"stylesheet\" href=\"emoji.css\" />  </head>  <body>    <!-- ... -->\n    <script src=\"emoji.js\"></script>  </body></html>\n```\n\nExample:\n```text\n<!DOCTYPE html><html lang=\"en\">  <head>    <meta charset=\"UTF-8\" />    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />    <title>Emoji Field</title>    <link rel=\"stylesheet\" href=\"emoji.css\" />  </head>  <body>    <div class=\"grid\">      <button data-value=\"grinning\">😃</button>      <button data-value=\"slightly_smiling_face\">🙂</button>      <button data-value=\"neutral_face\">😐</button>      <button data-value=\"slightly_frowning_face\">🙁</button>      <button data-value=\"frowning_face\">☹️</button>    </div>\n    <script src=\"emoji.js\"></script>  </body></html>\n```\n\nExample:\n```text\nbody {  max-width: 100%;}\nbutton {  font-size: 2rem;  padding: 0.5rem;  background: none;  cursor: pointer;  border: 1px solid #cfcfcf;  border-radius: 0.25rem;  line-height: 1;  transition: background 0.3s ease;}\nbutton.active {  border-color: teal;}\nbutton:hover {  background: #efefef;}\n.grid {  display: flex;  gap: 1rem;}\n```\n\nExample:\n```text\n// Safely initialize the stackbit objectwindow.stackbit = window.stackbit || {};\nwindow.stackbit.onUpdate = options => {  // Helper function to get the current value of the field. This is most useful  // when a document has nested content fields.  function getCurrentValue() {    try {      return options.fieldPath.reduce((acc, curr) => {        const newValue = acc[curr];        if (\"items\" in newValue) return newValue.items;        if (\"fields\" in newValue) return newValue.fields;        return newValue;      }, options.document.fields).value;    } catch (err) {      return;    }  }\n  // Use the init option to attach event listeners to elements within the custom  // field.  if (options.init) {    const currentValue = getCurrentValue();    // Highlight the currently selected emoji    if (currentValue) {      document        .querySelector(`button[data-value=\"${currentValue}\"]`)        .classList.add(\"active\");    }\n    // Set the desired size of the control.    options.setDesiredControlSize({ width: 350, height: 60 });\n    // Attach click event listeners to each button    document.querySelectorAll(\"button\").forEach(button =>      button.addEventListener(\"click\", event => {        const value = event.target.dataset.value;        // Update the document in the content source with the selected value        options          .updateDocument({            operations: [              {                opType: \"set\",                fieldPath: options.fieldPath,                modelField: options.modelField,                field: { type: options.fieldModel?.type ?? \"string\", value }              }            ]          })          // Highlight the selected emoji after content has been updated          .then(() => {            document              .querySelectorAll(\"button\")              .forEach(button => button.classList.remove(\"active\"));            document              .querySelector(`button[data-value=\"${value}\"]`)              .classList.add(\"active\");          })          .catch(err => {            console.error(\"Could not update emoji field\", err);          });      })    );  }};\n```\n\nExample:\n```text\nmodule.exports = {  entry: './index.tsx',  output: {    path: path.resolve(__dirname, 'dist'),    filename: 'index.js'  },\n  // decrease bundle size by using React as external dependency  externals: {    react: 'React',    'react-dom': 'ReactDOM'  },  externalsType: 'global'};\n```\n\nExample:\n```text\nimport * as React from \"react\";import * as ReactDOM from \"react-dom/client\";\nconst Emojis = [  { name: \"grinning\", emoji: \"😃\" },  { name: \"slightly_smiling_face\", emoji: \"🙂\" },  { name: \"neutral_face\", emoji: \"😐\" },  { name: \"slightly_frowning_face\", emoji: \"🙁\" },  { name: \"frowning_face\", emoji: \"☹️\" }];\nfunction Component() {  const [value, setValue] = React.useState(\"\");\n  React.useEffect(() => {    // Safely initialize the stackbit object    if (!window.stackbit) {      window.stackbit = {};    }\n    const handler = (options) => {      setValue(options.documentField?.value ?? \"\");\n      if (options.init) {        // Set the desired size of the control.        options.setDesiredControlSize({ width: 350, height: 60 });      }    };\n    if (window.stackbit.options) {        window.stackbit.options.setDesiredControlSize({ width: 100, height: 600 });        handler(window.stackbit.options);    }    window.stackbit.onUpdate = handler;\n    return () => {        delete window.stackbit!.onUpdate;    };  }, []);\n  return (    <div class=\"grid\">      {Emojis.map(({ emoji, name }) => (        <button          key={name}          className={value === name ? \"active\" : \"\"}          onClick={() => {            const options = window.stackbit.options;            if (!options) {                return;            }            options.updateDocument({              operations: [                {                  opType: \"set\",                  fieldPath: options.fieldPath,                  modelField: options.modelField,                  field: {                    type: options.fieldModel?.type ?? \"string\",                    value                  }                }              ]            }).catch((err) => {              console.error(\"Could not update emoji field\", err);            });          }}        >          {emoji}        </button>      ))}    </div>  );}\nconst root = document.getElementById(\"root\") ?? document.body;ReactDOM.createRoot(root).render(<Component />);\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.401Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":8,"totalLines":65,"estimatedTokens":3665}}212{"id":"doc-local_development_with_netlify_cli_netlify_docs-51841435","source":"documentation","title":"Local development with Netlify CLI | Netlify Docs","url":"https://docs.netlify.com/api-and-cli-guides/cli-guides/local-development/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI API & CLI guides API & CLI guides Overview API guides Get started with API Deploy project from a zip file with API Deploy zip file to production More API guides API reference docs Go client JS client CLI guides Get started with CLI Local development Manage functions Debug with VSCode More CLI guides CLI reference docs On this page Overview Get started with Netlify Dev Project detection Project ports Configuration Run an https server for local development Specify custom ports for Netlify Dev More Netlify Dev resources On this page Overview Get started with Netlify Dev Project detection Project ports Configuration Run an https server for local development Specify custom ports for Netlify Dev More Netlify Dev resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 API And CLI Guides / CLI Guides / Local development with Netlify CLI Copy page View as Markdown Copy as Markdown View as Markdown The Netlify CLI brings the functionality of your Netlify production environment directly to your local machine through the dev command. This CLI functionality is also referred to as Netlify Dev. When you use Netlify Dev, the CLI provides a proxy server that includes edge logic for custom headers and redirects, environment variables, and Netlify Functions. It automatically detects tools and frameworks like Gatsby, Hugo, Eleventy, Next.js, and more to configure a local development server that mimics the Netlify production environment. The sections below describe how to get started with Netlify Dev, how project detection and ports work, and how to customize the configuration. You can also access the command reference for dev for more information. Get started with Netlify DevSection titled “Get started with Netlify Dev” Before you begin, make sure you complete the following if you haven't the Netlify CLI. Authenticate with an access token. Link your local project to a Netlify siteID (also called Project ID in the Netlify UI). To do you're joining an existing project, use netlify clone <repo> to clone and link in one command (recommended) If you're setting up a new site, use netlify init to set up continuous deployment If you've already cloned a repository manually, use netlify link to connect it to a Netlify site Site ID same as Project ID Site ID, the API’s site_id, and the NETLIFY_SITE_ID environment variable all hold the same value, which the Netlify UI labels Project ID. To find it in the Netlify UI, go to Project configuration > General > Project information, and copy the value for Project ID. Learn more about Netlify project identifiers. To start a local development server for the build tool you’re using, run the following command from the root of your linked windownetlify dev By default, Netlify Dev runs your project using the configuration and environment variables set for local development with the Netlify CLI. For environment variables, that means those with values set for dev or all deploy contexts. You can use the --context flag to run your project with a different deploy context’s settings and variables. Terminal windownetlify dev --context production Note that environment variables apply to all scopes when running netlify dev. To run a shell command within the Netlify Dev environment, use windownetlify YOUR_SHELL_COMMAND Project detectionSection titled “Project detection” Netlify Dev attempts to detect the site generator or build command that your project uses and run these on your behalf, while adding other development utilities. If you have a JavaScript project, it uses simple heuristics to search for the best package.json script to run for you, so you can use the full flexibility of npm scripts. You also have the option to override framework detection, if needed. 'Override framework detection' The number of frameworks that Netlify Dev can detect is growing but, if the framework you use is not yet supported, you can instruct Netlify Dev to run the project on your behalf. Configure your project’s build command, port, and publish directory with the [dev] block in your netlify.toml file.# sample dev block in the toml# of these fields are optional and should only be used if you need an override[dev] command = \"yarn start\" # Command to start your dev server targetPort = 3000 # The port for your application server, framework, or site generator port = 8888 # The port that the Netlify Dev will be accessible on publish = \"dist\" # If you use a _redirect file, provide the path to your static content folderIf the CLI detects your project incorrectly or detects multiple frameworks, you can specify a framework option to test only one detector against your project.[dev] framework = \"create-react-app\" # or \"#static\" to force a static serverPossible values of framework: #auto (default) to check all available frameworks. The ID for one of the available frameworks, as specified in the .json file for that framework in the Netlify Build repository. #static for a static file server #custom to use the command option to run an app server and targetPort option to connect to it Project portsSection titled “Project ports” When you use Netlify Dev, you may encounter a few different ports — especially if your project uses a static site generator that has its own dev server, like Gatsby. Keep the following in mind when working with Netlify your project uses a framework that we can detect, Netlify Dev will use the framework's conventional ports, so you don't have to supply them yourself. If multiple detectors match your project, we'll ask you to choose. If your site generator runs on a specific port, such as port 8000, you need to specify the port when you run netlify dev. Netlify Dev will connect to that port and route requests successfully to the site generator along with the rest of the local Netlify environment. If you use an unrecognized site generator or framework, or have a server you want Netlify Dev to connect to, you need to specify the port when you run netlify dev. To confirm which port to use for local development with Netlify Dev, search for this box in your console window ┌────────────────────────────────────────────────────────────────────────┐ │ │ │ [Netlify Dev] Server now ready on http://localhost:8888 │ │ │ └────────────────────────────────────────────────────────────────────────┘ ConfigurationSection titled “Configuration” Netlify Dev works without configuration for the majority of users, but you can customize Netlify Dev settings in the [dev] section of the Netlify configuration file. The following sections outline some common configuration options. For a full list of the available properties, refer to the Netlify Dev section of our file-based configuration doc. Run an https server for local developmentSection titled “Run an https server for local development” By default, netlify dev starts an HTTP server. If you require HTTPS, you can configure a certificate and key file for use by netlify dev in your netlify.toml: [dev] [dev.https] certFile = \"cert.pem\" keyFile = \"key.pem\" Self-signed certificates require extra configuration If you’re using a self-signed certificate, you might need to configure your browser to accept it when running on localhost. To enable this setting for Chrome, visit chrome://flags/#allow-insecure-localhost in your browser. Specify custom ports for Netlify DevSection titled “Specify custom ports for Netlify Dev” Netlify Dev allows you to specify custom ports using the following parameters as flags or in a Netlify configuration file (netlify.toml): port for your application server, framework, or site generator port for the Netlify Dev server that you will open in the browser Netlify Dev tries to acquire these ports but if they are already in use by another application, it will throw an error and let you know. [dev] targetPort = 3000 port = 8888 More Netlify Dev resourcesSection titled “More Netlify Dev resources” Command reference for dev Configuration properties for Netlify Dev in netlify.toml Use Netlify CLI with monorepos Manage Functions with Netlify CLI Last 19, 2025 PreviousGet started with CLINextManage functions Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nnetlify dev\n```\n\nExample:\n```text\nnetlify dev --context production\n```\n\nExample:\n```text\nnetlify dev:exec YOUR_SHELL_COMMAND\n```\n\nExample:\n```text\n# sample dev block in the toml# note: each of these fields are optional and should only be used if you need an override[dev]  command = \"yarn start\" # Command to start your dev server  targetPort = 3000 # The port for your application server, framework, or site generator  port = 8888 # The port that the Netlify Dev will be accessible on  publish = \"dist\" # If you use a _redirect file, provide the path to your static content folder\n```\n\nExample:\n```text\n[dev]  framework = \"create-react-app\" # or \"#static\" to force a static server\n```\n\nExample:\n```text\n┌────────────────────────────────────────────────────────────────────────┐   │                                                              │   │   [Netlify Dev] Server now ready on http://localhost:8888    │   │                                                              │   └────────────────────────────────────────────────────────────────────────┘\n```\n\nExample:\n```text\n[dev]  [dev.https]    certFile = \"cert.pem\"    keyFile = \"key.pem\"\n```\n\nExample:\n```text\n[dev]  targetPort = 3000  port = 8888\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.403Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":8,"totalLines":43,"estimatedTokens":2713}}213{"id":"doc-onboard_to_pro_checklist_netlify_docs-d3c19a04","source":"documentation","title":"Onboard to Pro checklist | Netlify Docs","url":"https://docs.netlify.com/resources/checklists/onboard-to-pro/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Checklists Checklists Overview Production checklist Onboard to Pro checklist Security checklist Vercel to Netlify migration checklist On this page Overview Set up your team for collaboration Set up notifications for your workflows Set up security best practices Optimize builds and performance Review metrics Prepare for the unexpected On this page Overview Set up your team for collaboration Set up notifications for your workflows Set up security best practices Optimize builds and performance Review metrics Prepare for the unexpected For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Checklists / Onboard to Pro checklist Copy page View as Markdown Copy as Markdown View as Markdown After upgrading to the Netlify Pro plan, use this checklist to ensure you're getting the most out of the Pro plan. Set up your team for collaborationSection titled “Set up your team for collaboration” Ensure you can collaborate by taking the following actions. The Pro plan includes unlimited team seats, so you can invite as many team members as you need. Invite team members and assign roles and permissions to give each person the minimum level of access they need. Consider adding at least one other Team Owner so that while you're away, someone else can add team members, set permissions, transfer projects, and keep things running smoothly. Set up notifications for your workflowsSection titled “Set up notifications for your workflows” Stay informed about deploy activity, build failures, and usage so your team can respond quickly. Choose whether you want to stay informed about Netlify deploy activity, build failures, and usage through Slack, email, or webhooks, then follow the setup docs for your preferred : Set up the Netlify App for Slack to get deploy notifications, usage alerts, and build status updates in the channels where your team already works. Use Slack channels to keep the right people informed — for example, send deploy notifications to your development channel and usage alerts to a billing channel. Email and email and webhook notifications for deploy events, form submissions, and other activity. Set up security best practicesSection titled “Set up security best practices” Protect your team's code, secrets, and sites with the security features available on Pro. Set up advanced rate limiting to control traffic to your site or specific paths and protect backend services from traffic spikes, excessive scraping, and abuse. Block malicious requests and protect your site from common attacks with Web Application Firewall (WAF) to Protect non-production deploys from unauthorized access so only your team can view work-in-progress. Make environment variables available to only the scopes that need them for tighter control of your sensitive data. Flag your most sensitive values with Secrets Controller to apply stricter security measures and perform secret scanning. Import .env file variables for security and consistency between local and remote builds. If your site is connected to a public repository, review the sensitive variable policy and deploy log visibility settings. Optimize builds and performanceSection titled “Optimize builds and performance” Reduce build times and improve site performance to ship faster and deliver a better experience to your visitors. With the Pro plan, you automatically get support for 3 concurrent builds per Netlify project. Optimize your build performance and build time so your team can spend more time creating and less time waiting. Optimize the size and format of your images with Netlify Image CDN to improve runtime performance and reliability. Optimize the number of files updated for your deploys to reduce deploy times and make the most of Netlify's CDN cache. Configure your serverless functions region closest to your data sources for faster response times. Review metricsSection titled “Review metrics” Get more visibility into your project’s metrics with the Pro a robust Observability chart for your project for the last 30 days. Netlify Observability offers near real-time visibility into your project’s production performance and resource usage. Monitor requests, bandwidth, runtime behavior, functions, and Edge Functions to understand how your web project operates in production, fix errors, and optimize web performance. Visit the Account Usage Insights section in your Billing tab to see usage for bandwidth, web requests, compute for functions, AI inference, and more. Prepare for the unexpectedSection titled “Prepare for the unexpected” Give your team the tools and knowledge to respond quickly to issues. These best practices apply to all Netlify plans. Familiarize your team with rollbacks so they can revert site changes quickly if needed. Plan a maintenance page process for planned or unplanned downtime. Prepare custom error handling for edge function crashes to provide a better experience for your users when issues arise. Fix failed deploys and build errors with Netlify's AI-enabled suggested solutions. Familiarize your team with our tips for requesting support by email so you get faster resolutions when you need help. Last 31, 2026 PreviousProduction checklistNextSecurity checklist Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.404Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1683}}214{"id":"doc-inline_editor_netlify_docs-583a3de1","source":"documentation","title":"Inline editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/inline-editor/","text":"Example:\n```text\nexport const ComposablePage = (props) => {  return (    <div data-sb-object-id={props.id}>      <h1 data-sb-field-path=\"title\">{props.title}</h1>    </div>  )}\n```\n\nExample:\n```text\n// MyComponent.jsxexport const MyComponent = props => {  return (    <>      <div data-sb-object-id={props.id}>        {/* Scoped to `props.id` */}        <h2 data-sb-field-path=\"heading\">{props.heading}</h2>      </div>      {/* Causes an error because there appears to be no scope for this field path. */}      <div        data-sb-field-path=\"body\"        dangerouslySetInnerHTML={{ __html: props.body }}      />    </>  );};\n```\n\nExample:\n```text\nexport default function Post(props) {  return (    <article data-sb-object-id={props.post.id}>      <h1 data-sb-field-path=\"title\">{props.post.title}</h1>      <div data-sb-object-id={props.post.author.id}>        <span data-sb-field-path=\"name\">{props.post.author.name}</span>      </div>    </article>  );}\n```\n\nExample:\n```text\n{  \"id\": \"1\",  \"type\": \"Post\",  \"title\": \"Blog Post Title\",  \"body\": \"<p>Hello World</p>\"}\n```\n\nExample:\n```text\nexport default function Post(props) {  return (    <article data-sb-object-id={props.post.id}>      <h1 data-sb-field-path=\"title\">{props.post.title}</h1>      <Markdown content={props.body} />    </article>  );}\n```\n\nExample:\n```text\nexport function Markdown(props) {  // Will not be editable unless the field name is `body` in the models  // making use of this component.  return (    <div      data-sb-field-path=\"body\"      dangerouslySetInnerHTML={{ __html: props.body }}    />  );}\n```\n\nExample:\n```text\n// components/Markdown.tsxexport function Markdown(props) {  return (    <div      data-sb-field-path={props.annotation || \"body\"}      dangerouslySetInnerHTML={{ __html: props.body }}    />  );}\n```\n\nExample:\n```text\n{  \"id\": \"1\",  \"type\": \"Post\",  \"author\": {    \"name\": \"Stephen King\"  }}\n```\n\nExample:\n```text\nexport default function Post(props) {  return (    <article data-sb-object-id={props.post.id}>      <div data-sb-field-path=\"author\">        <span data-sb-field-path=\".name\">{props.post.author.name}</span>      </div>    </article>  );}\n```\n\nExample:\n```text\nexport default function Post(props) {  return (    <article data-sb-object-id={props.post.id}>      <span data-sb-field-path=\"author.name\">{props.post.author.name}</span>    </article>  );}\n```\n\nExample:\n```text\nexport default function Post(props) {  return (    <article data-sb-object-id={props.post.id}>      <div data-sb-field-path=\"authors\">        {props.post.authors.map((author, index) => (          <span data-sb-field-path={`.${index}.name`}>            {props.post.author.name}          </span>        ))}      </div>    </article>  );}\n```\n\nExample:\n```text\n<article data-sb-object-id=\"1\">  <div data-sb-field-path=\"authors\">    <span data-sb-field-path=\".0.name\">Stephen King</span>    <span data-sb-field-path=\".1.name\">Dr. Seuss</span>  </div></article>\n```\n\nExample:\n```text\nexport function Post(props) {  return (    <div>      <span data-sb-field-path={`${props.post.id}:author.name`}>        {props.post.author.name}      </span>    </div>  );}\n```\n\nExample:\n```text\nexport function Post(props) {  return (    <div data-sb-field-path=\"title#text()[0]\">      {props.title}      <span>...</span>    </div>  );}\n```\n\nExample:\n```text\nexport function MyComponent(props) {  return (    <div className=\"author\" data-sb-field-path=\"first_name last_name\">      {author.first_name} {author.last_name}    </div>  );}\n```\n\nExample:\n```text\nexport function MyComponent(props) {  return (    <div className=\"author\">      <span data-sb-field-path=\"first_name\">{author.first_name}</span>      <span data-sb-field-path=\"last_name\">{author.last_name}</span>    </div>  );}\n```\n\nExample:\n```text\nexport function MyComponent(props) {  return (    <div data-sb-field-path=\"title#text()[0]\">      {props.title}      <span>...</span>    </div>  );}\n```\n\nExample:\n```text\nexport function MyComponent(props) {  return (    <div data-sb-field-path=\"title#text()[0] subtitle#text()[2]\">      {props.title}      <span>...</span>      {props.subtitle}    </div>  );}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.405Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":18,"totalLines":91,"estimatedTokens":1038}}215{"id":"doc-content_sources_overview_netlify_docs-dacc716e","source":"documentation","title":"Content sources overview | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/content-sources/overview","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Example usage CSI and your code Supported sources Experimental sources Use a content source Add multiple sources Authenticate content editor accounts Supported connections Bring your own source Module requirements Using TypeScript Migrate to a new source Configuration example On this page Overview Example usage CSI and your code Supported sources Experimental sources Use a content source Add multiple sources Authenticate content editor accounts Supported connections Bring your own source Module requirements Using TypeScript Migrate to a new source Configuration example For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/cms-contentful\"; export default { contentSources: [ new ContentfulContentSource({ , , , }) ] // ...}; If configured properly, you will immediately be able to see your models in the content panel. You can then drill into any object and see two-way sync in action. Edit it in Visual Editor, and the source gets updated. Edit it in the source, and within moments Visual Editor will show the updated value. CSI and your codeSection titled “CSI and your code” CSI modules and the stackbit.config.js file are not loaded by your site's code. Rather, these are used by Visual Editor’s dev server to load and modify data through Visual Editor. Your own code for fetching data from any of its content sources is not impacted or replaced by the CSI, at all. This means are still responsible for writing the code that retrieves content from your source(s) and feeds them into your pages and components. You don't have to make changes to your site to be able to use CSI (assuming that your content is not hard-coded into your code) Any dependencies needed for CSI can be installed as development dependencies, and are not needed for your live site. Supported sourcesSection titled “Supported sources” The following modules are supported directly by Visual Contentstack DatoCMS Git CMS Hygraph Sanity Experimental sourcesSection titled “Experimental sources” We're currently experimenting with these additional Shopify Figma For inquiries and requests regarding new sources, please contact us. Use a content sourceSection titled “Use a content source” Working with a supported content source takes just a few steps. Assuming you already have the source itself (e.g. the CMS) ready to go, the process usually looks like the NPM package for the module (as a development dependency). Add the content source to the contentSources array in your configuration file. Here's an example that adds Contentful as a content source. // stackbit.config.jsimport { ContentfulContentSource } from \"@stackbit/cms-contentful\"; export default { contentSources: [ new ContentfulContentSource({ , , , }) ] // ...}; Add multiple sourcesSection titled “Add multiple sources” Because contentSources is an array of instantiated classes, adding another source is a matter of adding a new item to the array. This means that using two accounts from the same service provider is also possible. Here's an example: // stackbit.config.jsimport { ContentfulContentSource } from \"@stackbit/cms-contentful\"; export default { contentSources: [ new ContentfulContentSource({ , , , }), new ContentfulContentSource({ , , , }) ] // ...}; Authenticate content editor accountsSection titled “Authenticate content editor accounts” To be able to make changes to content in the source requires connecting a Visual Editor user account to an account to the content source. Here’s the process for making these the visual editor dashboard, in the top right, select your avatar. Next, select Linked accounts. Next to the content source you want, choose Connect. Follow the prompts to connect with your content source. Supported connectionsSection titled “Supported connections” The following third-party connections are Contentstack DatoCMS GitHub Sanity Bring your own sourceSection titled “Bring your own source” Because content source modules are defined as instantiated JavaScript classes in the configuration file, you can bring your own content source, even if not officially supported by Visual Editor. Use the CSI API reference to ensure you're implementing the JavaScript class properly. Module requirementsSection titled “Module requirements” Any content source that can read and write data via an API or direct local access can be used as a content module. This (or API-based) CMS (e.g. Contentful) Database as a Service (e.g. PlanetScale) Internal product database (e.g. PostgreSQL) Non-traditional services (e.g. Figma) File-based content (e.g. Markdown files) Using TypeScriptSection titled “Using TypeScript” We recommend using TypeScript in your CSI module. This benefits both you by ensuring that you implement all necessary methods. It also benefits developers that using the module by making it easier to discover required options when instantiating the class in their configuration file. Migrate to a new sourceSection titled “Migrate to a new source” CSI makes it trivial to migrate to a new content source without sacrificing content downtime or adding complexity to your code. You can move one page at a time from the old source to the new source as long have properly configured the content sources, and ... Your frontend code supports the content structure from both sources. Configuration exampleSection titled “Configuration example” Ensure that you're adding both sources to your config file: // stackbit.config.jsimport { MyOldSource } from \"my-old-source\";import { MyNewSource } from \"my-new-source\"; export default { contentSources: [ new MyOldSource({ // configuration options ... }), new MyNewSource({ // configuration options ... }) ] // ...}; Then you can add a new page to the new source and delete the old page from the old source. Do this one at a time until you've moved all the content to the new content source. Last 25, 2025 PreviousPublishingNextContentful Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.jsimport { ContentfulContentSource } from \"@stackbit/cms-contentful\";\nexport default {  contentSources: [    new ContentfulContentSource({      spaceId: process.env.CONTENTFUL_SPACE_ID,      environment: process.env.CONTENTFUL_ENVIRONMENT,      previewToken: process.env.CONTENTFUL_PREVIEW_TOKEN,      accessToken: process.env.CONTENTFUL_MANAGEMENT_TOKEN    })  ]  // ...};\n```\n\nExample:\n```text\n// stackbit.config.jsimport { ContentfulContentSource } from \"@stackbit/cms-contentful\";\nexport default {  contentSources: [    new ContentfulContentSource({      spaceId: process.env.CONTENTFUL_SPACE_ID_01,      environment: process.env.CONTENTFUL_ENVIRONMENT_01,      previewToken: process.env.CONTENTFUL_PREVIEW_TOKEN_01,      accessToken: process.env.CONTENTFUL_MANAGEMENT_TOKEN_01    }),    new ContentfulContentSource({      spaceId: process.env.CONTENTFUL_SPACE_ID_02,      environment: process.env.CONTENTFUL_ENVIRONMENT_02,      previewToken: process.env.CONTENTFUL_PREVIEW_TOKEN_02,      accessToken: process.env.CONTENTFUL_MANAGEMENT_TOKEN_02    })  ]  // ...};\n```\n\nExample:\n```text\n// stackbit.config.jsimport { MyOldSource } from \"my-old-source\";import { MyNewSource } from \"my-new-source\";\nexport default {  contentSources: [    new MyOldSource({      // configuration options ...    }),    new MyNewSource({      // configuration options ...    })  ]  // ...};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.406Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":21,"estimatedTokens":2468}}216{"id":"doc-onboard_to_pro_checklist_netlify_docs-c42e8183","source":"documentation","title":"Onboard to Pro checklist | Netlify Docs","url":"https://docs.netlify.com/resources/checklists/onboard-to-pro","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Checklists Checklists Overview Production checklist Onboard to Pro checklist Security checklist Vercel to Netlify migration checklist On this page Overview Set up your team for collaboration Set up notifications for your workflows Set up security best practices Optimize builds and performance Review metrics Prepare for the unexpected On this page Overview Set up your team for collaboration Set up notifications for your workflows Set up security best practices Optimize builds and performance Review metrics Prepare for the unexpected For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Checklists / Onboard to Pro checklist Copy page View as Markdown Copy as Markdown View as Markdown After upgrading to the Netlify Pro plan, use this checklist to ensure you're getting the most out of the Pro plan. Set up your team for collaborationSection titled “Set up your team for collaboration” Ensure you can collaborate by taking the following actions. The Pro plan includes unlimited team seats, so you can invite as many team members as you need. Invite team members and assign roles and permissions to give each person the minimum level of access they need. Consider adding at least one other Team Owner so that while you're away, someone else can add team members, set permissions, transfer projects, and keep things running smoothly. Set up notifications for your workflowsSection titled “Set up notifications for your workflows” Stay informed about deploy activity, build failures, and usage so your team can respond quickly. Choose whether you want to stay informed about Netlify deploy activity, build failures, and usage through Slack, email, or webhooks, then follow the setup docs for your preferred : Set up the Netlify App for Slack to get deploy notifications, usage alerts, and build status updates in the channels where your team already works. Use Slack channels to keep the right people informed — for example, send deploy notifications to your development channel and usage alerts to a billing channel. Email and email and webhook notifications for deploy events, form submissions, and other activity. Set up security best practicesSection titled “Set up security best practices” Protect your team's code, secrets, and sites with the security features available on Pro. Set up advanced rate limiting to control traffic to your site or specific paths and protect backend services from traffic spikes, excessive scraping, and abuse. Block malicious requests and protect your site from common attacks with Web Application Firewall (WAF) to Protect non-production deploys from unauthorized access so only your team can view work-in-progress. Make environment variables available to only the scopes that need them for tighter control of your sensitive data. Flag your most sensitive values with Secrets Controller to apply stricter security measures and perform secret scanning. Import .env file variables for security and consistency between local and remote builds. If your site is connected to a public repository, review the sensitive variable policy and deploy log visibility settings. Optimize builds and performanceSection titled “Optimize builds and performance” Reduce build times and improve site performance to ship faster and deliver a better experience to your visitors. With the Pro plan, you automatically get support for 3 concurrent builds per Netlify project. Optimize your build performance and build time so your team can spend more time creating and less time waiting. Optimize the size and format of your images with Netlify Image CDN to improve runtime performance and reliability. Optimize the number of files updated for your deploys to reduce deploy times and make the most of Netlify's CDN cache. Configure your serverless functions region closest to your data sources for faster response times. Review metricsSection titled “Review metrics” Get more visibility into your project’s metrics with the Pro a robust Observability chart for your project for the last 30 days. Netlify Observability offers near real-time visibility into your project’s production performance and resource usage. Monitor requests, bandwidth, runtime behavior, functions, and Edge Functions to understand how your web project operates in production, fix errors, and optimize web performance. Visit the Account Usage Insights section in your Billing tab to see usage for bandwidth, web requests, compute for functions, AI inference, and more. Prepare for the unexpectedSection titled “Prepare for the unexpected” Give your team the tools and knowledge to respond quickly to issues. These best practices apply to all Netlify plans. Familiarize your team with rollbacks so they can revert site changes quickly if needed. Plan a maintenance page process for planned or unplanned downtime. Prepare custom error handling for edge function crashes to provide a better experience for your users when issues arise. Fix failed deploys and build errors with Netlify's AI-enabled suggested solutions. Familiarize your team with our tips for requesting support by email so you get faster resolutions when you need help. Last 31, 2026 PreviousProduction checklistNextSecurity checklist Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.407Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1683}}217{"id":"doc-page_not_found_error_guide_netlify_docs-a7ffd49e","source":"documentation","title":"Page not found error guide | Netlify Docs","url":"https://docs.netlify.com/resources/troubleshooting/page-not-found-error-guide/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Troubleshooting Troubleshooting Overview Ask Netlify Fix a failed deploy Error reference Request chain Page not found error guide Troubleshooting FAQ Support Guides Support scope Support On this page Overview Missing files No index.html file Incorrect publish directory or no publish directory Check for missing files in your deploy Incorrect configuration or routing for your framework Single Page Application redirect rule needed Further support On this page Overview Missing files No index.html file Incorrect publish directory or no publish directory Check for missing files in your deploy Incorrect configuration or routing for your framework Single Page Application redirect rule needed Further support For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Troubleshooting / Page not found error guide Copy page View as Markdown Copy as Markdown View as Markdown Fix the page not found error so you can get your web project working. Page not found error message Page not foundLooks like you've followed a broken link or entered a URL that doesn't exist on this site.If this is your site, and you weren't expecting a 404 for this path, please visit Netlify's \"page not found\" support guide for troubleshooting tips. Missing filesSection titled “Missing files” The most common cause of a page not found error is a missing file. Read on for possible missing files and how to fix this. No index.html fileSection titled “No index.html file” Netlify requires some kind of index.html file to be present in the publish directory to serve your web project. If you don't have one, create this file in your web directory and try again. To check files from your deployed project, you can use the Deploy File your project overview, in the left sidebar, choose Deploys. Select your latest published production deploy. This will be the deploy that your production site/app is live at. Under your Deploy summary and Deploy log, review the file structure under Deploy File Explorer. Incorrect publish directory or no publish directorySection titled “Incorrect publish directory or no publish directory” Netlify requires a publish directory to be specified in your Netlify project settings. To check your publish to Project configuration > Build settings. Choose Configure and enter your publish directory. If you’re not sure which directory, you can check your web framework’s guidelines or try using public or dist as your publish directory. Confirm your changes. Check for missing files in your deploySection titled “Check for missing files in your deploy” To check for missing files in your deploy, use Netlify's Deploy File Explorer. Video transcript for Browsing Deploy Files on Netlify For a long time, you've been able to download a zip file of your deploy in order to inspect the files output by your build on Netlify. However, this process was not always ideal because you would need to download the contents of the entire deploy even if you only wanted to inspect one file.This request to generate the zip file was also prone to fail depending on how many files were in the deploy, and it would take a long time to download the whole thing before it was even ready to inspect.That's now a thing of the past. Netlify lets you browse the distribution files of your deploy like you would browse files on a file system.Beneath the deploy log of every successful deploy, you through folders of your build output Download only the exact files you are looking for Perform a substring search on the file path of each asset to quickly find the resource you had in mind This approach is much faster than downloading a zip file of the entire deploy. We've tested on deploys with over 100,000 files and it still holds up.We'd love your feedback!If you find this feature useful, please leave us a comment. We'd love to know what you think, and if you have any feedback to make this functionality even better, we'd love to hear that too. Incorrect configuration or routing for your frameworkSection titled “Incorrect configuration or routing for your framework” It's possible your project is using a framework that is not routed correctly or set up correctly for use with Netlify. We recommend you verify your routing configuration matches your deployment setup, such as your _redirects file or publish directory. To check your publish to Project configuration > Build settings. Choose Configure and enter your publish directory. If you’re not sure which directory, you can check your web framework’s guidelines or try using public or dist as your publish directory. Confirm your changes. Single Page Application redirect rule neededSection titled “Single Page Application redirect rule needed” If your project is a Single Page Application (SPA), you may need to add a redirect rule to your _redirects file to ensure that all routes are handled by your SPA. Add the following to your _redirects file: /* /index.html 200 Learn more from our Verified Support Guide. Further supportSection titled “Further support” There are even more causes for a page not found error. Learn more about additional causes and troubleshooting tips in our Verified Support Guide on Page not found errors. You can also reach out to Netlify Support for additional help at Netlify Support. Last 24, 2026 PreviousRequest chainNextTroubleshooting FAQ Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n/*    /index.html   200\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.408Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":1725}}218{"id":"doc-manage_functions_with_netlify_cli_netlify_docs-3f7eb49f","source":"documentation","title":"Manage functions with Netlify CLI | Netlify Docs","url":"https://docs.netlify.com/api-and-cli-guides/cli-guides/manage-functions/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI API & CLI guides API & CLI guides Overview API guides Get started with API Deploy project from a zip file with API Deploy zip file to production More API guides API reference docs Go client JS client CLI guides Get started with CLI Local development Manage functions Debug with VSCode More CLI guides CLI reference docs On this page Overview Create serverless functions with Netlify Dev Invoke functions while running Netlify Dev Serve functions with a standalone server locally Debug functions locally On this page Overview Create serverless functions with Netlify Dev Invoke functions while running Netlify Dev Serve functions with a standalone server locally Debug functions locally For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending 'netlify myfunction --querystring \"count=1\"netlify myfunction --payload \"./pathTo.json\" There are special cases for event-triggered functions that will also provide mock data for testing. This makes it possible to manually test event-triggered functions locally and improves the development experience. Serve functions with a standalone server locallySection titled “Serve functions with a standalone server locally” While Netlify Dev will simulate the Netlify production environment, it can be useful to simulate Netlify Functions in a standalone server instead. If you serve functions with a standalone server, you can debug functions without the overhead of starting a framework server. To start a functions server locally, run netlify Your function will be available at http://localhost:9999/.netlify/functions/<function-name> If you configure a functions directory, the server will serve functions from that directory. If not, the server will serve functions from netlify/functions. The default port for the functions server is 9999. To override these settings, use the --functions and --port windownetlify --functions <path-to-dir> --port <port> You can also configure the settings in a netlify.toml, under the dev block: [dev] functions = \"netlify-functions\" functionsPort = 7000 Debug functions locallySection titled “Debug functions locally” Netlify CLI uses Lambda-local to simulate serverless functions. Since the CLI invokes functions in the same process as the functions server, you can debug functions by inspecting the functions server process. To debug, set the --inspect Node.js option when starting the functions Windows, run cmd /V /C \"set NODE_OPTIONS=--inspect && netlify \" On Mac/Linux, run NODE_OPTIONS=--inspect netlify Then, attach any Node.js debugger to the CLI process to debug your functions. To learn how to debug with Visual Studio Code while running the Netlify CLI, review Debug with VS Code. Last 14, 2025 PreviousLocal developmentNextDebug with VSCode Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nnetlify functions:create\n```\n\nExample:\n```text\n# Create a new function from one of the available templates offered# when prompted$ netlify functions:create\n# Create a new function with a given name using either of the# following options$ netlify functions:create hello-world$ netlify functions:create --name hello-world\n# Create a new function by cloning a template from a remote url# organised with dependencies installed into a subdirectory$ netlify functions:create hello-world --url https://my-remote-template-URL\n```\n\nExample:\n```text\nnetlify functions:invoke # we will prompt you at each stepnetlify functions:invoke myfunction # invoke a specific functionnetlify functions:invoke --name myfunction # invoke a specific function\n# sending payloadsnetlify functions:invoke myfunction --payload '{\"count\": 1}'netlify functions:invoke myfunction --querystring \"count=1\"netlify functions:invoke myfunction --payload \"./pathTo.json\"\n```\n\nExample:\n```text\nnetlify functions:serve --functions <path-to-dir> --port <port>\n```\n\nExample:\n```text\n[dev]  functions = \"netlify-functions\"  functionsPort = 7000\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.409Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":5,"totalLines":31,"estimatedTokens":1327}}219{"id":"doc-production_launch_checklist_netlify_docs-4a67447d","source":"documentation","title":"Production launch checklist | Netlify Docs","url":"https://docs.netlify.com/resources/checklists/production-checklist/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Checklists Checklists Overview Production checklist Onboard to Pro checklist Security checklist Vercel to Netlify migration checklist On this page Overview Finalize names Collaborate securely and efficiently Optimize performance and ensure quality Secure your information Prepare for production traffic Communicate with customers Expect the unexpected On this page Overview Finalize names Collaborate securely and efficiently Optimize performance and ensure quality Secure your information Prepare for production traffic Communicate with customers Expect the unexpected For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Checklists / Production launch checklist Copy page View as Markdown Copy as Markdown View as Markdown After you add a new site on Netlify, but before you release it to your customers, consider the following recommendations for getting your project ready for production. Note that not all recommendations apply to all sites. Some recommendations are specific to when certain features are in use. Also, some recommended tasks can be completed once at the team level and apply to future sites you launch. While your project might not warrant taking action on all the recommendations below, we suggest that you at least review them all to consider which recommended tasks would benefit your business. Extra benefits for Pro and Enterprise teams Some of the below recommendations involve features that aren’t available on all plans. Plan requirements are indicated below. Finalize namesSection titled “Finalize names” Make any desired edits to your team name and site name before configuring anything else since some configuration values may depend on these slugs. Collaborate securely and efficientlySection titled “Collaborate securely and efficiently” Configure automatic deploy subdomains for unified branded URLs across your Deploy Previews and branch deploys. If you don’t intend for your branch deploys to be publicly searchable, use custom headers to prevent branch deploys from being indexed by search engines. Invite reviewers to get stakeholder sign-offs using collaborative Deploy Previews. Send your stakeholders the Reviewer quickstart to teach them how to share feedback. Pro and Enterprise teamsSection titled “Pro and Enterprise teams” Set up Slack notifications for team awareness of deploy activity. Protect non-production deploys from unauthorized access. Add team members with the minimum level of permissions required for their work to enable collaboration while keeping your sites secure. Add at least one other Team Owner so that while you’re away from work someone else can add team members, set user permissions, transfer projects, and more to keep things running smoothly. Enterprise teams onlySection titled “Enterprise teams only” Enable and enforce SAML single sign-on for your team (or organization if applicable). Optimize performance and ensure qualitySection titled “Optimize performance and ensure quality” Optimize your build performance and build time so your team can spend more time creating and less time waiting. Optimize the size and format of your images with Netlify Image CDN to improve the runtime performance and reliability of your site. Optimize the number of files updated for your deploys to reduce deploy times and make the most of Netlify’s CDN cache. Create cache key variations to optimize cache performance. Opt out of automatic cache invalidation for proxied responses to optimize cache performance. Add the durable cache for serverless function responses to reduce response times and variability in performance. Cache edge function responses for even faster response times. Customize edge function error handling to fail closed or open depending on your audience and content. Configure your serverless functions region to the closest to your data sources. Add unit testing and integration testing to your site builds. Plan synthetic performance testing to optimize your site performance before your initial launch and avoid performance regressions in the future. For example, set up embedded Lighthouse scores. Enable Web Analytics to monitor trends in site activity. If you want to monitor production traffic only, make Web Analytics distinguish between deployed branches. Pro and Enterprise teamsSection titled “Pro and Enterprise teams” Enable Real User Monitoring to monitor your site's usability and performance. Enterprise teams onlySection titled “Enterprise teams only” Configure Log Drains to pipe data from Netlify’s CDN to third-party monitoring services for analysis, alerting, and data persistence. Secure your informationSection titled “Secure your information” If your site is connected to a public repository, review the following settings to make sure they balance your needs for protecting security and welcoming variable policy. Deploy log visibility. Flag your most sensitive environment variable values with Secrets Controller to apply stricter security measures and perform secret scanning of your code and build output files. Import .env file variables for security and consistency between local and remote builds. Confirm that you haven’t committed any sensitive environment variables to your repository. Pro and Enterprise teamsSection titled “Pro and Enterprise teams” Make variables available to only the scopes that need them for tighter control of your sensitive data. If you have multiple sites, use shared environment variables for non-sensitive values where possible for dev productivity. Enterprise teams onlySection titled “Enterprise teams only” Configure Private Connectivity to reduce the risk to your backend environment. Prepare for production trafficSection titled “Prepare for production traffic” Configure your site for HSTS preload to enhance performance and security. Check for consistent trailing slashes for SEO and enable pretty URLs if needed. Set up a custom 404 page in line with your branding. Work with your legal representation to make sure your site is following all privacy regulations that apply to your site. Then use country-based redirects to show appropriate disclosures and get the appropriate consent per location. Add a custom domain and configure DNS. If you’re using external DNS, confirm that your primary domain is www or another subdomain instead of an apex domain to optimize your use of our CDN. If you plan to have more than 5 domain aliases that are subdomains of the same domain, manage your HTTPS certificates to avoid rate limiting for subdomains. Enterprise teams onlySection titled “Enterprise teams only” Set up Firewall Traffic Rules to permit or block access to your site based on IP address or geographic location. Set up rate limiting rules to protect against API abuse, authentication attacks, and more. If you’re migrating an existing domain you’ve already used, and you have access to premium support, reach out to your dedicated account support team for help working through our Enterprise domain migration launch checklist. If you’re using external DNS, configure your domains to use the High-Performance Edge to benefit from proactive DDoS mitigation and optimize response times and cache hits. If your site will handle HIPAA-regulated data, visit our Trust Center to download our reference architecture for HIPAA-compliant composable sites on Netlify. Communicate with customersSection titled “Communicate with customers” If your business involves up the Netlify Email Integration to send emails and keep your templates version controlled alongside the rest of your project. Set up your domain to receive emails. If you’re using Netlify extra spam prevention. Add an <input> with name=\"email\" to streamline replying to form submitters. Create a custom success page in line with your branding. Create a process for managing sensitive form data. Expect the unexpectedSection titled “Expect the unexpected” Plan a maintenance page process. Familiarize your team with the following tools and in case they need to revert site changes quickly. Manual deploy deletion in case they ever need to remove accidentally deployed sensitive information. Fix failed deploys and build errors with Netlify’s AI-enabled suggested solutions Pro and Enterprise teamsSection titled “Pro and Enterprise teams” Familiarize your team with our tips for requesting support by email. Enterprise teams onlySection titled “Enterprise teams only” Familiarize your team with the following tools and prioritization to reduce wait times for important builds in your team build queue. If you have Premium Support, your dedicated Slack channel and phone number for support. Last 9, 2026 PreviousOverviewNextOnboard to Pro checklist Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.410Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2552}}220{"id":"doc-troubleshoot_ssl_and_https_netlify_docs-e2e6a44b","source":"documentation","title":"Troubleshoot SSL and HTTPS | Netlify Docs","url":"https://docs.netlify.com/manage/domains/troubleshooting/troubleshoot-ssl-and-https","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Check your SSL certificate status Common SSL certificate issues How certificate provisioning works Troubleshooting steps Step 1 - Check DNS configuration Step 2 - Verify DNS propagation Step 3 - Advanced troubleshooting Common issues found by Let's and best practices Still need help? On this page Overview Check your SSL certificate status Common SSL certificate issues How certificate provisioning works Troubleshooting steps Step 1 - Check DNS configuration Step 2 - Verify DNS propagation Step 3 - Advanced troubleshooting Common issues found by Let's and best practices Still need help? For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Troubleshooting / Troubleshoot SSL and HTTPS Copy page View as Markdown Copy as Markdown View as Markdown Learn how to troubleshoot SSL and HTTPS issues so that your web project can be securely served over HTTPS. Check your SSL certificate statusSection titled “Check your SSL certificate status” To check your SSL certificate your Project overview dashboard, go to Domain management > HTTPS. Common SSL certificate issuesSection titled “Common SSL certificate issues” If you're finding any of these error messages or issues, this guide is designed to help you get unstuck. \"We could not provision a Let's Encrypt certificate for your custom domain\" Certificate stuck on \"Waiting on DNS propagation\" for more than 48 hours \"DNS verification failed\" when provisioning certificate \"Missing certificate\" or certificate won't provision after clicking [Provision certificate] \"Your domain doesn't appear to be served by Netlify\" \"HTTPS not working or showing 'connection not secure' warnings\" \"Certificate provisioning has been pending for over 24 hours\" If you're experiencing any of these issues, follow the troubleshooting steps below. How certificate provisioning worksSection titled “How certificate provisioning works” When you add a custom domain, Netlify automatically attempts to issue an SSL certificate. If the initial attempt fails, we retry every 10 minutes for the first 24 hours, then once every hour for the following two days. However, if a certificate isn't created within the first 24 hours, there's likely a DNS misconfiguration that needs your attention. Troubleshooting stepsSection titled “Troubleshooting steps” Step 1 - Check DNS configurationSection titled “Step 1 - Check DNS configuration” Most SSL certificate errors stem from incorrect DNS settings. Here's what to you're using external A Record for your bare domain should point to 75.2.60.5 Your CNAME record for www should have the value [sitename].netlify.app If you're using Netlify you're using Netlify name servers at your registrar or DNS provider Find your site's Netlify name servers by following this doc on finding Netlify name servers Step 2 - Verify DNS propagationSection titled “Step 2 - Verify DNS propagation” Even if your DNS settings look correct in your provider's dashboard, you need to confirm they've propagated globally. Follow the steps outlined in our Docs. For external DNSchecker.org to check your bare domain (e.g., example.com) with A record type — should return 75.2.60.5 Check your www subdomain with CNAME record type — should return [sitename].netlify.app Alternatively, use the host command in your terminal For Netlify DNSchecker.org with NS (name server) record type for your bare domain You should see your Netlify name servers listed Or run whois in your terminal which locations show your updated DNS records. You need 100% correct DNS records propagated globally before a certificate can be provisioned. If old records still exist in some locations, you'll need to wait for them to expire. Read more about propagation in this Support Guide. Step 3 - Advanced troubleshootingSection titled “Step 3 - Advanced troubleshooting” If DNS propagation looks complete but you're still getting errors, use Let's Debug to identify specific issues. To check the status of your domain in our SSL certificate provider, Let's to Let's Debug site Enter your project’s domain name. (The custom domain you want to serve over HTTPS, such as cats.com at https://cats.com.) Common issues found by Let's titled “Common issues found by Let's Debug:” Leftover AAAA records (IPv6): These often remain from previous hosting Netlify's load balancer doesn't support IPv6 all AAAA records at your domain registrar or DNS host Multiple A you added Netlify's load balancer IP (75.2.60.5), make sure you deleted any other A records Multiple A records on the apex domain will cause certificate failures only the single A record pointing to 75.2.60.5 DNSSEC DNS doesn't support DNSSEC DNSSEC at your domain registrar Use DNSViz to determine where DNSSEC is enabled CAA record records control who can provision SSL certificates for your domain If your CAA record doesn't include Let's Encrypt, certificate provisioning will fail your CAA record to allow Let's Encrypt, or remove the CAA record entirely Check CAA records using host command or DNSchecker.org Prevention and best practicesSection titled “Prevention and best practices” For a comprehensive checklist when setting up or migrating DNS, see the Netlify blog migration guide. For additional DNS troubleshooting resources, see: [Support Guide] Compiled resources for production domains on Netlify and DNS settings Still need help?Section titled “Still need help?” If you've worked through these troubleshooting steps and are still encountering issues, please reach out to Netlify Support with the following web project name (also called site name) Whether you're using External DNS or Netlify DNS A summary of the troubleshooting steps you've taken Last 21, 2026 PreviousCheck DNS propagationNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.412Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2011}}221{"id":"doc-netlify_image_cdn_netlify_docs-323b26a7","source":"documentation","title":"Netlify Image CDN | Netlify Docs","url":"https://docs.netlify.com/image-cdn/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Image CDN Image CDN Overview Create integration On this page Overview Transform images Source Size Fit Position Format Quality Redirects and rewrites Custom headers Local development Framework support Limitations On this page Overview Transform images Source Size Fit Position Format Quality Redirects and rewrites Custom headers Local development Framework support Limitations For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Build / Image Cdn / Netlify Image CDN Copy page View as Markdown Copy as Markdown View as Markdown With Netlify Image CDN, you can transform images on demand without impacting build times. Netlify Image CDN also handles content negotiation to use the most efficient image format for the requesting client. Optimizing the size and format of your images improves both the runtime performance and reliability of your site. Transformations are integrated natively into the CDN so that repeated requests leverage layers of caching for improved performance. To transform an image, make a request to /.netlify/images with query parameters that specify the source asset and the desired transformations. After an image is transformed, the result is uniquely cached on our edge and future requests for the same transformation will serve the cached asset. By default, Netlify Image CDN respects atomic deploys. If you change a previously transformed source image in a new deploy, we re-run transformations on new requests so that we don’t serve outdated assets. Many frameworks on Netlify use Netlify Image CDN to power image optimization and transformation. You can use Netlify Image CDN directly as described below or review our framework support details and benefit from Netlify Image CDN through your framework’s built-in image handling. Transform imagesSection titled “Transform images” Use query parameters on your requests to /.netlify/images to specify the following transformation size fit position format quality You must specify a source asset with the url parameter as described below. All other parameters are optional. Query validation and response codes When a request is made to /.netlify/images, we validate the query parameters. If any transformation parameters have invalid values, we return a 404. If the query parameters are valid and the request is for a new transformation, we return a 200 with the requested content and content-type. If the request is for a previously transformed image, we return a 304. For interactive examples of the different parameters, visit our demo site. SourceSection titled “Source” You must specify a source image with the url parameter. You can use either a relative or a remote path to your source image. Source-only transformations If you include only a source url in your transformation request, we don’t change the size or shape of your image. But, we do transform the format to avif or webp according to which formats are supported by the user’s browser. Relative pathSection titled “Relative path” No configuration is required for relative paths to source images. Here’s an example transformation request using a relative path to an image on the site’s domain. Terminal window# transform the source image deployed at https://mysitename.netlify.app/owl.jpegcurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/owl.jpeg' As mentioned above, Netlify Image CDN respects atomic deploys by default. If you change a previously transformed relative source image in a new deploy, we re-run transformations on new requests so that we don’t serve outdated assets. Remote pathSection titled “Remote path” To transform a source image hosted on another domain, you must first configure allowed domains in your netlify.toml file using the images key. [images] remote_images = [\"https://my-images.com/.*\", \"https://animals.more-images.com/[bcr]at/.*\"] The remote_images property accepts an array of regex. If your images are in specific subdomains or directories, you can use regex to allow just those subdomains or directories. In the regex, escape literal dots (\\.); forward slashes don't need escaping. Note that double-quoted strings in netlify.toml treat backslashes as escape characters, so either double the backslash or use single-quoted literal strings, which need no extra escaping: [images] # single-quoted literal the regex as-is remote_images = ['https://my-images\\.com/.*'] # double-quoted the backslash itself # remote_images = [\"https://my-images\\\\.com/.*\"] After configuring allowed domains for remote images, you can request transformations of assets hosted on the allowed domains. Here’s an example transformation request using a remote path to an image on another domain. Terminal window# transform the source image hosted at https://my-images.com/owl.jpegcurl -vs 'https://mysitename.netlify.app/.netlify/images?url=https://my-images.com/owl.jpeg' Remote source images must be publicly accessible. To protect your users' credentials, Netlify Image CDN does not forward credential-bearing request headers, such as Authorization and Cookie, when it fetches an image from a remote source. To transform images from a remote source that requires authentication, use URLs that carry their own authorization, such as S3 presigned URLs, and make sure your remote_images patterns match them. SizeSection titled “Size” To change the size of an image, use the following parameters with integers to specify the target size in pixels. Terminal window# resize the image to 50 px widecurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/owl.jpeg&w=50' How these parameters are applied depends on the fit option for the request. By default, fit=contain. FitSection titled “Fit” To control how an image is resized, use the fit parameter. Supported values are as (default) cover fill The fit parameter works in conjunction with the w and h size parameters. The fit value affects things such as whether or not the aspect ratio is maintained and whether or not the requested dimensions are always returned. Terminal window# resize and crop the image to 50 pixels squarecurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/owl.jpeg&fit=cover&w=50&h=50' Here’s a comparison of the different fit options. They each behave in the same way as their equivalent CSS object-fit values. For more information, including example images, read the option-specific sections below. fit=source aspect ratio always maintainedexcess pixels croppedrequested dimensions always returnedcontainyesnono, one dimension may be smallercovernoyesyes, image scaled proportionally before croppingfillnonoyes, image stretched and squished if needed fit=contain (default)Section titled “fit=contain (default)” Fit within the specified dimensions and maintain the source aspect ratio by resizing the image proportionally. If you supply just one dimension, the other is calculated to maintain the aspect ratio of the source image. If you supply two dimensions and the target aspect ratio is different than the source aspect ratio, one dimension of the resulting image matches the requested size while the other is smaller. fit=coverSection titled “fit=cover” Fill the specified dimensions without distortion by resizing the image proportionally, then cropping out any excess pixels. By default, the center of the image is retained with the left and right or top and bottom cropped evenly. To control what part of the image is retained, use the position parameter. To use fit=cover, you must supply both w and h. fit=fillSection titled “fit=fill” Fill the specified dimensions exactly. If the target aspect ratio is different than the source aspect ratio, the image is stretched and squished as needed to fill the target dimensions. PositionSection titled “Position” To control how an image is cropped when fit=cover, use the position parameter. Supported values are as bottom left right center (default) The value represents what part of the image to retain when cropping. Terminal window# resize the image and retain the left side when croppingcurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/owl.jpeg&fit=cover&w=50&h=50&position=left' FormatSection titled “Format” To change the format of an image, use the fm parameter. Supported values are as jpg png webp - can be static or animated. gif - can be static or animated. blurhash - returns a string that you can use to render a blurred placeholder image. Visit BlurHash to learn more. Terminal window# convert a jpeg into pngcurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/owl.jpeg&fm=png' # resulting image includes an appropriate `content-type` response header< HTTP/2 200< /png If you don’t specify a format, we inspect the Accept header for content negotiation with the following webp if accepted otherwise, use avif if accepted if neither is accepted, use the original format QualitySection titled “Quality” To control the output quality of a lossy conversion, use the q parameter. This applies when the target format is avif, jpg, gif, or webp. The q parameter supports whole integers from 1 to 100. The default is 75. Terminal window# convert a jpeg into avif with medium qualitycurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/owl.jpeg&fm=avif&q=50' Redirects and rewritesSection titled “Redirects and rewrites” You can use redirects and rewrites with Netlify Image CDN. This can be helpful, for example, if you want to reuse the same parameters for multiple images. _redirects netlify.toml /transform-small/* /.netlify/images?url=/:splat&w=50&h=50 200 [[redirects]] from = \"/transform-small/*\" to = \"/.netlify/images?url=/:splat&w=50&h=50\" status = 200 With the above redirect in place, you can make transformation requests like the window# transform the source image deployed at https://mysitename.netlify.app/owl.jpeg# to a size of 50px wide by 50px high per the parameters in the redirectcurl -vs 'https://mysitename.netlify.app/transform-small/owl.jpeg' Cross-site redirects are not recommended Cross-site redirects for image transformations are not recommended. They could negatively impact your site’s performance. Custom headersSection titled “Custom headers” You can use custom headers with Netlify Image CDN. This can be helpful, for example, if you want to customize browser caching behavior. You can apply custom headers to source images on the site’s domain. It’s not currently possible to apply custom headers from the site to source images hosted on another domain. However, Netlify will respect any cache headers an external domain sends with the source images. Note that Cache-Control headers on source images only apply to browsers and CDNs in front of Netlify and not the Netlify Cache itself. To use custom headers with Netlify Image CDN, apply header rules to your source images. _headers netlify.toml /source-images/* , max-age=604800, must-revalidate [[headers]] for = \"/source-images/*\" [headers.values] Cache-Control = \"public, max-age=604800, must-revalidate\" Headers you set for a source image are applied to the transformed and optimized assets served by Netlify Image CDN. For example, the above headers will apply when you make this transformation window# transform the source image deployed at https://mysitename.netlify.app/source-images/owl.jpegcurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/source-images/owl.jpeg' Local developmentSection titled “Local development” Use Netlify Dev to test image transformations locally. This feature of the Netlify CLI runs a local development server that mimics the Netlify production environment, including Netlify Image CDN. Framework supportSection titled “Framework support” The following frameworks offer built-in image optimization tools that we support through integrations with Netlify Image CDN. You can use your framework’s standard image handling syntax and get extra performance optimizations from Netlify Image CDN. For all other frameworks, you can use Netlify Image CDN directly as described above. FrameworkPrerequisitesRemote path allowlistAngularNone. NgOptimizedImage automatically uses Netlify Image CDN.[images] remote_images in netlify.tomlAstroNone. Astro’s <Image /> component automatically uses Netlify Image CDN.image.domains or image.remotePatterns in astro.config.mjsGatsby 5.13 or laterSet environment variable NETLIFY_IMAGE_CDN to true and use the Contentful, Drupal, or WordPress source plugins.[images] remote_images in netlify.tomlGatsby 5.11 or earlierSet environment variable NETLIFY_IMAGE_CDN to true and use the Contentful, Drupal, or WordPress source plugins.[images] remote_images in netlify.tomlNext.jsIf using Next.js 13.5 or later and Next.js adapter v5.remotePatterns property in next.config.jsNuxtNone. The nuxt/image module automatically uses Netlify Image CDN.image.domains option in nuxt.config.ts LimitationsSection titled “Limitations” Keep the following limitation in mind when working with Netlify Image Testing is not supported. You may get inconsistent image results between your split test branches. Netlify Image CDN is not currently supported as part of our HIPAA-compliant hosting offering. For more information, visit our Trust Center and download our reference architecture for HIPAA-compliant composable sites on Netlify. Last 17, 2026 PreviousLimitationsNextCreate integration Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n# transform the source image deployed at https://mysitename.netlify.app/owl.jpegcurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/owl.jpeg'\n```\n\nExample:\n```text\n[images]  remote_images = [\"https://my-images.com/.*\", \"https://animals.more-images.com/[bcr]at/.*\"]\n```\n\nExample:\n```text\n[images]  # single-quoted literal strings: write the regex as-is  remote_images = ['https://my-images\\.com/.*']  # double-quoted strings: escape the backslash itself  # remote_images = [\"https://my-images\\\\.com/.*\"]\n```\n\nExample:\n```text\n# transform the source image hosted at https://my-images.com/owl.jpegcurl -vs 'https://mysitename.netlify.app/.netlify/images?url=https://my-images.com/owl.jpeg'\n```\n\nExample:\n```text\n# resize the image to 50 px widecurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/owl.jpeg&w=50'\n```\n\nExample:\n```text\n# resize and crop the image to 50 pixels squarecurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/owl.jpeg&fit=cover&w=50&h=50'\n```\n\nExample:\n```text\n# resize the image and retain the left side when croppingcurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/owl.jpeg&fit=cover&w=50&h=50&position=left'\n```\n\nExample:\n```text\n# convert a jpeg into pngcurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/owl.jpeg&fm=png'\n# resulting image includes an appropriate `content-type` response header< HTTP/2 200< content-type: image/png\n```\n\nExample:\n```text\n# convert a jpeg into avif with medium qualitycurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/owl.jpeg&fm=avif&q=50'\n```\n\nExample:\n```text\n/transform-small/* /.netlify/images?url=/:splat&w=50&h=50 200\n```\n\nExample:\n```text\n[[redirects]]  from = \"/transform-small/*\"  to = \"/.netlify/images?url=/:splat&w=50&h=50\"  status = 200\n```\n\nExample:\n```text\n# transform the source image deployed at https://mysitename.netlify.app/owl.jpeg# to a size of 50px wide by 50px high per the parameters in the redirectcurl -vs 'https://mysitename.netlify.app/transform-small/owl.jpeg'\n```\n\nExample:\n```text\n/source-images/*  Cache-Control: public, max-age=604800, must-revalidate\n```\n\nExample:\n```text\n[[headers]]  for = \"/source-images/*\"  [headers.values]    Cache-Control = \"public, max-age=604800, must-revalidate\"\n```\n\nExample:\n```text\n# transform the source image deployed at https://mysitename.netlify.app/source-images/owl.jpegcurl -vs 'https://mysitename.netlify.app/.netlify/images?url=/source-images/owl.jpeg'\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.414Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":15,"totalLines":79,"estimatedTokens":4322}}222{"id":"doc-production_deploy_netlify_docs-78eb264e","source":"documentation","title":"Production deploy | Netlify Docs","url":"https://docs.netlify.com/deploy/deploy-types/production-deploy","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Deploy Deploy Deploy overview Compare preview options Deploy types Production deploy Branch deploys Deploy Previews Create deploys Manage deploys Protect deploys Deploy notifications Review deploys Heads up display Netlify Drawer for feedback Overview Netlify Reviewer quickstart Troubleshoot the Netlify Drawer Review a preview server instance On this page Overview What is a production deploy? How production deploys work Managing production deploys On this page Overview What is a production deploy? How production deploys work Managing production deploys For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Deploy / Deploy Types / Production deploy Copy page View as Markdown Copy as Markdown View as Markdown Learn about production deploys and how they work in Netlify. What is a production deploy?Section titled “What is a production deploy?” A production deploy is a type of deploy that is optimized to work as the production-ready version of your web project that shows up at your primary domain and is live on the web. Your primary domain can be a custom domain, such as mycompany.com, or your Netlify default URL, such as MY-PROJECT-NAME.netlify.app. If you are using Git version control, then a production deploy is typically triggered by a Git push to your production branch, such as main. You can customize your production branch in your project settings on Netlify. If you are not using Git version control, then a production deploy is typically triggered by manually deploying your site with our Drag and drop publisher. How production deploys workSection titled “How production deploys work” Production deploys are automatically created when you push changes to your production branch or manually deploy your site. These served at your primary domain Replace the previous production version Can be rolled back if needed Trigger build hooks and notifications Managing production deploysSection titled “Managing production deploys” You can manage your production deploys through the Netlify dashboard or using the Netlify CLI. Last 9, 2026 PreviousCompare preview optionsNextBranch deploys Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.419Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":910}}223{"id":"doc-block_reason_netlify_docs-624a8406","source":"documentation","title":"Block reason | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/observability/reference/block-reason","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Block reasons Blocked requests not shown in Observability On this page Overview Block reasons Blocked requests not shown in Observability For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Observability / Reference / Block reason Copy page View as Markdown Copy as Markdown View as Markdown Filter observability data by block reason to understand when a request to your web project was blocked by Netlify and why from your Observability dashboard. Netlify evaluates each request through security, caching, compute, and routing layers until a response is generated. Netlify's web security checks Traffic Rules Web Application Firewall (WAF) Rate Limiting Password Protection For more details about the processing order, check out our request chain documentation. Block reasonsSection titled “Block reasons” Block ReasonDescriptionLearn MoreRate limitedRequest was blocked by Netlify's rate limiting feature because the web request details matched a rule in the rate limiting rules to block certain traffic.Rate limitingFirewall Traffic RulesRequest was blocked by Netlify's firewall traffic rules feature because the web request details matched a rule in the firewall traffic rules to block certain traffic.Firewall traffic rulesWAFRequest was blocked by Netlify's WAF (Web Application Firewall) feature because the web request details matched a rule in the Web Application Firewall (WAF) ruleset to block certain traffic.WAFPassword protectionRequest was blocked by Netlify's password protection feature because the site visitor, bot, etc. did not enter the correct password to access your project URL.Password protectionSSO failed loginRequest blocked by failed SSO login when your project has Netlify Identity enabled.SSO loginRequest blocked by SSO login when your project has Netlify Identity enabled.No block reasonNo block reason is recorded for requests within the selected time frame. Request is not blocked by Netlify's Advanced Web Security features, such as Web Application Firewall, Traffic Rules, or Rate Limiting. Blocked requests not shown in ObservabilitySection titled “Blocked requests not shown in Observability” Observability does not display all blocked requests. Requests blocked by Netlify's network-level DDoS protection do not appear in Observability's blocked request metrics or total request counts. If you use a third-party firewall in addition to Netlify's built-in protection, requests blocked by that firewall also will not appear in Observability. Last 18, 2026 PreviousCache statusNextFunctions Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.419Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1121}}224{"id":"doc-share_build_plugins_netlify_docs-95bc8be1","source":"documentation","title":"Share Build Plugins | Netlify Docs","url":"https://docs.netlify.com/extend/develop-and-share/share-build-plugins","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Develop & share Develop & share Overview Develop extensions and integrations Develop build plugins Share build plugins On this page Overview Publish to npm On this page Overview Publish to npm For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Develop And Share / Share Build Plugins Copy page View as Markdown Copy as Markdown View as Markdown If you’d like to share your plugin with others, you can publish it to npm. All Netlify Build Plugins in the npm Public Registry can be installed by any Netlify user through file-based installation. Publish to npmSection titled “Publish to npm” To publish a Build Plugin to npm, follow npm’s documentation for contributing packages to the registry. Be sure to add the following properties to your plugin’s package.json should start with netlify-plugin- (such as netlify-plugin-example or @scope/netlify-plugin-example). It should match the plugin name field. It is recommended for the plugin repository to be named like this as well. keywords should contain the netlify and netlify-plugin keywords. The same applies to GitHub topics. This helps users find your plugin. repository and bugs should be defined. Those are displayed to users when an error occurs inside your plugin. Last 14, 2025 PreviousDevelop build pluginsNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.420Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":706}}225{"id":"doc-manage_functions_with_netlify_cli_netlify_docs-d8762644","source":"documentation","title":"Manage functions with Netlify CLI | Netlify Docs","url":"https://docs.netlify.com/api-and-cli-guides/cli-guides/manage-functions","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI API & CLI guides API & CLI guides Overview API guides Get started with API Deploy project from a zip file with API Deploy zip file to production More API guides API reference docs Go client JS client CLI guides Get started with CLI Local development Manage functions Debug with VSCode More CLI guides CLI reference docs On this page Overview Create serverless functions with Netlify Dev Invoke functions while running Netlify Dev Serve functions with a standalone server locally Debug functions locally On this page Overview Create serverless functions with Netlify Dev Invoke functions while running Netlify Dev Serve functions with a standalone server locally Debug functions locally For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending 'netlify myfunction --querystring \"count=1\"netlify myfunction --payload \"./pathTo.json\" There are special cases for event-triggered functions that will also provide mock data for testing. This makes it possible to manually test event-triggered functions locally and improves the development experience. Serve functions with a standalone server locallySection titled “Serve functions with a standalone server locally” While Netlify Dev will simulate the Netlify production environment, it can be useful to simulate Netlify Functions in a standalone server instead. If you serve functions with a standalone server, you can debug functions without the overhead of starting a framework server. To start a functions server locally, run netlify Your function will be available at http://localhost:9999/.netlify/functions/<function-name> If you configure a functions directory, the server will serve functions from that directory. If not, the server will serve functions from netlify/functions. The default port for the functions server is 9999. To override these settings, use the --functions and --port windownetlify --functions <path-to-dir> --port <port> You can also configure the settings in a netlify.toml, under the dev block: [dev] functions = \"netlify-functions\" functionsPort = 7000 Debug functions locallySection titled “Debug functions locally” Netlify CLI uses Lambda-local to simulate serverless functions. Since the CLI invokes functions in the same process as the functions server, you can debug functions by inspecting the functions server process. To debug, set the --inspect Node.js option when starting the functions Windows, run cmd /V /C \"set NODE_OPTIONS=--inspect && netlify \" On Mac/Linux, run NODE_OPTIONS=--inspect netlify Then, attach any Node.js debugger to the CLI process to debug your functions. To learn how to debug with Visual Studio Code while running the Netlify CLI, review Debug with VS Code. Last 14, 2025 PreviousLocal developmentNextDebug with VSCode Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nnetlify functions:create\n```\n\nExample:\n```text\n# Create a new function from one of the available templates offered# when prompted$ netlify functions:create\n# Create a new function with a given name using either of the# following options$ netlify functions:create hello-world$ netlify functions:create --name hello-world\n# Create a new function by cloning a template from a remote url# organised with dependencies installed into a subdirectory$ netlify functions:create hello-world --url https://my-remote-template-URL\n```\n\nExample:\n```text\nnetlify functions:invoke # we will prompt you at each stepnetlify functions:invoke myfunction # invoke a specific functionnetlify functions:invoke --name myfunction # invoke a specific function\n# sending payloadsnetlify functions:invoke myfunction --payload '{\"count\": 1}'netlify functions:invoke myfunction --querystring \"count=1\"netlify functions:invoke myfunction --payload \"./pathTo.json\"\n```\n\nExample:\n```text\nnetlify functions:serve --functions <path-to-dir> --port <port>\n```\n\nExample:\n```text\n[dev]  functions = \"netlify-functions\"  functionsPort = 7000\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.420Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":5,"totalLines":31,"estimatedTokens":1327}}226{"id":"doc-functions_netlify_docs-c2902326","source":"documentation","title":"Functions | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/observability/reference/functions","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Observability / Reference / Functions Copy page View as Markdown Copy as Markdown View as Markdown Filter observability data by function names to understand how they are working and the bandwidth they're using. Observability shows the names of functions defined in the netlify/functions directory for your project that were triggered by web requests within the selected time frame. Select a function to learn more about web requests that triggered that function. If you have Observability enabled for your team, then these function related insights replace Netlify’s Function Metrics for your team's projects. For you have an edge function named astro.js in netlify/edge-functions that handles Server-Side Rendering for your project using the Astro extension/build plugin, then the function name may be simpflied to Astro SSR in your observability chart. Last 17, 2025 PreviousBlock reasonNextEdge functions Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.421Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":734}}227{"id":"doc-check_dns_propagation_netlify_docs-a6df7fbc","source":"documentation","title":"Check DNS propagation | Netlify Docs","url":"https://docs.netlify.com/manage/domains/troubleshooting/check-dns-propagation","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Use a DNS lookup tool Use the dig command On this page Overview Use a DNS lookup tool Use the dig command For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Troubleshooting / Check DNS propagation Copy page View as Markdown Copy as Markdown View as Markdown Use the following methods to confirm you have set up your DNS records correctly and that your DNS updates have propagated worldwide. Use a DNS lookup toolSection titled “Use a DNS lookup tool” Use a DNS lookup tool to check whether your DNS updates have propagated. While there are many DNS lookup tools available, you can get started using the following Google's Dig tool Use the dig commandSection titled “Use the dig command” To check whether your DNS updates have propagated, use the dig command in your terminal replacing example.com with your example.com The output will show the DNS records for your domain. If your DNS updates have propagated, you should see your Netlify DNS records in the output. Last 1, 2025 PreviousOverviewNextTroubleshoot SSL and HTTPS Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\ndig example.com\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.422Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":855}}228{"id":"doc-manage_domains_for_branch_deploys_netlify_docs-750adeab","source":"documentation","title":"Manage domains for branch deploys | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/manage-domains-for-branch-deploys","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Understand your domain options Default URL for branch deploys URL limitation Custom branch subdomains for branch deploys Compare subdomain options for branch deploys Set up both a branch subdomain and an automatic deploy subdomain Set up an automatic deploy subdomain Set up a branch subdomain On this page Overview Understand your domain options Default URL for branch deploys URL limitation Custom branch subdomains for branch deploys Compare subdomain options for branch deploys Set up both a branch subdomain and an automatic deploy subdomain Set up an automatic deploy subdomain Set up a branch subdomain For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Manage domains for branch deploys Copy page View as Markdown Copy as Markdown View as Markdown By default, branch deploys use the Netlify subdomain netlify.app with your branch name but you can customize your branch deploy URL with an automatic deploy subdomain. Understand your domain optionsSection titled “Understand your domain options” Default URL for branch deploysSection titled “Default URL for branch deploys” By default branch deploys use the Netlify subdomain netlify.app with the branch name, such as https://staging.netlify.app where staging is your branch name. URL limitationSection titled “URL limitation” Be aware that the branch name combined with the site name should not exceed 63 characters, as described in the RFC 1035 or the auto-generated branch deploy URL will not work. You will need to create a new branch deploy with either a shorter site name or branch name so that the total characters and symbols do not exceed 63. For example, if your site domain is my-personal-site and the branch name is my-very-long-and-important-for-release-feature-name, it will produce a URL which looks ://my-very-long-and-important-for-release-feature-name--my-personal-site.netlify.app. This URL won't work, as the first part of the domain my-very-long-and-important-for-release-feature-name--my-personal-site is longer than 63 symbols. Custom branch subdomains for branch deploysSection titled “Custom branch subdomains for branch deploys” This feature is available in our UI with Netlify DNS. Netlify can generate a branch subdomain for specified branch deploys using your site’s primary custom domain designated for your production site. The resulting branch subdomains use the fixed syntax branchname.yourcustomdomain.com and can’t use a different pattern. For example, if your custom domain is example.com and your branch is staging, you can check the latest deploy of that branch at staging.example.com. Before you can enable branch subdomains, you must enable branch deploys for your branch and successfully deploy your branch. To add a new branch subdomain, go to Domain management > Domains > Branch subdomains, and select New subdomain. A branch subdomain can be deleted by using the x button in the corresponding subdomain row. Visit our Forums for a verified Support Guide on setting up branch subdomains without Netlify DNS. Compare subdomain options for branch deploysSection titled “Compare subdomain options for branch deploys” For an overview of the main differences between these subdomains, consider these key differences. Automatic deploy subdomainsBranch subdomainsCustom domain optionsCan use your production site’s primary domain or any other custom domain or subdomain managed by Netlify DNS and available to your team.Can only use your production site’s primary domain, which must be managed by Netlify DNS.Additional subdomain supportXRequires Netlify DNSXXPricing planCore Pro plan and aboveAll plansBranch deploy scopeApplies to all branch deploys.Applies to user-specified branch branches or all branches except the designated production branch.Setup interactionsOnce set up, becomes the primary deploy URL for branch deploys. Cannot change existing branch subdomain settings without removing your automatic deploy subdomain.Once automatic deploy subdomains are set up, cannot change existing branch subdomain settings but branch subdomain URLs still resolve for pre-existing branches. Set up both a branch subdomain and an automatic deploy subdomainSection titled “Set up both a branch subdomain and an automatic deploy subdomain” If you want to use both branch subdomains and an automatic deploy subdomain for branch deploys, ensure that you set up any branch subdomains before your automatic deploy subdomain. We recommend setting up only stable or internal branch subdomains since you would need to remove your automatic deploy subdomain to make changes to your branch subdomain settings. Also, note that the Netlify UI, CLI, and API will use the automatic deploy subdomain for branch deploys configured with a branch subdomain. The branch deploy URL featuring your branch subdomain, such as staging.company.com should still resolve and work for site visitors though. Learn more about limitations to using both types of subdomains for branch deploys. Set up an automatic deploy subdomainSection titled “Set up an automatic deploy subdomain” To set up an automatic deploy subdomain for your branch deploys, check out Automatic Deploy Subdomains. Set up a branch subdomainSection titled “Set up a branch subdomain” To set up a branch subdomain for your branch deploys, check out our Branch deploy docs. Last 14, 2025 PreviousManage domains for a site appNextManage domains for Deploy Previews Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.422Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1942}}229{"id":"doc-configure_external_dns_for_a_custom_domain_netli-9f5686d7","source":"documentation","title":"Configure external DNS for a custom domain | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/configure-external-dns","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Configure a subdomain Configure an apex domain DNS record propagation On this page Overview Configure a subdomain Configure an apex domain DNS record propagation For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / Configure external DNS for a custom domain Copy page View as Markdown Copy as Markdown View as Markdown If you’ve assigned an externally registered domain to your site, and you don’t want to use Netlify DNS, you need to configure your external DNS provider to point your domain to Netlify. To access customized details about the DNS records you need to configure, go to Domain management > Production domains and select Pending DNS verification next to the custom domain. The next steps vary depending on the type of domain or subdomain. For a subdomain of a domain you own, such as blog.petsofnetlify.com or www.petsofnetlify.com, follow the directions below for subdomain configuration. For an apex domain with no subdomain, such as petsofnetlify.com, make sure to read our advice about using apex domains, then follow the directions below for apex domain configuration. Special handling for apex and www If you assign an apex domain or a www subdomain to your site, Netlify will automatically add both the apex domain and the www subdomain. This means you should follow directions for both configuring a subdomain and configuring an apex domain. For more information, visit the section on apex domains and www subdomains. Need to delegate just a subdomain? You can delegate a subdomain to Netlify DNS without the apex domain. Learn more in this doc. Configure a subdomainSection titled “Configure a subdomain” To point a subdomain such as blog.petsofnetlify.com or www.petsofnetlify.com to your site on Netlify, you must first add the domain to your site on Netlify and then create a CNAME record with your DNS provider. For example, if your site’s domain is blog.petsofnetlify.com and your Netlify subdomain is brave-curie-12345.netlify.app: Follow the instructions to add the domain blog.petsofnetlify.com to the brave-curie-12345.netlify.app site on Netlify. At the end of the process, Netlify provides a CNAME record to add to your DNS provider. Find your DNS provider’s DNS record settings for your apex domain, petsofnetlify.com. On your DNS provider’s site, add the CNAME record with your subdomain, blog, as the host. Point the record to your Netlify subdomain, brave-curie-12345.netlify.app. High-Performance Edge uses a different subdomain If your site is on the High-Performance Edge, point the record to the dedicated subdomain in your High-Performance Edge onboarding PDF. Save your settings. It may take a full day for the settings to propagate across the global Domain Name System. If your site uses the www subdomain, as in www.petsofnetlify.com, you will use the same procedure described above. Once you configure the www subdomain, an apex domain will also be added automatically to your site. You’ll need to follow the steps in the section below to configure the apex domain too. Learn more about our special handling for www subdomains. Configure an apex domainSection titled “Configure an apex domain” Unlike subdomains, apex domains don’t support CNAME records. You must configure your apex domain with an ALIAS, ANAME, flattened CNAME, or A record. Different DNS providers support different record types. Depending on what your DNS provider supports, use either the recommended configuration or the fallback option below. If your DNS provider supports ALIAS, ANAME, or flattened CNAME records, use this recommended configuration, which is more resilient than the fallback option. Find your DNS provider’s DNS record settings for your apex domain, such as petsofnetlify.com. Add an ALIAS, ANAME, or flattened CNAME record. Depending on your provider, leave the host field empty or enter @. Point the record to Netlify’s load balancer High-Performance Edge uses a different load balancer If your site is on the High-Performance Edge, point the record to the High-Performance Edge load balancer noted in the Pending DNS verification modal's customized details. Save your settings. It may take a full day for the settings to propagate across the global Domain Name System. If your DNS provider does not support ALIAS, ANAME, or flattened CNAME records, use this fallback option. Find your DNS provider’s DNS record settings for your apex domain, such as petsofnetlify.com. Add an A record. Depending on your provider, leave the host field empty or enter @. Point the record to Netlify’s load balancer IP High-Performance Edge uses a different load balancer If your site is on the High-Performance Edge, point the record to the High-Performance Edge load balancer IP address noted in the Pending DNS verification modal’s customized details. Save your settings. It may take a full day for the settings to propagate across the global Domain Name System. In both cases, the apex domain eventually resolves to our load balancer IP address. This means the apex domain can’t take advantage of direct DNS routing on a global CDN like Netlify’s. Because of this, we recommend using a subdomain for your primary domain when using external DNS. Special handling for apex domains If you assign an apex domain to your site, Netlify will automatically add a www subdomain for the domain as well, which requires the subdomain configuration as described above. To find out how this affects your site configuration, visit the section on apex domains and www subdomains. DNS record propagationSection titled “DNS record propagation” Depending on your DNS provider, changes to DNS records can take several hours to propagate and take effect for the entire internet. If more than 24 hours have passed since you configured your DNS records, and your site is still not accessible at your custom domain, try our DNS troubleshooting tips. Last 28, 2025 PreviousConfigure an automatic subdomain for deploysNextDelegate a standalone subdomain Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.424Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2082}}230{"id":"doc-cloud_container_netlify_docs-add089ae","source":"documentation","title":"Cloud container | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/cloud-setup/container/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Cloud architecture Container setup Content update flow Self-hosted container On this page Overview Cloud architecture Container setup Content update flow Self-hosted container For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Cloud Setup / Cloud container Copy page View as Markdown Copy as Markdown View as Markdown A container runs the editing application but also handles staying in sync with your remote repository and running your site (in development). Cloud architectureSection titled “Cloud architecture” The following diagram shows how the various pieces of the visual editor work together when not in local development mode. Container setupSection titled “Container setup” The container goes through a specific lifecycle when it is created or restarted. This is the the Git repository. Run postGitCloneCommand, if defined. Run preInstallCommand, if defined. Run installCommand. The default is either yarn or npm install if the configuration property is undefined. If the configured runnable directory (set in the visual editor settings) is not the same as the project’s root directory, then also install dependencies in the runnable directory. To review your runnable directory, go to Project configuration > Visual Editor > General. Run postInstallCommand, if defined. Run devCommand, if defined. Otherwise, run the default command based on ssgName. Content update flowSection titled “Content update flow” The following diagram shows how content is updated when not in local development mode. Self-hosted containerSection titled “Self-hosted container” Please contact us for details about on-premise and self hosting. Last 23, 2025 PreviousOverviewNextGit branching Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.425Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1090}}231{"id":"doc-git_branching_netlify_docs-28ebdb1b","source":"documentation","title":"Git branching | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/cloud-setup/git-branching/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Working branch External updates Content publishing branch (Git CMS only) Branch synchronization (Git CMS only) Configure branches Change working branch On this page Overview Working branch External updates Content publishing branch (Git CMS only) Branch synchronization (Git CMS only) Configure branches Change working branch For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Cloud Setup / Git branching Copy page View as Markdown Copy as Markdown View as Markdown The visual editor interacts with branches in your remote Git repository when in cloud setup mode (not local development). In this mode, the visual editor works with two Git branches — working branch and a content publishing branch. Working branchSection titled “Working branch” The visual editor uses the working branch to run your site in the container. The working branch is the branch that content editors work with. This branch name defaults to preview, which gets automatically created when visual editing is enabled for a site. Learn more about changing the working branch. External updatesSection titled “External updates” Visual Editor uses webhooks to listen for updates to the working branch in its remote repository, then immediately updates the local branch. Content publishing branch (Git CMS only)Section titled “Content publishing branch (Git CMS only)” The visual editor uses the content publishing branch to merge or send a pull request with content changes. The content publishing branch defaults to the default branch of the repository (e.g. main or master) when enabling visual editing for the first time. For sites with content managed from a headless CMS, configuring a content publishing branch is not needed because content changes are pushed directly to the content source(s). Branch synchronization (Git CMS only)Section titled “Branch synchronization (Git CMS only)” The content publishing branch is only used during the publishing process. Keeping the working branch in sync with changes committed to the content publishing branch must be handled separately. This should not be needed if content changes are made from the visual editor exclusively. Configure branchesSection titled “Configure branches” You can override these defaults from your visual editor settings or when you enable visual editing for the first time. Change working branchSection titled “Change working branch” As a Developer or Owner, you can adjust the working branch of your site for use with the visual editor. Go to your visual editor your site workspace in the visual editor, select the options icon next to your site name and select Visual editor settings from the drop-down menu. From your Site overview where you manage site deploys, go to Project configuration > Visual Editor > General. Then select Edit. Choose an existing branch to use as the working branch. Note that you will not find the target branch as an option. You must work on a separate branch. Before you start editing and publishing, we recommend you confirm you’re using the correct branches. Last 14, 2025 PreviousContainerNextImport Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.426Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1439}}232{"id":"doc-document_hooks_netlify_docs-5749f8a7","source":"documentation","title":"Document hooks | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/document-hooks/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Object processing methods nested section Use $$type and $$ref Empty values Document operation methods Lifecycle behavior Method usage Basic a field Work with documents Filter behavior by model Adhere to the schema On this page Overview Object processing methods nested section Use $$type and $$ref Empty values Document operation methods Lifecycle behavior Method usage Basic a field Work with documents Filter behavior by model Adhere to the schema For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export default defineStackbitConfig({ => { const { object } = options; // Add a nested placeholder hero section to a page. if (options.model.name === \"Page\") { object.sections = [ { $$type: \"HeroSection\", || \"[not set]\" } ]; } // Return the adjusted object. return object; }}); Use $$type and $$refSection titled “Use $$type and $$ref” The reserved keys — $$type and $$ref are used for creating nested and related content, along with the original document, following these work identical to the matching properties in the Presets API. In $$type to create a new nested object for the model of the specified $$type. $$type can also be used to create a new document and link it to a reference field. To link an image or reference field to existing entities, set $$ref to the ID value of the object to reference. (Note that Git CMS uses local file paths for ID values.) Keys can be included alongside these reserved properties, as shown in the usage example above. Empty valuesSection titled “Empty values” If values are removed or not set in the return object, Visual Editor uses the default setting to attempt to fill in the value. Document operation methodsSection titled “Document operation methods” There are four lifecycle methods, available as configuration onDocumentDelete onDocumentsPublish onDocumentUpdate Lifecycle behaviorSection titled “Lifecycle behavior” These methods are triggered between the time an editor makes a change to a document and the time the change is committed to the content source. In general, the process flows like is changed in Visual Editor. Document hook is fired, based on the type of change event. Change is committed to the content source, including any alterations made during the hook. Method usageSection titled “Method usage” Each hook is a configuration property, where the value is a function that accepts a single options argument. There are shared properties within options, which can be used to access other entities within your content system. (More on this below.) options also includes two properties unique to each function used as the return value for the method (e.g. createDocument) A specific set of options to send to the return value (e.g. createDocumentOptions) Here's the basic shape of the onDocumentCreate method: // stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\"; export default defineStackbitConfig({ => { const { createDocumentOptions, createDocument } = options; // Transform `createDocumentOptions` object ... // Then pass to `createDocument` as the return value return createDocument(createDocumentOptions); }}); Basic a fieldSection titled “Basic a field” A simple example might be computing some field based on the value of another field. For example, suppose you had two required fields on a model — firstName and lastName. Rather than needing to stitch these together throughout your frontend code, you could do this by adding a readOnly field to the model and setting that after a create or update operation. Here's an example of what the create method might look like. // stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", contentSources: [ // ... ], => { // Retrieve the first and last name values. const firstNameField = options.createDocumentOptions.updateOperationFields.firstName; const lastNameField = options.createDocumentOptions.updateOperationFields.lastName; let fullName = ''; if (firstNameField && 'value' in firstNameField && lastNameField && 'value' in lastNameField) { fullName = `${firstName.value} ${lastName.value}`; } // Transform createDocument method options let options.createDocumentOptions = { ...options.createDocumentOptions, updateOperationFields: { ...options.createDocumentOptions.updateOperationFields, fullName: { type: \"string\", } } }; // Return the createDocument function return options.createDocument(createOptions); }}); Work with documentsSection titled “Work with documents” There are a number of ways to manipulate the current document being operated upon, or to affect other documents in any one of a project's content sources. These operations are performed through the shared options properties or those properties unique to the individual method. Filter behavior by modelSection titled “Filter behavior by model” As an example, suppose you wanted to perform an operation only for a document of a specific type. You can target the model name of the current document to add an exit condition to the method. On create, the model name is separated from the fields being modified. // stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", contentSources: [ // ... ], => { if (options.createDocumentOptions.model.name !== \"Page\") { return options.createDocument(options.createDocumentOptions); } // Transform document ... }}); When the document already exists, the modelName property is available on the current document. // stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", contentSources: [ // ... ], => { if (options.updateDocumentOptions.document.modelName !== \"Page\") { return options.updateDocument(options.updateDocumentOptions); } // Transform document ... }}); Adhere to the schemaSection titled “Adhere to the schema” With this approach, you can manipulate documents within your content system in any way, as long as your operations are valid within the appropriate content schema. If you have questions about what's possible within these methods, contact us. Last 25, 2025 PreviousCustom actionsNextEditorial permissions Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  onContentCreate: options => {    const { object } = options;    // Add a nested placeholder hero section to a page.    if (options.model.name === \"Page\") {      object.sections = [        { $$type: \"HeroSection\", heading: object.title || \"[not set]\" }      ];    }    // Return the adjusted object.    return object;  }});\n```\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  onDocumentCreate: options => {    const { createDocumentOptions, createDocument } = options;    // Transform `createDocumentOptions` object ...    // Then pass to `createDocument` as the return value    return createDocument(createDocumentOptions);  }});\n```\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  contentSources: [    // ...  ],  onDocumentCreate: options => {    // Retrieve the first and last name values.    const firstNameField = options.createDocumentOptions.updateOperationFields.firstName;    const lastNameField = options.createDocumentOptions.updateOperationFields.lastName;    let fullName = '';    if (firstNameField && 'value' in firstNameField && lastNameField && 'value' in lastNameField) {      fullName = `${firstName.value} ${lastName.value}`;    }    // Transform createDocument method options    let createOptions: typeof options.createDocumentOptions = {      ...options.createDocumentOptions,      updateOperationFields: {        ...options.createDocumentOptions.updateOperationFields,        fullName: { type: \"string\", value: fullName }      }    };    // Return the createDocument function    return options.createDocument(createOptions);  }});\n```\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  contentSources: [    // ...  ],  onDocumentCreate: options => {    if (options.createDocumentOptions.model.name !== \"Page\") {      return options.createDocument(options.createDocumentOptions);    }    // Transform document ...  }});\n```\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  contentSources: [    // ...  ],  onDocumentUpdate: options => {    if (options.updateDocumentOptions.document.modelName !== \"Page\") {      return options.updateDocument(options.updateDocumentOptions);    }    // Transform document ...  }});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.427Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":5,"totalLines":33,"estimatedTokens":2883}}233{"id":"doc-cloudinary_asset_integration_netlify_docs-6099652c","source":"documentation","title":"Cloudinary asset integration | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/asset-sources/cloudinary/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Cloudinary in Visual Editor Retrieve API credentials Configure Cloudinary for local development Set up Cloudinary for collaboration Toggle asset sources Data structure Git CMS image structure On this page Overview Configure Cloudinary in Visual Editor Retrieve API credentials Configure Cloudinary for local development Set up Cloudinary for collaboration Toggle asset sources Data structure Git CMS image structure For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Asset Sources / Cloudinary asset integration Copy page View as Markdown Copy as Markdown View as Markdown Integrate with Cloudinary to manage, transform, and deliver great imagery to Visual Editor. Cloudinary examples There are two example projects that showcase using Cloudinary with visual + Contentful Cloudinary + Unpic Cloudinary integrates both with leading CMS platforms supported by Visual Editor (e.g. Contentful, Sanity, etc.) and with Visual Editor itself. Meaning that any field that is configured as Cloudinary-managed in the CMS is automatically recognized by Visual Editor. Configure Cloudinary in Visual EditorSection titled “Configure Cloudinary in Visual Editor” After configuring Cloudinary to work with your code and content source, you can enable the integration in Visual Editor. This differs based on your working mode. Retrieve API credentialsSection titled “Retrieve API credentials” Before configuring, you need to obtain the cloud name and API key for your Cloudinary library. These can be found on your dashboard in Cloudinary. Configure Cloudinary for local developmentSection titled “Configure Cloudinary for local development” Tip Use the latest version of @stackbit/cli to ensure all Cloudinary features are available when working locally. When working locally, identify and enable your Cloudinary library through the --cloudinary-cloud-name and --cloudinary-api-key options. (See above for identifying these values.) Terminal windowstackbit dev --cloudinary-cloud-name [CLOUD_NAME] --cloudinary-api-key [API_KEY] Set up Cloudinary for collaborationSection titled “Set up Cloudinary for collaboration” Go to your visual editor your site workspace in the visual editor, select the options icon next to your site name and select Visual editor settings from the drop-down menu. From your Site overview where you manage site deploys, go to Project configuration > Visual Editor > Asset sources. Under Asset-sources, next to Cloudinary, choose Connect or select Options to edit an existing Cloudinary asset source. Toggle asset sourcesSection titled “Toggle asset sources” When using Cloudinary with a headless CMS, the Cloudinary image picker will appear when choosing to add or change an image. When using Git CMS, the modal provides the option to use other configured options in the bottom left corner. To lock the modal down to only Cloudinary, set the source property to cloudinary. This will remove the dropdown toggle from the asset modal for that field. // stackbit.config.tsexport default defineStackbitConfig({ models: [ { name: \"Page\", fields: [ { name: \"image\", type: \"image\", source: \"cloudinary\" } // ... ] // ... } ] // ...}); This provides additional benefits for Git CMS, as shown below. Data structureSection titled “Data structure” When a user selects an image in the Cloudinary widget, the widget returns a JSON object with full image metadata. The object format is documented here. When an integration exists between Cloudinary and your content source (via a headless CMS), this data is stored in the format expected by the CMS. Most CMSs supporting Cloudinary use essentially the same format (e.g. see Sanity's docs. Git CMS image structureSection titled “Git CMS image structure” By default, when using our built-in Git-based CMS rather than connecting to a headless CMS, image fields only hold a single URL to the image. { \"image\": \"http://res.cloudinary.com/demo/image/upload/v1511474034/sample.jpg\"} This allows content editors to freely toggle between selecting images from Cloudinary and choosing from image files in the repository. However, the full JSON image metadata is not stored, and as a developer you only get the secure_url of that asset. To have the full metadata object stored, set the source property to cloudinary on the definition of any relevant image field. For fields configured in this way, only Cloudinary images can be selected, and the entire JSON object will be stored. // stackbit.config.tsexport default defineStackbitConfig({ models: [ { name: \"Page\", fields: [ { name: \"image\", type: \"image\", source: \"cloudinary\" } // ... ] // ... } ] // ...}); This would store the entire JSON object in the source file. { \"public_id\": \"sample\", \"resource_type\": \"image\", \"type\": \"upload\", \"format\": \"jpg\" // ...} Last 14, 2025 PreviousBynderNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nstackbit dev --cloudinary-cloud-name [CLOUD_NAME] --cloudinary-api-key [API_KEY]\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  models: [    {      name: \"Page\",      fields: [        { name: \"image\", type: \"image\", source: \"cloudinary\" }        // ...      ]      // ...    }  ]  // ...});\n```\n\nExample:\n```text\n{  \"image\": \"http://res.cloudinary.com/demo/image/upload/v1511474034/sample.jpg\"}\n```\n\nExample:\n```text\n{  \"public_id\": \"sample\",  \"resource_type\": \"image\",  \"type\": \"upload\",  \"format\": \"jpg\"  // ...}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.428Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":4,"totalLines":23,"estimatedTokens":2013}}234{"id":"doc-asset_sources_netlify_docs-9a1f9994","source":"documentation","title":"Asset sources | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/asset-sources/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Direct integrations Custom sources How custom sources work Custom source configuration Image previews On this page Overview Direct integrations Custom sources How custom sources work Custom source configuration Image previews For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", contentSources: [ // ... ], assetSources: [ { name: \"asset-source-name\", type: \"iframe\", url: \"https://www.asset-source-url.com\", transform: ({ assetData }) => assetData.imageUrl, preview: ({ assetData }: { }) => ({ }) } ], modelExtensions: [ { name: \"hero\", type: \"object\", fields: [{ name: \"image\", type: \"image\", source: \"asset-source-name\" }] } ]}); Image previewsSection titled “Image previews” Image previews are used by Visual Editor when rendering an image field (or an object with an image field) in a form editor. These previews are controlled by the preview property defined on the asset source. Keep in mind that the assetData received by the function is in the same shape as it is stored in the content source. The example below assumes that the image data is stored as an object with a url property representing the image source. // stackbit.config.tsexport default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", assetSources: [ { name: \"asset-source-name\", type: \"iframe\", url: \"https://www.asset-source-url.com\", transform: ({ assetData }) => assetData.imageUrl, preview: ({ assetData }: { }) => ({ }) } ]}); Last 14, 2025 PreviousVersion controlNextAprimo Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  contentSources: [    // ...  ],  assetSources: [    {      name: \"asset-source-name\",      type: \"iframe\",      url: \"https://www.asset-source-url.com\",      transform: ({ assetData }) => assetData.imageUrl,      preview: ({ assetData }: { assetData: string }) => ({ image: assetData })    }  ],  modelExtensions: [    {      name: \"hero\",      type: \"object\",      fields: [{ name: \"image\", type: \"image\", source: \"asset-source-name\" }]    }  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  assetSources: [    {      name: \"asset-source-name\",      type: \"iframe\",      url: \"https://www.asset-source-url.com\",      transform: ({ assetData }) => assetData.imageUrl,      preview: ({ assetData }: { assetData: string }) => ({        image: assetData.url      })    }  ]});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.429Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":14,"estimatedTokens":1282}}235{"id":"doc-personalization_netlify_docs-8b4cfed3","source":"documentation","title":"Personalization | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/personalization/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Requirements Edit personalized content Wrap components Target environment Annotate variants Handle gated content Impersonate a user Bypass the gate On this page Overview Requirements Edit personalized content Wrap components Target environment Annotate variants Handle gated content Impersonate a user Bypass the gate For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Personalization Copy page View as Markdown Copy as Markdown View as Markdown Make personalized content editable in Visual Editor. Personalization Example Personalization example built with Next.js, using Contentful to store content and Ninetailed for audience control. Check out the example code Visual Editor can integrate with the current generation of headless CMS-native personalization engines. A significant challenge for editors using these engines is navigating through the CMS content tree to actually edit multiple variants and targeting rules, without actually getting immediate feedback on their work. In other words, the common hardships with a headless CMS are made worse by the extra layers added for personalization. Integrating a personalization tool into Visual Editor is meant to ease this pain. Here’s what such integrations typically personalized page sections are visually marked as such in Visual Editor. Previewing user can switch between the default variant (the one selected by the engine) and any other variant. Editing and adding variants is done within Visual Editor, without leaving the page. For an example, see our Ninetailed integration (code). RequirementsSection titled “Requirements” For personalization to be editable with Visual Editor, the content should be stored in a supported content source. Variants should be stored either in fields within a document, or (more commonly) as separate referenced documents. Edit personalized contentSection titled “Edit personalized content” Making personalized content editable with Visual Editor is a three-step sure you fetch all variants from the content source. If you’re using a GraphQL API to access your CMS, make sure that all variants and their IDs are included in the query. Wrap any relevant components with a higher-order component rendering a variant selection control for the user. Ensure all variants are annotated. Wrap componentsSection titled “Wrap components” The mechanism for this depends on the web framework (Next.js example. For any component that is personalizable, create a wrapper component (only in non-production environments!). The responsibilities of this wrapper the wrapped component instance is actively personalized, render a badge over the component for quick discovery by content editors. For personalized instances, render a drop-down control over the component with the option to show either the default variant (the one selected by the personalization engine) or explicitly select any of the existing variants. When a user selects a specific variant, the wrapper should: (a) render that variant as its child, rather than the default one, and (b) persist the user selection on the client-side, so that it's not lost when navigating between pages. Target environmentSection titled “Target environment” This behavior should only exist in your application when it is running in development mode. This is commonly achieved using the NODE_ENV environment variable. There is also a STACKBIT_PREVIEW environment that is set in the visual editor. Annotate variantsSection titled “Annotate variants” The last step is to ensure that any variant rendered is properly annotated, whether it’s the default variant returned by the personalization engine or a user-selected variant. As a storing variants as individual documents in the content source, use data-sb-object-id on an element that wraps the personalized content. If variants are stored as individual fields, use data-sb-field-path instead. Handle gated contentSection titled “Handle gated content” Visual Editor can also handle content that is behind a gate or paywall, or content that requires user authentication. The process follows a similar pattern to personalization. As long as there is a way to access content in a supported content source, it can be edited. There are two approaches commonly taken to let editors access to gated a userSection titled “Impersonate a user” In many cases, developers choose to provide the ability to impersonate a specific user or a request. In this mode, the content editor sees exactly what that end-user should see, and edit it. How this is implemented varies significantly based on the needs of the project. Bypass the gateSection titled “Bypass the gate” An alternative approach is to make all gated content available when the site is running in development mode. This tends to speed up the editing process, but comes with must remember (and should test) that gated content is not available in production. Page visuals may differ slightly if not edited in the same context in which the content is presented in production. Last 14, 2025 PreviousLocalizationNextPreview controls Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.430Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1933}}236{"id":"doc-cloud_setup_overview_netlify_docs-ece8ccff","source":"documentation","title":"Cloud setup overview | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/cloud-setup/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Set up visual editor locally Next steps On this page Overview Set up visual editor locally Next steps For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Cloud setup overview Copy page View as Markdown Copy as Markdown View as Markdown The visual editor enables content editors and developers to collaborate on the same site with a containerized visual editing experience. A container runs the editing application, but also handles staying in sync with your remote repository and running your site (in development). Set up visual editor locallySection titled “Set up visual editor locally” We recommend testing out the visual editor locally to ensure your configuration works, especially as you learn how to customize the visual editor for your team. Here are some key differences to testing out the visual editor must run and use your own development server Any branch can be used when working locally, since the local visual editor application doesn't listen for remote Git changes. If you're not using local development, then the visual editing container runs your development for you and webhooks pull in changes pushed to the site's working branch. Note Next stepsSection titled “Next steps” After testing out your initial setup, site templates, and other custom configuration options, we recommend you finish setting up the visual editor so your team can collaboratively edit with some of these up access user roles and permissions for using or developing the visual editor Set up your visual editing and setup details for your visual editing container. Add site from Git a new site from am existing Git repository. Git how your site with visual editing works with branches from your remote Git repository. and share changes before they are published to production. the visual editing experience to work with your existing publishing workflows. Last 14, 2025 PreviousCloudinaryNextContainer Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.430Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1144}}237{"id":"doc-global_styles_netlify_docs-32be8c40","source":"documentation","title":"Global styles | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/global-styles/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview How it works Example with Tailwind CSS The global styles content model Use files as content source Use a headless CMS Add a sidebar button for styles On this page Overview How it works Example with Tailwind CSS The global styles content model Use files as content source Use a headless CMS Add a sidebar button for styles For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending Tailwind uses a tailwind.config.js file to set default values for your styles. Here's a simple example of reading a value from your content file into Tailwind's configuration: // tailwind.config.jsconst globalStyles = require(\"./content/data/style.json\"); module.exports = { theme: { colors: { // ... } } // ...}; Now that you've added a custom color to your Tailwind theme, this color is immediately usable with Tailwind utility classes, e.g. text-primary or bg-primary. You can also use Tailwind's @apply directive to apply these classes to other CSS global styles content modelSection titled “The global styles content model” This model can be designed just like any other model with Visual Editor, with the nuances for particular content sources noted below. Use files as content sourceSection titled “Use files as content source” If using Git CMS (file-based content), define the content model as a JS/TS object. Here's an example model definition for allowing an editor to switch between light & dark modes, plus specifying primary and secondary colors: // .stackbit/models/GlobalsStyles.jsexport const GlobalStyles = { type: \"data\", label: \"Global styles\", file: \"style.json\", fields: [ { type: \"enum\", name: \"mode\", controlType: \"button-group\", options: [ { label: \"Light\", value: \"light\" }, { label: \"Dark\", value: \"dark\" } ], default: \"light\" }, { type: \"color\", name: \"primaryColor\", label: \"Primary color\" }, { type: \"color\", name: \"secondaryColor\", label: \"Secondary color\" } ]}; This model should be added to the models array property in your configuration file: // stackbit.config.ts// imports ...import { GlobalStyles } from \"./.stackbit/models/ThemeStyle\"; const sbConfig = { stackbitVersion: \"~0.6.0\", contentSources: [ new GitContentSource({ , contentDirs: [\"content\"], models: [ GlobalStyles // other models ... ] }) ]}; export default sbConfig; Note the following in the model definition model type is set to data (meaning non-page standalone content). The file property is set to a fixed location where this data is found, as we only want to have a single instance of this model. Having a known location makes it easy to load the file in your CSS configuration code (see tailwind.config.js example above). Typically, sites running in development mode also listen for any file changes, so any updates made to the file will immediately result in a hot module reloading - including the CSS framework's configuration code being re-run and grabbing up-to-date values from file. In production, the latest version of the file is statically included in each deployment. For a complete example that you can explore and run locally, see our Typescript starter. Use a headless CMSSection titled “Use a headless CMS” With a headless CMS, the model can be defined just like any other model in your CMS, but there is a bit of extra code needed to synchronize the up-to-date values in the content object to a a helper function to fetch the global styles content object from the CMS and write it to a local file with a fixed name. For your production build, make this code run once as part of the build process, so the resulting file is baked into the deployment. Any further style changes by editors will not be reflected in the production site until the changes are published & the site redeployed. When your site runs in development mode (which is also how we run your code in a managed Visual Editor project), add a listener to content changes in your site, so that any change to the style values by anyone will trigger writing the local file again. Each CMS has its own mechanism for receiving content updates which you can use. If your CMS supports it, it's recommended to make the model a singleton model so that only one instance can ever be created. Add a sidebar button for stylesSection titled “Add a sidebar button for styles” For quick access to the styles content object, you can add a button to the left sidebar in your configuration file: // stackbit.config.js export default { // other config properties ... sidebarButtons: [ { type: \"model\", label: \"Global styles\", icon: \"style\", modelName: \"GlobalStyles\" } ]}; Last 14, 2025 PreviousEditorial permissionsNextLocal development Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n{  \"primaryColor\": \"#f6f1ed\"  // ...}\n```\n\nExample:\n```text\n// tailwind.config.jsconst globalStyles = require(\"./content/data/style.json\");\nmodule.exports = {  theme: {    colors: {      primary: globalStyles.primaryColor      // ...    }  }  // ...};\n```\n\nExample:\n```text\n.button {  @apply text-primary;}\n```\n\nExample:\n```text\n// .stackbit/models/GlobalsStyles.jsexport const GlobalStyles = {  type: \"data\",  label: \"Global styles\",  file: \"style.json\",  fields: [    {      type: \"enum\",      name: \"mode\",      controlType: \"button-group\",      options: [        { label: \"Light\", value: \"light\" },        { label: \"Dark\", value: \"dark\" }      ],      default: \"light\"    },    { type: \"color\", name: \"primaryColor\", label: \"Primary color\" },    { type: \"color\", name: \"secondaryColor\", label: \"Secondary color\" }  ]};\n```\n\nExample:\n```text\n// stackbit.config.ts// imports ...import { GlobalStyles } from \"./.stackbit/models/ThemeStyle\";\nconst sbConfig = {  stackbitVersion: \"~0.6.0\",  contentSources: [    new GitContentSource({      rootPath: __dirname,      contentDirs: [\"content\"],      models: [        GlobalStyles        // other models ...      ]    })  ]};\nexport default sbConfig;\n```\n\nExample:\n```text\n// stackbit.config.js\nexport default {  // other config properties ...  sidebarButtons: [    {      type: \"model\",      label: \"Global styles\",      icon: \"style\",      modelName: \"GlobalStyles\"    }  ]};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.431Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":6,"totalLines":37,"estimatedTokens":2150}}238{"id":"doc-aprimo_asset_integration_netlify_docs-008a9000","source":"documentation","title":"Aprimo asset integration | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/asset-sources/aprimo/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Aprimo in Visual Editor Identify your tenant name Configure Aprimo for local development Set up Aprimo for collaboration Toggle asset sources Data structure Git CMS image structure On this page Overview Configure Aprimo in Visual Editor Identify your tenant name Configure Aprimo for local development Set up Aprimo for collaboration Toggle asset sources Data structure Git CMS image structure For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Asset Sources / Aprimo asset integration Copy page View as Markdown Copy as Markdown View as Markdown Integrate with Aprimo to manage, transform, and deliver media assets to Visual Editor. Configure Aprimo in Visual EditorSection titled “Configure Aprimo in Visual Editor” After configuring Aprimo to work with your code and content source, you can enable the integration in Visual Editor. This differs based on your working mode. Identify your tenant nameSection titled “Identify your tenant name” The value is the collection of characters before the first dot (.) in your Aprimo domain. For example, if the URL for the Aprimo space is https://partner1.dam.aprimo.com/dam/spaces/..., the tenant would be partner1. Configure Aprimo for local developmentSection titled “Configure Aprimo for local development” Note Use the latest version of @stackbit/cli to ensure all Aprimo features are available when working locally. When working locally, Aprimo is enabled through the --aprimo-tenant option. (See above for identifying your tenant name.) Terminal windowstackbit dev --aprimo-tenant partner1 Set up Aprimo for collaborationSection titled “Set up Aprimo for collaboration” Go to your visual editor your site workspace in the visual editor, select the options icon next to your site name and select Visual editor settings from the drop-down menu. From your Site overview where you manage site deploys, go to Project configuration > Visual Editor > Asset sources. Under Asset-sources, next to Aprimo, choose Connect or select Options to edit an existing Aprimo asset source. Toggle asset sourcesSection titled “Toggle asset sources” When using Aprimo with a headless CMS, the Aprimo image picker will appear when you add or change an image. When using Git CMS, the modal provides the option to use other configured options in the bottom left corner. To specify a field as Aprimo-only, set the source property to aprimo. This will remove the dropdown toggle from the asset modal for that field. // stackbit.config.tsexport default defineStackbitConfig({ models: [ { name: \"Page\", fields: [ { name: \"image\", type: \"image\", source: \"aprimo\" } // ... ] // ... } ] // ...}); Data structureSection titled “Data structure” When a user selects an image in the Aprimo widget, the widget returns a JSON object with image metadata. When an integration exists between Aprimo and your content source (via a headless CMS), this data is stored in the format expected by the CMS. See here for the structure of the selected item. Git CMS image structureSection titled “Git CMS image structure” When using Git CMS, the data structure is dependent on the field configuration. By default, Visual Editor simply stores a URL string for the selected image. { \"image\": \"https://p1.sb.aprimocdn.net/partner1/...\"} To store the entire selected object, you must specify the field's source as specific to Aprimo. // stackbit.config.tsexport default defineStackbitConfig({ models: [ { name: \"Page\", fields: [ { name: \"image\", type: \"image\", source: \"aprimo\" } // ... ] // ... } ] // ...}); Here's an example of a stored object: { \"image\": { \"id\": \"05d2...\", \"title\": \"Image title ...\", \"rendition\": { \"id\": \"bf6b6...\", \"publicuri\": \"https://p1.sb.aprimocdn.net/partner1/...\" } }} Last 14, 2025 PreviousOverviewNextBynder Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nstackbit dev --aprimo-tenant partner1\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  models: [    {      name: \"Page\",      fields: [        { name: \"image\", type: \"image\", source: \"aprimo\" }        // ...      ]      // ...    }  ]  // ...});\n```\n\nExample:\n```text\n{  \"image\": \"https://p1.sb.aprimocdn.net/partner1/...\"}\n```\n\nExample:\n```text\n{  \"image\": {    \"id\": \"05d2...\",    \"title\": \"Image title ...\",    \"rendition\": {      \"id\": \"bf6b6...\",      \"publicuri\": \"https://p1.sb.aprimocdn.net/partner1/...\"    }  }}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.432Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":4,"totalLines":23,"estimatedTokens":1751}}239{"id":"doc-create_from_git_repository_netlify_docs-d830a8a3","source":"documentation","title":"Create from Git Repository | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/cloud-setup/import/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Requirements Needed permissions Custom Git branches On this page Overview Requirements Needed permissions Custom Git branches For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Cloud Setup / Create from Git Repository Copy page View as Markdown Copy as Markdown View as Markdown You can enable the visual editor for a site from a Git repository, including repositories hosted on these Git Bitbucket Tip To learn more about how Visual Editor creates a project and provisions the appropriate services, visit How the visual editor works. To learn more about getting started with setting up a site from a Git repository, check out these started with the visual editor Add new project RequirementsSection titled “Requirements” For a site to work with the visual editor, it must meet these must be separated from code and structured A valid configuration file A Node.js-based site framework using Node v14 or newer. Compatible content source Depending on your content source and mode, an API CMS configuration may be necessary. Needed permissionsSection titled “Needed permissions” To operate correctly with your repository, the visual editor needs the ability to commit and merge code, create branches and add a webhook. Because the visual editor operates on behalf of a Git user, your Git user must have the necessary read and write permissions on the repository. How your Git user is connected to the visual editor depends on the Git service provider you're using. You will be guided through the process after choosing the appropriate Git provider. Custom Git branchesSection titled “Custom Git branches” When creating a new project, the visual editor either infers or has sensible defaults for the Git branches it Branch (production): Matches the repository's primary branch (usually main or master). Working Branch (development/editing): Defaults to preview, and is automatically created for new projects when it doesn't exist. You can make adjustments to these defaults as needed. Learn more about Git branches in the visual editor. Last 9, 2026 PreviousGit branchingNextPreviewing Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.433Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1191}}240{"id":"doc-version_control_netlify_docs-9bfc93ee","source":"documentation","title":"Version control | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/version-control/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview View & restore versions Restore a version Supported content sources Implement version control Retrieve versions Display a version References On this page Overview View & restore versions Restore a version Supported content sources Implement version control Retrieve versions Display a version References For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Version control Copy page View as Markdown Copy as Markdown View as Markdown When a content source module supports version control, Visual Editor provides the ability to view and restore previous versions of a document. View & restore versionsSection titled “View & restore versions” When version control is enabled, the document editor displays a list of versions for the document. Clicking on a version in the list populates the fields for that version of the document. Clicking Restore when viewing a version restores the document to that version. Note the following from the image that are different from the current version are highlighted in blue. The version can be restored or the editor can be closed without restoring the version by using the Restore and Don't restore buttons. Switch to other versions by opening the versions list. Restore a versionSection titled “Restore a version” When a version is restored, the document is updated with the values from that version. The updated list of versions is then again retrieved using the getDocumentVersions method. The affect of restoring a version on the list of versions is determined by the implementation of the getDocumentVersions method, which is dependent upon the capabilities of the content source. Supported content sourcesSection titled “Supported content sources” This feature is supported in the following content DatoCMS Sanity Implement version controlSection titled “Implement version control” When implementing a custom CSI module, version control is enabled when the getDocumentVersions method is implemented. Retrieve versionsSection titled “Retrieve versions” When a document is active in a relevant editing context, the getDocumentVersions method is called to retrieve the list of versions for the document. Some content sources may not provide the ability to attach a document object to each version without additional API requests. In these cases, it is not necessary to populate the document object. Display a versionSection titled “Display a version” When a previous version is previewed, if the document object was attached to that version in the getDocumentVersions response, the document object is used to populate the field values in the editor. If the document object was not attached to the version, the getDocumentForVersion method is called to retrieve the document for the selected. ReferencesSection titled “References” DocumentVersion getDocumentVersions getDocumentForVersion Last 14, 2025 PreviousTree viewNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.434Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1388}}241{"id":"doc-localization_netlify_docs-a200373c","source":"documentation","title":"Localization | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/localization/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Requirements Types of localization Object vs field example Configure localization Override CSI modules Access control Locale modes Governance for field localization Edit localized content Locale switcher Default locale Create new objects Edit existing objects Localized presets Publish localized content Custom visual editing behavior setLocale stackbitLocaleChanged On this page Overview Requirements Types of localization Object vs field example Configure localization Override CSI modules Access control Locale modes Governance for field localization Edit localized content Locale switcher Default locale Create new objects Edit existing objects Localized presets Publish localized content Custom visual editing behavior setLocale stackbitLocaleChanged For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Localization Copy page View as Markdown Copy as Markdown View as Markdown Manage localized content by editing from the content source or extending with Visual Editor. New Feature This a new feature. Implementation details are subject to rapid change. Please contact us for more information and to stay updated with the latest changes. RequirementsSection titled “Requirements” This feature requires that content sources are managed via Content Source Interface, and is only available in the business and enterprise tiers. Types of localizationSection titled “Types of localization” Visual Editor supports two types of localization. Object-level document or object is associated with a single locale. Field-level document or object may have multiple locales, as determined by the fields within that object. Object vs field exampleSection titled “Object vs field example” For example, consider a site that has a Post model with title and body fields, and serves content in both the fr (French) and de (German) locales. If using object-level localization, there would be two documents of type Post, one for fr and another for de. If using field-level localization, there would only be a single object, while title might be an object with properties fr and de, storing the string reference to the value in each locale. How Visual Editor handles localization for you project depends on a number of factors, including the content source(s) being used, the site's localization strategy, along with the provided Visual Editor configuration. Configure localizationSection titled “Configure localization” Models or their fields need to set the localized property to true in the schema, and the content objects themselves to have a locale property assigned, where the value is the string reference to that field (e.g. de for German language content). Override CSI modulesSection titled “Override CSI modules” In some cases, locale behavior may be provided by the CSI module. If not, the CSI module can be extended to provide the appropriate logic to its internal methods, and to apply the appropriate properties to the models and documents. // stackbit.config.jsexport default { contentSources: [ new ContentfulContentSource({ , , , }) ], // Add `localized` property to localized models. mapModels({ models }) { return models.map(model => { // `LOCALIZED_MODELS` is an array of model name strings. if (LOCALIZED_MODELS.includes(model.name)) { return { ...model, }; } return model; }); }, // Add `localized` field values to localized objects. mapDocuments({ documents }) { return documents.map(document => { // `LOCALIZED_MODELS` is an array of model name strings. if (LOCALIZED_MODELS.includes(document.modelName)) { // `getDocumentLocale` returns the appropriate locale string for the document. const locale = getDocumentLocale(document); return { ...document, locale }; } return document; }); }, // Alternatively, use `models` to extend models in a more static way. models: { // ... }}; Tip Here's a more complete example using Contentful as the content source. Access controlSection titled “Access control” Access to one or more locales can be controlled through your visual editor settings. When adding a member or a team to the project, they can be limited to a single locale or be given access to all locales (global). If nothing is selected in the restriction dropdown, the user will have full access to all locales (global). See below for more information on locale modes (global vs specific). Locale modesSection titled “Locale modes” There are 2 modes for the locale and locale. These modes are used to handle access control, along with the current editing context. When in global : Users can view, create, and publish objects of all locales. are common across locales. Users can view, create, and publish all objects, with the ability to set field values in any locale. When in locale : Users can view, create, edit, and publish only content entries within the selected locale. Non-localized objects can be viewed but not edited from a specific locale. can view, create, edit, and publish only fields of the content entry within the selected locale. Non-localized objects can be viewed but not edited from a specific locale. The next section covers governance on field-level localization. More on editing below. Governance for field localizationSection titled “Governance for field localization” While you can control editing within a specific locale, full governance and publishing control is not available for field-level localization. Localization methodGovernancePublishingObject-level✓✓Field-level❌❌ This is because editors will have access to view non-localized content. And there is no way to be able to publish only values within a specific locale for a specific field. More on both editing and publishing below. Edit localized contentSection titled “Edit localized content” Managing localized content is done within the context of the current locale mode. This is controlled through the locale switcher, and it affects how objects are viewed, created, edited, published, and stored as presets. Locale switcherSection titled “Locale switcher” The current locale can be set via the locale switcher, found in the top bar controls within Visual Editor. Making a selection here changes the editing context for all content in the site. Default localeSection titled “Default locale” There is always a defaultLocale (most commonly en-US, but it can be changed). The default locale is the one immediately below Global in the locale switcher dropdown. Create new objectsSection titled “Create new objects” Creating objects in Visual Editor differs depending on the chosen localization using object-level localization in global mode, there will be multiple tabs. The editor must fill out the required fields in each of the selected locales before being able to create the object. This results in multiple objects, one per selected locale. When using object-level localization in locale mode, it is only possible to create a new object in that locale (set via the locale switcher. When using field-specific localization, the editor must fill out values for the default locale (required to build the object's base fields), along with fields that are required and localized in other tabs. This action creates only one object, while additional selected locales will be added as additional values to the existing object. To avoid editors accidentally generating content in multiple locales, creating objects with field-specific localization is only possible within global mode. Edit existing objectsSection titled “Edit existing objects” The editing experience differs depending on the localization strategy being used. global mode, all objects are shown and editable. In locale mode, only objects of the selected locale can be edited, though objects without a locale will still be shown. flags will show up next to objects and fields that are localized. In global mode, only fields of the default language are accessible. In locale mode, the fields of the selected locale will be shown. Localized presetsSection titled “Localized presets” Localized presets work differently depending on the localization strategy and mode being both object-level and field-specific, when in a specific locale, presets will be saved and visible only in the current locale as well as global mode. When in global mode, new presets will be visible to all other locales and can be used by all locales. In the case of field-specific localization, the same (and unique) preset values will be used in any locale. Presets cannot store different values for different locales. Instead, save multiple templates, one for each desired locale. Publish localized contentSection titled “Publish localized content” In a specific locale, the publish dropdown will only show objects that are localized to the currently-selected locale, along with objects that have localized fields. Publishing can not be focused on a specific localized field value. Users with access to the Global view will have visibility of changes and be able to publish all content. Custom visual editing behaviorSection titled “Custom visual editing behavior” You can customize how your website preview responds to localization changes in Visual Editor using client-side JavaScript. setLocaleSection titled “setLocale” Enables you to change the current locale, which will update the locale switcher. window.stackbit.setLocale(locale); See the reference for details. stackbitLocaleChangedSection titled “stackbitLocaleChanged” Listen for an editor to interact with the locale switcher and change the current locale. window.addEventListener(\"stackbitLocaleChanged\", event => { const locale = event.detail.locale; // Add custom behavior ...}); This may be useful for redirecting the current page to a version with the newly-selected locale. See the reference for details. Last 14, 2025 PreviousLocal developmentNextPersonalization Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.jsexport default {  contentSources: [    new ContentfulContentSource({      spaceId: process.env.CONTENTFUL_SPACE_ID,      environment: process.env.CONTENTFUL_ENVIRONMENT,      previewToken: process.env.CONTENTFUL_PREVIEW_TOKEN,      accessToken: process.env.CONTENTFUL_MANAGEMENT_TOKEN    })  ],  // Add `localized` property to localized models.  mapModels({ models }) {    return models.map(model => {      // `LOCALIZED_MODELS` is an array of model name strings.      if (LOCALIZED_MODELS.includes(model.name)) {        return { ...model, localized: true };      }      return model;    });  },  // Add `localized` field values to localized objects.  mapDocuments({ documents }) {    return documents.map(document => {      // `LOCALIZED_MODELS` is an array of model name strings.      if (LOCALIZED_MODELS.includes(document.modelName)) {        // `getDocumentLocale` returns the appropriate locale string for the document.        const locale = getDocumentLocale(document);        return { ...document, locale };      }      return document;    });  },  // Alternatively, use `models` to extend models in a more static way.  models: {    // ...  }};\n```\n\nExample:\n```text\nwindow.stackbit.setLocale(locale);\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.435Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":13,"estimatedTokens":3425}}242{"id":"doc-sitemap_navigator_netlify_docs-93b91896","source":"documentation","title":"Sitemap navigator | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/sitemap-navigator/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Navigate the sitemap Tree view Search pages Populate the sitemap Default sitemap from pages Custom sitemap On this page Overview Navigate the sitemap Tree view Search pages Populate the sitemap Default sitemap from pages Custom sitemap For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export default defineStackbitConfig({ contentSources: [ // ... ], modelExtensions: [ { name: \"page\", type: \"page\", urlPath: \"/{slug}\" }, { name: \"post\", type: \"page\", urlPath: \"/blog/{slug}\" } ]}); In this case, all pages and posts will show up in the sitemap. Custom sitemapSection titled “Custom sitemap” To override default behavior, use the siteMap property. The siteMap property provides an array of SiteMapEntry objects. These objects can specify URL paths or be tied directly to a document. We suggest using TypeScript to introspect the expected properties. Here’s an example that implements a similar approach to the default sitemap behavior. To ensure stableId is set to a value that will not change, the example includes logic to set a unique pageId for each page, if one doesn’t exist already. The pageId is then used for the stableId when generating the siteMap. // stackbit.config.tsimport { defineStackbitConfig, getLocalizedFieldForLocale, SiteMapEntry} from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", contentSources: [ // ... ], // the `pageId` field here modelExtensions: [ { name: \"page\", type: \"page\", urlPath: \"/{slug}\", fields: [{ name: \"pageId\", type: \"string\", }] } ], // this method to create the ID when creating a page async onContentCreate({ object, model }) { if (model.type !== \"page\") { return object; } // for pages that already have a pageId field, use that value; if not, generate one const hasPageIdField = !!model.fields?.find( field => field.name === \"pageId\" ); if (hasPageIdField && !object.pageId) { object.pageId = Date.now().toString(); } return object; }, siteMap: ({ documents, models }) => { const pageModels = models.filter(m => m.type === \"page\").map(m => m.name); return documents ) .filter(Boolean) as SiteMapEntry[]; }}); Last 14, 2025 PreviousPreview controlsNextTree view Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  contentSources: [    // ...  ],  modelExtensions: [    { name: \"page\", type: \"page\", urlPath: \"/{slug}\" },    { name: \"post\", type: \"page\", urlPath: \"/blog/{slug}\" }  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsimport {  defineStackbitConfig,  getLocalizedFieldForLocale,  SiteMapEntry} from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  contentSources: [    // ...  ],  // 1: add the `pageId` field here  modelExtensions: [    {      name: \"page\",      type: \"page\",      urlPath: \"/{slug}\",      fields: [{ name: \"pageId\", type: \"string\", hidden: true }]    }  ],\n  // 2: add this method to create the ID when creating a page  async onContentCreate({ object, model }) {    if (model.type !== \"page\") {      return object;    }    // for pages that already have a pageId field, use that value; if not, generate one    const hasPageIdField = !!model.fields?.find(      field => field.name === \"pageId\"    );    if (hasPageIdField && !object.pageId) {      object.pageId = Date.now().toString();    }\n    return object;  },\n  siteMap: ({ documents, models }) => {    const pageModels = models.filter(m => m.type === \"page\").map(m => m.name);    return documents      .filter(d => pageModels.includes(d.modelName))      .map(document => {        // 3: use the pageId value for the stableId        const slugField =          document.fields.slug.type === \"slug\"            ? document.fields.slug            : undefined;        const pageIdField =          document.fields.pageId.type === \"string\"            ? document.fields.pageId            : undefined;\n        const slug = getLocalizedFieldForLocale(slugField);        const pageId = getLocalizedFieldForLocale(pageIdField);\n        if (!slug.value || !pageId.value) return null;\n        const urlPath = \"/\" + slug.value.replace(/^\\/+/, \"\");\n        return {          stableId: pageId.value,          urlPath,          document,          isHomePage: urlPath === \"/\"        };      })      .filter(Boolean) as SiteMapEntry[];  }});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.436Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":22,"estimatedTokens":1730}}243{"id":"doc-bynder_asset_integration_netlify_docs-c91d48ba","source":"documentation","title":"Bynder asset integration | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/asset-sources/bynder/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Bynder in Visual Editor Authentication Disconnect Bynder Usage Use multiple asset sources Use Git CMS On this page Overview Configure Bynder in Visual Editor Authentication Disconnect Bynder Usage Use multiple asset sources Use Git CMS For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", contentSources: [ // ... ], assetSources: [{ type: \"bynder\" }]}); See below for details on authentication, along with further usage instruction. AuthenticationSection titled “Authentication” The first time each user attempts to access Bynder in the asset selection modal, they will be prompted to add the URL of your Bynder domain portal. Every editor will have to go through this process, which will authenticate the user to be able to upload and use Bynder images. Disconnect BynderSection titled “Disconnect Bynder” To disconnect Bynder for an individual user, sign out of Bynder. To disconnect an entire site from using Bynder, remove the appropriate entry in the assetSources property within Visual Editor configuration file. UsageSection titled “Usage” When using Bynder as an asset source, you'll see your Bynder assets appear within the asset selection modal for the appropriate field types. Use multiple asset sourcesSection titled “Use multiple asset sources” When using multiple custom asset sources, you'll see a dropdown menu in the bottom of the selection modal to enable toggling between sources. To show only the Bynder source for one particular field, define or extend the field and set the source property to bynder. const MyModel = { // ... fields: [ { name: \"image\", type: \"image\", source: \"bynder\" } ]}; Use Git CMSSection titled “Use Git CMS” With Git CMS, as long as assetsConfig is specified, Visual Editor will show Bynder in addition to Visual Editor (local) images. Use the source property (shown above) to show only the Bynder asset selection modal for a particular image field. Last 14, 2025 PreviousAprimoNextCloudinary Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  contentSources: [    // ...  ],  assetSources: [{ type: \"bynder\" }]});\n```\n\nExample:\n```text\nconst MyModel = {  // ...  fields: [    {      name: \"image\",      type: \"image\",      source: \"bynder\"    }  ]};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.436Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":14,"estimatedTokens":1247}}244{"id":"doc-preview_controls_netlify_docs-4e77230c","source":"documentation","title":"Preview Controls | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/preview-controls/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview How preview controls work Control contexts Global context Field context Usage example Light/Dark toggle with React On this page Overview How preview controls work Control contexts Global context Field context Usage example Light/Dark toggle with React For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from '@stackbit/types'import { useEffect, useState } from 'react'import 'styles.css' function MyApp({ Component, pageProps }) { const [currentTheme, setCurrentTheme] = useState<'light' | 'dark'>('light') useEffect(() => { if (typeof window === 'undefined') return const = { name: 'theme', label: 'Theme', context: 'global', type: 'enum', options: [ { value: 'light', label: 'Light' }, { value: 'dark', label: 'Dark' }, ], , , onChange: (value) => { console.log('theme changed to', value) setCurrentTheme(value as 'light' | 'dark') }, } const myWindow = window as any myWindow.stackbitPreviewControls = [themeControl] return () => { myWindow.stackbitPreviewControls = [] } }, [currentTheme]) return ( <div style={{ === 'dark' ? '#444444' : '#ffffff', }} > {/* ... */} </div> )} export default MyApp Tip This example was written for simplicity. In a production-ready application, it's typically a better practice to define a custom hook to abstract the common properties, making it easier to add controls throughout the application. Last 23, 2025 PreviousPersonalizationNextSitemap navigator Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n//_app.tsimport type { PreviewControl } from '@stackbit/types'import { useEffect, useState } from 'react'import 'styles.css'\nfunction MyApp({ Component, pageProps }) {  const [currentTheme, setCurrentTheme] = useState<'light' | 'dark'>('light')\n  useEffect(() => {    if (typeof window === 'undefined') return\n    const themeControl: PreviewControl = {      name: 'theme',      label: 'Theme',      context: 'global',      type: 'enum',      options: [        { value: 'light', label: 'Light' },        { value: 'dark', label: 'Dark' },      ],      required: true,      value: currentTheme,      onChange: (value) => {        console.log('theme changed to', value)        setCurrentTheme(value as 'light' | 'dark')      },    }\n    const myWindow = window as any    myWindow.stackbitPreviewControls = [themeControl]\n    return () => {      myWindow.stackbitPreviewControls = []    }  }, [currentTheme])\n  return (    <div      style={{        backgroundColor: currentTheme === 'dark' ? '#444444' : '#ffffff',      }}    >      {/* ... */}    </div>  )}\nexport default MyApp\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.437Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":15,"estimatedTokens":1267}}245{"id":"doc-tree_view_netlify_docs-3be3cce7","source":"documentation","title":"Tree view | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/tree-view/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Tree node types Build a tree Display children Edit documents Fetch documents Examples List of page documents List pages by URL path On this page Overview Tree node types Build a tree Display children Edit documents Fetch documents Examples List of page documents List pages by URL path For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending ); ExamplesSection titled “Examples” Here are a few very simple examples to get started. Both were built using Git CMS, but can be applied to any content source. List of page documentsSection titled “List of page documents” This example creates a root node called \"Site Pages\" and lists all document of model Page under it. //stackbit.config.tsimport { defineStackbitConfig, DocumentWithSource, TreeViewNode} from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", contentSources: [ /* ... */ ], ({ getDocuments }) => { const [\"children\"] = getPages(getDocuments()).map( document => ({ document, (document, \"title\") }) ); return [ { label: \"Site Pages\", children, stableId: \"pages-tree\" } ] as TreeViewNode[]; }}); function getFieldValue(page: DocumentWithSource, ) { const fieldObject = page.fields[field]; if (!fieldObject || !(\"value\" in fieldObject)) return; return fieldObject.value;} function getPages(documents: DocumentWithSource[]) { return documents.filter(document => document.modelName === \"Page\");} List pages by URL pathSection titled “List pages by URL path” Here's a more complex example, which builds a tree based on a nested URL structure, similar to how the sitemap navigator behaves. //stackbit.config.tsimport { defineStackbitConfig, DocumentWithSource, TreeViewNode} from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", ssgName: \"nextjs\", nodeVersion: \"16\", contentSources: [ /* ... */ ], ({ getDocuments }) => { type UrlTree = { [key: string]: UrlTreeNode; }; type UrlTreeNode = { document?: DocumentWithSource; slug?: string; children?: UrlTree; }; type ReducedUrlTree = { urlPath?: string; }; let = {}; getPages(getDocuments()).forEach(page => { const urlParts = getUrlParts(page); let docNode; urlParts.reduce<ReducedUrlTree>( (acc, part): ReducedUrlTree => { const id = acc.urlPath ? `${acc.urlPath}__${part}` : part; if (!acc.tree[part]) acc.tree[part] = { id }; if (!acc.tree[part].children) acc.tree[part].children = {}; docNode = acc.tree[part]; return { [part].children || {}, }; }, { } ); docNode.document = page; docNode.slug = urlParts[urlParts.length - 1]; }); function pagesTree(tree?: UrlTree): TreeViewNode[] { if (!tree || Object.keys(tree).length === 0) return []; return Object.entries(tree) .map(([slug, node]) => { const children = pagesTree(node.children); const label = slug === \"/\" ? \"Home Page\" : `/${slug}`; if (node.document) { return { , children, label }; } return { label, children, }; }) ]; return tree; }}); function getFieldValue(page: DocumentWithSource, ) { const fieldObject = page.fields[field]; if (!fieldObject || !(\"value\" in fieldObject)) return; return fieldObject.value;} function getPages(documents: DocumentWithSource[]) { return documents.filter(document => document.modelName === \"Page\");} function getUrlParts(page: DocumentWithSource) { const urlParts = `/${getFieldValue(page, \"_filePath_slug\")}` .replace(/^[\\/]+/, \"/\") .replace(/\\/index$/, \"\") .split(\"/\") .filter(Boolean); if (urlParts.length === 0) urlParts.push(\"/\"); return urlParts;} Last 14, 2025 PreviousSitemap navigatorNextVersion control Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nexport default defineStackbitConfig({  treeViews: async options => {    const allPages = options      .getDocuments()      .filter(document => document.modelName === \"Page\");    //    // Build the tree ...    //  }});\n```\n\nExample:\n```text\n//stackbit.config.tsimport {  defineStackbitConfig,  DocumentWithSource,  TreeViewNode} from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  contentSources: [    /* ... */  ],  treeViews: async ({ getDocuments }) => {    const children: TreeViewNode[\"children\"] = getPages(getDocuments()).map(      document => ({        document,        label: getFieldValue(document, \"title\")      })    );    return [      { label: \"Site Pages\", children, stableId: \"pages-tree\" }    ] as TreeViewNode[];  }});\nfunction getFieldValue(page: DocumentWithSource, field: string) {  const fieldObject = page.fields[field];  if (!fieldObject || !(\"value\" in fieldObject)) return;  return fieldObject.value;}\nfunction getPages(documents: DocumentWithSource[]) {  return documents.filter(document => document.modelName === \"Page\");}\n```\n\nExample:\n```text\n//stackbit.config.tsimport {  defineStackbitConfig,  DocumentWithSource,  TreeViewNode} from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  ssgName: \"nextjs\",  nodeVersion: \"16\",  contentSources: [    /* ... */  ],  treeViews: async ({ getDocuments }) => {    type UrlTree = {      [key: string]: UrlTreeNode;    };\n    type UrlTreeNode = {      id: string;      document?: DocumentWithSource;      slug?: string;      children?: UrlTree;    };\n    type ReducedUrlTree = {      tree: UrlTree;      urlPath?: string;    };\n    let urlTree: UrlTree = {};\n    getPages(getDocuments()).forEach(page => {      const urlParts = getUrlParts(page);      let docNode;      urlParts.reduce<ReducedUrlTree>(        (acc, part): ReducedUrlTree => {          const id = acc.urlPath ? `${acc.urlPath}__${part}` : part;          if (!acc.tree[part]) acc.tree[part] = { id };          if (!acc.tree[part].children) acc.tree[part].children = {};          docNode = acc.tree[part];          return { tree: acc.tree[part].children || {}, urlPath: id };        },        { tree: urlTree }      );      docNode.document = page;      docNode.slug = urlParts[urlParts.length - 1];    });\n    function pagesTree(tree?: UrlTree): TreeViewNode[] {      if (!tree || Object.keys(tree).length === 0) return [];      return Object.entries(tree)        .map(([slug, node]) => {          const children = pagesTree(node.children);          const label = slug === \"/\" ? \"Home Page\" : `/${slug}`;          if (node.document) {            return { document: node.document, children, label };          }          return { label, children, stableId: node.id };        })        .filter(Boolean) as TreeViewNode[];    }\n    const tree: TreeViewNode[] = [      {        label: \"Site Pages\",        children: pagesTree(urlTree),        stableId: \"pages-tree\"      }    ];\n    return tree;  }});\nfunction getFieldValue(page: DocumentWithSource, field: string) {  const fieldObject = page.fields[field];  if (!fieldObject || !(\"value\" in fieldObject)) return;  return fieldObject.value;}\nfunction getPages(documents: DocumentWithSource[]) {  return documents.filter(document => document.modelName === \"Page\");}\nfunction getUrlParts(page: DocumentWithSource) {  const urlParts = `/${getFieldValue(page, \"_filePath_slug\")}`    .replace(/^[\\/]+/, \"/\")    .replace(/\\/index$/, \"\")    .split(\"/\")    .filter(Boolean);  if (urlParts.length === 0) urlParts.push(\"/\");  return urlParts;}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.439Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":32,"estimatedTokens":2417}}246{"id":"doc-use_a_custom_content_source_with_visual_editor_n-07767370","source":"documentation","title":"Use a custom content source with Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/content-sources/custom/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Authenticate content editors On this page Overview Authenticate content editors For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Content Sources / Use a custom content source with Visual Editor Copy page View as Markdown Copy as Markdown View as Markdown Visual Editor works with any content source. If an official content source integration is not listed in the documentation, there are options to quickly add support for the source. Send us a message. Authenticate content editorsSection titled “Authenticate content editors” To make changes on behalf of a Visual Editor user, the user must establish a connection with the content source. If the custom content source is not compatible with a supported connection, please contact us to discuss developing the appropriate connection. Last 14, 2025 PreviousContentstackNextDatoCMS Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.439Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":878}}247{"id":"doc-local_development_netlify_docs-96408e6c","source":"documentation","title":"Local development | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/local-development/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Prerequisites How to use Run Next.js locally Install & run the CLI How it works Things to know Work with cookies Troubleshooting tips On this page Overview Prerequisites How to use Run Next.js locally Install & run the CLI How it works Things to know Work with cookies Troubleshooting tips For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Local development Copy page View as Markdown Copy as Markdown View as Markdown Develop and test your Visual Editor site in your local development environment. Visual Editor supports developing your project's code locally, including the ability to view your running local site inside Visual Editor’s user interface with full visual editing. This is a powerful way to iterate quickly when developing your site - especially when you're making changes to content models or annotations and want to immediately test these changes in the visual editing environment. Note that viewing your local site within Visual Editor webapp is optional. You can develop locally with just Next.js, without having to run our tooling for visual editing. PrerequisitesSection titled “Prerequisites” Operating , Windows or Linux (the same as Next.js supports. Node or later (which comes packaged with npm v6 or later). Chrome is currently required. Support for other browsers is planned. Tip You may want to use a tool like nvm to run your local site with the best matching Node and NPM versions, while not affecting other installed versions. How to useSection titled “How to use” Run Next.js locallySection titled “Run Next.js locally” Once the project's repository was transferred to you, you can clone and run the project locally. Option netlify clone (recommended) The simplest way to clone and link your project is with the Netlify CLI. Use the repository URL shown in the Settings windownetlify clone owner/repository-namecd <repository-name>git checkout <branch>nvm use # Optional - only if you're using nvm!npm installnpm run dev Or with the full repository windownetlify clone git@github.com:owner/repository-namecd <repository-name>git checkout <branch>nvm use # Optional - only if you're using nvm!npm installnpm run dev Option clone with Git The Settings dialog will show you the manual git commands to clone the project. The commands are similar to the below, with the repository URL already filled and for the preview branch - but you can create or pick any other branch to fit your needs. Terminal windowgit clone git@github.com:<user>/<repository-name>cd <repository-name>git checkout <branch>nvm use # Optional - only if you're using nvm!npm installnpm run dev At this point, Next.js should be running in dev mode on Check it out! You can already make changes to code & content files, and Next.js will refresh the page automatically. Now, let's leave this process running and get your local site displayed within Visual Editor webapp. Install & run the CLISection titled “Install & run the CLI” Install the Stackbit CLI for Visual Editor from the windownpm install -g @stackbit/cli The above command specifies the -g flag to install the package globally and have its executable available everywhere. This may require installing with sudo, depending on your setup (not needed when using nvm). Run from your local repository's windowstackbit dev or windowstackbit dev -d <path-to-dir> Open http://localhost:8090/_stackbit in your browser. This will redirect you straight to Visual Editor editor showing your local site. You can bookmark this URL if you want. You can now highlight elements, make content changes that will get reflected in your local files, or make code changes locally and see them reflected immediately. That's all there is to it! Make sure to read things to know. If something's wrong, jump to troubleshooting tips below. How it worksSection titled “How it works” By default, visual editor sites are backed by a remote container managed by us, which is running the site’s preview branch. What you're seeing in the webapp is that container's output, loaded through an code iframe and proxied by our servers to provide the highlighting and editing experience. Everyone working on the same site’s visual editing experience locally work with that container. In local development mode, the webapp loads the iframe directly from your local proxy (the stackbit dev process). This proxy serves what your local SSG is rendering, but adds a layer on top to support visual highlights, authenticated content changes, and more. The URL of the page (e.g. https://create.netlify.com/studio/7620acff1hs75ak19ad) is unique to you and is hard-wired to communicate with the stackbit dev process running on your local machine. It will only work correctly when opened on your machine. Things to knowSection titled “Things to know” Important There is no association between local development mode and the regular Visual Editor project you've created through the UI. You can use local development to edit any repository that you have cloned locally.Content editors and other Developers should keep working with the regular project accessible from the dashboard, as usual. Regular Visual Editor projects always reflect the code in the project's preview branch. When you push code to that branch by whatever means, the webapp will update automatically and changes will be visible to anyone currently working on the project. So make sure to test beforehand. If you have multiple projects in Visual Editor, you can use local development to work with any of them. To switch between code repositories, stop the stackbit dev process and re-run it from the relevant directory. shown URL does not change per repository. Also note the following the webapp is in local development mode, the buttons to share & publish are disabled, as these actions are not applicable. Logs are not shown in the webapp. Check the logs locally (both the web server and stackbit dev emit logs to the terminal). As mentioned above, you decide whether and when to commit and push, and which code repository and branch to work with. stackbit dev treats the runnable directory as the directory in which the command was run. You can change this with the --dir (alias: -d) option. development, it's natural to make mistakes when defining models or manually editing content files, which can result in rendering errors and stuff generally not working. It's recommended to regularly run stackbit validate when making such changes to get a verbose check-up of content & models in your code. Work with cookiesSection titled “Work with cookies” When working with cookies in your application, they are often set for the domain and port on which your development server is running (e.g. ). Because Visual Editor Dev proxies your dev server through local port 8090, your cookies need to run on You can achieve this by setting the following windowSameSite=lax Troubleshooting tipsSection titled “Troubleshooting tips” If the webapp keeps showing \"Connecting to local dev environment\" with a loading message means that the webapp cannot connect to the local stackbit dev process. Here's what to sure stackbit dev is working on your local machine and its log shows no errors. Make sure you're using Google Chrome as your browser, on that same machine. If you use multiple user accounts on Visual Editor (this is normally not required, as the same user can be a member of multiple organizations): re-run stackbit dev after logging-in to the desired user, and click the shown URL to open the webapp. When the connection to stackbit dev is re-established, the webapp should refresh automatically. If nothing of the above works, re-run stackbit dev --log-level debug and share the output with us. If you're seeing \"Failed to connect to your site's local server\": This means that stackbit dev is working, but cannot access your Next's local dev server (launched with npm run dev). This usually happens only when Next.js is down or unresponsive. Make sure that Next.js is running in its default port (3000). Look for errors in the Next.js terminal output. Try to restart Next.js. Hot module reloading in dev mode can sometimes get the server unstable. Last 19, 2025 PreviousGlobal stylesNextLocalization Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nnetlify clone owner/repository-namecd <repository-name>git checkout <branch>nvm use # Optional - only if you're using nvm!npm installnpm run dev\n```\n\nExample:\n```text\nnetlify clone git@github.com:owner/repository-namecd <repository-name>git checkout <branch>nvm use # Optional - only if you're using nvm!npm installnpm run dev\n```\n\nExample:\n```text\ngit clone git@github.com:<user>/<repository-name>cd <repository-name>git checkout <branch>nvm use # Optional - only if you're using nvm!npm installnpm run dev\n```\n\nExample:\n```text\nnpm install -g @stackbit/cli\n```\n\nExample:\n```text\nstackbit dev\n```\n\nExample:\n```text\nstackbit dev -d <path-to-dir>\n```\n\nExample:\n```text\nSameSite=lax\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.440Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":7,"totalLines":38,"estimatedTokens":2890}}248{"id":"doc-use_visual_editor_with_your_own_framework_netlif-1266bc7e","source":"documentation","title":"Use Visual Editor with your own framework | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/frameworks/custom/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Start with local development Define how we run your site Guides On this page Overview Start with local development Define how we run your site Guides For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Frameworks / Use Visual Editor with your own framework Copy page View as Markdown Copy as Markdown View as Markdown If we don’t have built-in support for your framework, you can configure Visual Editor to work with your framework by following this document. Start with local developmentSection titled “Start with local development” First, make sure your website is editable via our Visual Editor in local development mode. Set in your Visual Editor configuration file (see reference. Implement content reload when your website is open within Visual Editor by capturing the stackbitObjectsChanged window event. The guides section below links to concrete examples with various web frameworks. Define how we run your siteSection titled “Define how we run your site” Once visual editing is working well locally, it's time to configure how your website should run as a hosted Netlify Visual Editor project. Define the command to launch your website's server in development mode via the devCommand property (reference. For a smooth experience in Visual Editor, you may also need to define additional properties which are currently - When we run your website's server, it typically takes some time (from as few seconds to a few dozen seconds) before the server process is ready to accept requests. Set this property to the log message (or any part of it) that is printed when the server is ready. (Note that there is also a polling mechanism in place to start Visual Editor once the root route (/) returns an HTML response.) experimental.ssg.passthrough - Many frameworks use a Websocket connection in development mode between the client and server to trigger a client-side refresh on code changes (a.k.a. HMR or Hot Module Replacement). The relative path to the websocket endpoint on the server should be specified in this attribute, so our container does not interfere with it. GuidesSection titled “Guides” The following frameworks are implemented with : SvelteKit Hydrogen If you need a framework that’s not listed yet, talk to us! Need framework help? For help in setting up the visual editor for a different framework, you can reach out to us. Last 14, 2025 PreviousAstroNextEleventy Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.442Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1266}}249{"id":"doc-overview_for_visual_editor_framework_support_net-e8eea773","source":"documentation","title":"Overview for visual editor framework support | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/frameworks/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Requirements Make your site editable Configure how to run your website Configure how to deploy your live website Framework-specific notes On this page Overview Requirements Make your site editable Configure how to run your website Configure how to deploy your live website Framework-specific notes For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Frameworks / Overview for visual editor framework support Copy page View as Markdown Copy as Markdown View as Markdown Visual Editor is not framework-specific in any way and does not require using framework-specific libraries. Rather, it has certain requirements that websites built with virtually all modern frameworks can satisfy. It's highly recommend to read How the visual editor works before diving further. In this article we assume that you're up to speed on content-driven development and working modes (local development vs. a hosted Visual Editor project). RequirementsSection titled “Requirements” To use Visual Editor with your framework, follow the below instructions to make your site editable and to configure how Visual Editor should run and deploy your website. Make your site editableSection titled “Make your site editable” To run in any environment, including local development, you need the valid configuration file (reference. Make sure to specify which content models represent pages, and what is their URL path. Support for Content Reload (guide. This typically requires adding code to your site. See specific framework guides for [Optional] data attributes marking where in the page content objects and their fields are found. Annotations enable visual highlighting in the editor. When content changes are made by anyone, Visual Editor detects the change automatically. Then, gracefully reloading on-page content without a full-page reload is essential for the user experience. Reloading can be handled by Visual Editor in \"fully-automatic\" mode for certain frameworks (currently Next.js, Angular and Gatsby. For other frameworks, your website's code should implement a listener on content change events and efficiently refresh the page contents. These events are only fired when working with Visual Editor - your production site is never affected. In each of the framework guides below we link to a concrete code example and explain how content reload was implemented in it. Configure how to run your websiteSection titled “Configure how to run your website” When you create a hosted Visual Editor Project (either by choosing a starter or importing an existing repository), Visual Editor runs your website in a cloud-based container. Inside that container, we run your site's server. Your website server should be run in your web framework's development mode, in which any code changes trigger a refresh and any statically-generated pages can be re-created on content changes. For a few frameworks (currently Next.js, Angular and Gatsby the needed configuration is all set by default. For others, see the guide to bringing your own framework. Configure how to deploy your live websiteSection titled “Configure how to deploy your live website” To deploy your site on Netlify, you also need to include a Netlify configuration file netlify.toml in your repository. All starters & examples include this file. Framework-specific notesSection titled “Framework-specific notes” to use Visual Editor with an Angular-based website to use Visual Editor with an Astro-based website Bring your to use Visual Editor with any framework to use Visual Editor with an Eleventy-based website to use Visual Editor with a website that uses Shopify’s Hydrogen Next.js: how to use Visual Editor with a Next.js-based website Nuxt to use Visual Editor with a Nuxt 3-based website to use Visual Editor with a SvelteKit-based website Last 14, 2025 PreviousSanityNextAngular Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.442Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1626}}250{"id":"doc-use_visual_editor_with_eleventy_netlify_docs-28a0ba60","source":"documentation","title":"Use Visual Editor with Eleventy | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/frameworks/eleventy/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Visual Editor for an Eleventy project Run the Visual Editor locally On this page Overview Configure Visual Editor for an Eleventy project Run the Visual Editor locally For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Frameworks / Use Visual Editor with Eleventy Copy page View as Markdown Copy as Markdown View as Markdown Learn how to use Visual Editor with an Eleventy-based website. Configure Visual Editor for an Eleventy projectSection titled “Configure Visual Editor for an Eleventy project” Eleventy is supported through the option and requires some additional custom options. // stackbit.config.tsexport default { stackbitVersion: \"~0.6.0\", ssgName: \"eleventy\", nodeVersion: \"18\", // Eleventy to run inside Visual Editor container devCommand: \"npx @11ty/eleventy --serve --port {PORT}\", // Eleventy-specific configuration experimental: { ssg: { , logPatterns: { up: [\"Server at\"], } } }, // Specific option to prevent Visual Editor from interfering with Eleventy's page reload mechanism }; Note the use of some experimental configuration properties and customContentReload to ensure compatibility with is set to ['Server at']. This is part of the log message that appears when the Eleventy dev server is ready to accept requests. experimental.ssg.proxyWebsockets is set to true, which enables proxying of the Eleventy websocket to Visual Editor. This allows the website to refresh when content changes. customContentReload set to a true, which disables the Visual Editor’s built-in methods for refreshing the page when content changes. By combining this setting with experimental.ssg.proxyWebsockets, Eleventy will refresh content using it’s own mechanisms without the Visual Editor interfering with it. Run the Visual Editor locallySection titled “Run the Visual Editor locally” The Visual Editor’s default port is 3000. To run Visual Editor locally with an Eleventy project, you need to change the port that Eleventy runs on to windownpx @11ty/eleventy --serve --port 3000 Another option is to use the Visual Editor CLI command to run the Visual Editor on the port that Eleventy windowstackbit dev --port 8083 Last 23, 2025 PreviousCustomNextGatsby Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsexport default {  stackbitVersion: \"~0.6.0\",  ssgName: \"eleventy\",  nodeVersion: \"18\",\n  // Eleventy to run inside Visual Editor container  devCommand: \"npx @11ty/eleventy --serve --port {PORT}\",\n  // Eleventy-specific configuration  experimental: {    ssg: {      proxyWebsockets: true,      logPatterns: {        up: [\"Server at\"],      }    }  },\n  // Specific option to prevent Visual Editor from interfering with Eleventy's page reload mechanism  customContentReload: true};\n```\n\nExample:\n```text\nnpx @11ty/eleventy --serve --port 3000\n```\n\nExample:\n```text\nstackbit dev --port 8083\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.443Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":21,"estimatedTokens":1371}}251{"id":"doc-use_visual_editor_with_angular_netlify_docs-3c7821b6","source":"documentation","title":"Use Visual Editor with Angular | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/frameworks/angular/","text":"Example:\n```text\nnpm run config --if-present && ./node_modules/.bin/ng serve  --port {PORT} --disable-host-check\n```\n\nExample:\n```text\nimport { Injectable } from \"@angular/core\";import { Subject } from \"rxjs\";\nexport class StackbitEvent {  changedContentTypes: string[];  changedObjectIds: [];  currentPageObjectId: string;  currentUrl: string;  visibleObjectIds: [];}\n@Injectable()export class StackbitService {  public contentChanged = new Subject<StackbitEvent>();\n  constructor() {    window.addEventListener(      \"stackbitObjectsChanged\",      (event: any) => {        this.contentChanged.next({          changedContentTypes: event.detail.changedContentTypes,          changedObjectIds: event.detail.changedObjectIds          // ...copy rest of properties        });\n        event.preventDefault();      },      { passive: false }    );  }}\n```\n\nExample:\n```text\nimport { Injectable } from \"@angular/core\";import { BehaviorSubject } from \"rxjs\";import { StackbitEvent, StackbitService } from \"./stackbit.service\";// ...\n@Injectable()export class ContentfulService {  constructor(private stackbitService: StackbitService) {    // ...  }\n  getProduct(slug: string): BehaviorSubject<Promise<Entry<any>>> {    const productSubject = new BehaviorSubject(      this.getProductFromContentful(slug)    );    this.stackbitService.contentChanged.subscribe({      next: (event: StackbitEvent) => {        productSubject.next(this.getProductFromContentful(slug));      }    });    return productSubject;  }\n  // ...}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.444Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":3,"totalLines":23,"estimatedTokens":382}}252{"id":"doc-content_sources_overview_netlify_docs-646389e5","source":"documentation","title":"Content sources overview | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/content-sources/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Example usage CSI and your code Supported sources Experimental sources Use a content source Add multiple sources Authenticate content editor accounts Supported connections Bring your own source Module requirements Using TypeScript Migrate to a new source Configuration example On this page Overview Example usage CSI and your code Supported sources Experimental sources Use a content source Add multiple sources Authenticate content editor accounts Supported connections Bring your own source Module requirements Using TypeScript Migrate to a new source Configuration example For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/cms-contentful\"; export default { contentSources: [ new ContentfulContentSource({ , , , }) ] // ...}; If configured properly, you will immediately be able to see your models in the content panel. You can then drill into any object and see two-way sync in action. Edit it in Visual Editor, and the source gets updated. Edit it in the source, and within moments Visual Editor will show the updated value. CSI and your codeSection titled “CSI and your code” CSI modules and the stackbit.config.js file are not loaded by your site's code. Rather, these are used by Visual Editor’s dev server to load and modify data through Visual Editor. Your own code for fetching data from any of its content sources is not impacted or replaced by the CSI, at all. This means are still responsible for writing the code that retrieves content from your source(s) and feeds them into your pages and components. You don't have to make changes to your site to be able to use CSI (assuming that your content is not hard-coded into your code) Any dependencies needed for CSI can be installed as development dependencies, and are not needed for your live site. Supported sourcesSection titled “Supported sources” The following modules are supported directly by Visual Contentstack DatoCMS Git CMS Hygraph Sanity Experimental sourcesSection titled “Experimental sources” We're currently experimenting with these additional Shopify Figma For inquiries and requests regarding new sources, please contact us. Use a content sourceSection titled “Use a content source” Working with a supported content source takes just a few steps. Assuming you already have the source itself (e.g. the CMS) ready to go, the process usually looks like the NPM package for the module (as a development dependency). Add the content source to the contentSources array in your configuration file. Here's an example that adds Contentful as a content source. // stackbit.config.jsimport { ContentfulContentSource } from \"@stackbit/cms-contentful\"; export default { contentSources: [ new ContentfulContentSource({ , , , }) ] // ...}; Add multiple sourcesSection titled “Add multiple sources” Because contentSources is an array of instantiated classes, adding another source is a matter of adding a new item to the array. This means that using two accounts from the same service provider is also possible. Here's an example: // stackbit.config.jsimport { ContentfulContentSource } from \"@stackbit/cms-contentful\"; export default { contentSources: [ new ContentfulContentSource({ , , , }), new ContentfulContentSource({ , , , }) ] // ...}; Authenticate content editor accountsSection titled “Authenticate content editor accounts” To be able to make changes to content in the source requires connecting a Visual Editor user account to an account to the content source. Here’s the process for making these the visual editor dashboard, in the top right, select your avatar. Next, select Linked accounts. Next to the content source you want, choose Connect. Follow the prompts to connect with your content source. Supported connectionsSection titled “Supported connections” The following third-party connections are Contentstack DatoCMS GitHub Sanity Bring your own sourceSection titled “Bring your own source” Because content source modules are defined as instantiated JavaScript classes in the configuration file, you can bring your own content source, even if not officially supported by Visual Editor. Use the CSI API reference to ensure you're implementing the JavaScript class properly. Module requirementsSection titled “Module requirements” Any content source that can read and write data via an API or direct local access can be used as a content module. This (or API-based) CMS (e.g. Contentful) Database as a Service (e.g. PlanetScale) Internal product database (e.g. PostgreSQL) Non-traditional services (e.g. Figma) File-based content (e.g. Markdown files) Using TypeScriptSection titled “Using TypeScript” We recommend using TypeScript in your CSI module. This benefits both you by ensuring that you implement all necessary methods. It also benefits developers that using the module by making it easier to discover required options when instantiating the class in their configuration file. Migrate to a new sourceSection titled “Migrate to a new source” CSI makes it trivial to migrate to a new content source without sacrificing content downtime or adding complexity to your code. You can move one page at a time from the old source to the new source as long have properly configured the content sources, and ... Your frontend code supports the content structure from both sources. Configuration exampleSection titled “Configuration example” Ensure that you're adding both sources to your config file: // stackbit.config.jsimport { MyOldSource } from \"my-old-source\";import { MyNewSource } from \"my-new-source\"; export default { contentSources: [ new MyOldSource({ // configuration options ... }), new MyNewSource({ // configuration options ... }) ] // ...}; Then you can add a new page to the new source and delete the old page from the old source. Do this one at a time until you've moved all the content to the new content source. Last 25, 2025 PreviousPublishingNextContentful Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.jsimport { ContentfulContentSource } from \"@stackbit/cms-contentful\";\nexport default {  contentSources: [    new ContentfulContentSource({      spaceId: process.env.CONTENTFUL_SPACE_ID,      environment: process.env.CONTENTFUL_ENVIRONMENT,      previewToken: process.env.CONTENTFUL_PREVIEW_TOKEN,      accessToken: process.env.CONTENTFUL_MANAGEMENT_TOKEN    })  ]  // ...};\n```\n\nExample:\n```text\n// stackbit.config.jsimport { ContentfulContentSource } from \"@stackbit/cms-contentful\";\nexport default {  contentSources: [    new ContentfulContentSource({      spaceId: process.env.CONTENTFUL_SPACE_ID_01,      environment: process.env.CONTENTFUL_ENVIRONMENT_01,      previewToken: process.env.CONTENTFUL_PREVIEW_TOKEN_01,      accessToken: process.env.CONTENTFUL_MANAGEMENT_TOKEN_01    }),    new ContentfulContentSource({      spaceId: process.env.CONTENTFUL_SPACE_ID_02,      environment: process.env.CONTENTFUL_ENVIRONMENT_02,      previewToken: process.env.CONTENTFUL_PREVIEW_TOKEN_02,      accessToken: process.env.CONTENTFUL_MANAGEMENT_TOKEN_02    })  ]  // ...};\n```\n\nExample:\n```text\n// stackbit.config.jsimport { MyOldSource } from \"my-old-source\";import { MyNewSource } from \"my-new-source\";\nexport default {  contentSources: [    new MyOldSource({      // configuration options ...    }),    new MyNewSource({      // configuration options ...    })  ]  // ...};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.445Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":21,"estimatedTokens":2468}}253{"id":"doc-use_visual_editor_with_astro_netlify_docs-0714e117","source":"documentation","title":"Use Visual Editor with Astro | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/frameworks/astro/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Visual Editor for an Astro project Run the Visual Editor locally Example On this page Overview Configure Visual Editor for an Astro project Run the Visual Editor locally Example For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Frameworks / Use Visual Editor with Astro Copy page View as Markdown Copy as Markdown View as Markdown Astro is a modern web framework designed to build fast websites by optimizing for performance and simplicity. It uses a component-based architecture, supporting popular frameworks like React, Vue, and Svelte, but prioritizes minimal JavaScript on the client side. Configure Visual Editor for an Astro projectSection titled “Configure Visual Editor for an Astro project” Astro is supported through the option. Follow the example branch for a concrete example of how to integrate Visual Editor with Astro. Here’s an excerpt from the Visual Editor configuration file: // stackbit.config.tsexport default { stackbitVersion: \"~0.6.0\", ssgName: \"custom\", nodeVersion: \"18\", // Astro to run inside Visual Editor container devCommand: \"node_modules/.bin/astro dev --port {PORT} --hostname 127.0.0.1\", // Astro-specific configuration experimental: { ssg: { name: \"Astro\", logPatterns: { up: [\"is ready\", \"astro\"] }, directRoutes: { \"socket.io\": \"socket.io\" }, passthrough: [\"/vite-hmr/**\"] } }}; Note the use of some experimental configuration properties to ensure compatibility with Vite (the development server used by Astro and others): experimental.ssg.logPatterns.up is set to ['is ready']. This is part of the log message that appears when the Vite dev server is ready to accept requests. experimental.ssg.passthrough is set to a dedicated relative path to Vite’s Hot Module Replacement (HMR) WebSocket endpoint. The path \"/vite-hmr/\" is configured accordingly in astro.config.mjs. With this setting, all code changes will trigger a client refresh through Vite’s HMR mechanism, without interference from our container. Run the Visual Editor locallySection titled “Run the Visual Editor locally” Visual Editor’s default port is 3000. To run Visual Editor locally with an Astro project, you need to change the default Astro port from 4321 to 3000 in astro.config.mjs: server: { } Another option is to specify the port with Visual Editor CLI command windowstackbit dev --port 4321 ExampleSection titled “Example” Astro + Git Content Source Example. Last 14, 2025 PreviousAngularNextCustom Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsexport default {  stackbitVersion: \"~0.6.0\",  ssgName: \"custom\",  nodeVersion: \"18\",  // Astro to run inside Visual Editor container  devCommand: \"node_modules/.bin/astro dev --port {PORT} --hostname 127.0.0.1\",  // Astro-specific configuration  experimental: {    ssg: {      name: \"Astro\",      logPatterns: {        up: [\"is ready\", \"astro\"]      },      directRoutes: {        \"socket.io\": \"socket.io\"      },      passthrough: [\"/vite-hmr/**\"]    }  }};\n```\n\nExample:\n```text\nserver: {  port: 3000}\n```\n\nExample:\n```text\nstackbit dev --port 4321\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.445Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":3,"totalLines":18,"estimatedTokens":1425}}254{"id":"doc-use_datocms_with_visual_editor_netlify_docs-17dc8869","source":"documentation","title":"Use DatoCMS with Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/content-sources/datocms/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Example configuration Prerequisites Usage Options Local development Install ngrok Start ngrok agent Start stackbit dev Restart ngrok On this page Overview Example configuration Prerequisites Usage Options Local development Install ngrok Start ngrok agent Start stackbit dev Restart ngrok For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from '@stackbit/types'import { DatoCMSContentSource } from '@stackbit/cms-datocms' export default defineStackbitConfig({ stackbitVersion: '~0.6.0', contentSources: [ new DatoCMSContentSource({ !, !, }), ], modelExtensions: [{ name: 'page', type: 'page', urlPath: '/{slug_field}' }],}) PrerequisitesSection titled “Prerequisites” To be able to work with DatoCMS, you must first have the DatoCMS project with models and content. A full-access API token and ID of the project, both stored as environment variables. (See options below.) Installed @stackbit/cms-datocms package as a development dependency. (We also recommend @stackbit/types to help with configuration.) Terminal windownpm install -D @stackbit/types @stackbit/cms-datocms UsageSection titled “Usage” import { DatoCMSContentSource } from '@stackbit/cms-datocms' new DatoCMSContentSource({ apiToken: '...', projectId: '...',}) OptionsSection titled “Options” The following are all required : identifying value of the DatoCMS project. It can be found when viewing the project from the dashboard. It is not the name of the project. API token, accessible from the API tokens tab (under Permissions) within a project. Store sensitive valuesSection titled “Store sensitive values” Sensitive values can be stored in a .env file, which will then be available when Visual Editor configuration file is loaded. Terminal window# .envDATOCMS_API_TOKEN=\"...\"DATOCMS_PROJECT_ID=\"...\" Local developmentSection titled “Local development” DatoCMS uses webhooks to synchronize data. To work with Visual Editor in local development, the easiest method is to use an ngrok tunnel and pass the tunnel URL when running stackbit dev. Install ngrokSection titled “Install ngrok” After signing up for an ngrok account, install the agent on your machine. Start ngrok agentSection titled “Start ngrok agent” With your development server running in another terminal window, start the ngrok agent on port 8090. Terminal windowngrok http 8090 This will output a publicly-accesible URL from which you can access Terminal windowSession Status online...Forwarding http://xyz.ngrok.app -> http://localhost:8090Forwarding https://xyz.ngrok.app -> http://localhost:8090 Start stackbit devSection titled “Start stackbit dev” When starting stackbit dev, use the ngrok URL as part of the csi-webhook-url option, being sure to maintain the path /_stackbit/onWebhook. Terminal windowstackbit dev --csi-webhook-url https://xyz.ngrok.app/_stackbit/onWebhook Now you are good to open /_stackbit and start developing locally. Restart ngrokSection titled “Restart ngrok” When restarting the ngrok agent, you will typically receive a different URL. This will result in an error saying that a webhook with a name stackbit-webhook-local already exists. If this happens, delete the stackbit-webhook-local webhook in your DatoCMS settings. Last 23, 2025 PreviousCustomNextGit Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from '@stackbit/types'import { DatoCMSContentSource } from '@stackbit/cms-datocms'\nexport default defineStackbitConfig({  stackbitVersion: '~0.6.0',  contentSources: [    new DatoCMSContentSource({      apiToken: process.env.DATOCMS_API_TOKEN!,      projectId: process.env.DATOCMS_PROJECT_ID!,    }),  ],  modelExtensions: [{ name: 'page', type: 'page', urlPath: '/{slug_field}' }],})\n```\n\nExample:\n```text\nnpm install -D @stackbit/types @stackbit/cms-datocms\n```\n\nExample:\n```text\nimport { DatoCMSContentSource } from '@stackbit/cms-datocms'\nnew DatoCMSContentSource({  apiToken: '...',  projectId: '...',})\n```\n\nExample:\n```text\n# .envDATOCMS_API_TOKEN=\"...\"DATOCMS_PROJECT_ID=\"...\"\n```\n\nExample:\n```text\nngrok http 8090\n```\n\nExample:\n```text\nSession Status    online...Forwarding        http://xyz.ngrok.app -> http://localhost:8090Forwarding        https://xyz.ngrok.app -> http://localhost:8090\n```\n\nExample:\n```text\nstackbit dev --csi-webhook-url https://xyz.ngrok.app/_stackbit/onWebhook\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.446Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":7,"totalLines":40,"estimatedTokens":1718}}255{"id":"doc-use_sanity_with_visual_editor_netlify_docs-ba4513eb","source":"documentation","title":"Use Sanity with Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/content-sources/sanity/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Sanity as a content source Prerequisites Usage Model type inference Custom Studio installation Provision Sanity Export content from Sanity Import configuration On this page Overview Configure Sanity as a content source Prerequisites Usage Model type inference Custom Studio installation Provision Sanity Export content from Sanity Import configuration For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\";import { SanityContentSource } from \"@stackbit/cms-sanity\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", ssgName: \"nextjs\", nodeVersion: \"16\", contentSources: [ new SanityContentSource({ , (__dirname, \"studio\"), studioUrl: \"https://project.sanity.studio\", !, !, || \"production\" }) ], mapModels: ({ models }) => { return models.map(model => { if (model.name === \"page\") { return { ...model, type: \"page\", urlPath: \"/{slug}\" }; } return model; }); }}); Notice the is being loaded from the @stackbit/cms-sanity which must be installed first. This package is not needed in your production site. Sanity is being configured using local environment variables. Visual Editor automatically loads a from \"@stackbit/cms-sanity\"; new SanityContentSource({ rootPath: \"...\", studioPath: \"...\", studioUrl: \"...\", projectId: \"...\", token: \"...\", dataset: \"...\", studioInstallCommand: \"...\"}); OptionsSection titled “Options” The following are all required options unless otherwise : name of the dataset to be used when editing the content. This is often set as production. ID value assigned to your Sanity project. path to the frontend project. This is note the path to the studio, which is covered by studioPath. studioPath: (optional) absolute path to the studio project, which is often contained within the rootPath project directory. The default path is: ${rootPath}/studio. studioInstallCommand: (optional) custom command to run when installing Sanity studio for your visual editor with the cloud setup. This can be ignored if using the typical studio installation pattern. To skip install the installation process entirely, set to an unobtrusive command such as echo 'skipping install'. studioUrl: (optional) the URL to the deployed Sanity Studio instance. The visual editor will use this link in the toolbar that appears when you highlight an object. If not set, the link to Sanity in the toolbar will be disabled. access token. Store sensitive valuesSection titled “Store sensitive values” Sensitive values can be stored in a ); Skip Studio installationSection titled “Skip Studio installation” To skip the Sanity Studio installation process entirely, specify an arbitrary and unobtrusive command. For example, to simply print \"skipping install\" to the console, do SanityContentSource({ studioInstallCommand: `echo 'skipping install'` // ...}); Provision SanitySection titled “Provision Sanity” Note This is only relevant when creating a Visual Editor project from a template.You don't need Sanity provisioning if you have already set up a Sanity project for your project, or if you plan to manually create and configure a project. Visual Editor will handle provisioning a new Sanity project, along with the initial payload of models and content when creating a new project from a template. Export content from SanitySection titled “Export content from Sanity” In most cases, projects that can be provisioned with Sanity as a content source have a Sanity project as the source of truth for duplicated projects. The first step in preparing your project to be duplicated is to export the content schema and the initial site contents from your Sanity project. Be sure to configure the export to include a compressed file of all appropriate schemas, documents, and assets. Commit the exported data file to your project. See here for an example. Tip Here is an export script we often use in Sanity projects. It generates a export.tar.gz file, like the one found in our Sanity starter. Import configurationSection titled “Import configuration” Once you've exported the content (and committed the data file), all that is left to do is add configuration for importing the content during the provisioning process. The following properties should be added to an import property in your Visual Editor configuration file. All properties are required and are strings, unless otherwise noted. relative to the root of the project, pointing to the file that contains the exported data. This should be compressed (typically something like export.tar.gz) string representing the name of the environment variable that specifies the dataset to which the imported content should be added. This is not the name of the dataset, but the name of the environment variable. deployGraphql: (boolean) set to true to ensure that Visual Editor deploys Sanity GraphQL API when creating the site. deployStudio: (boolean) set to true to ensure that Visual Editor deploys Sanity Studio when creating the site. string representing the name of the environment variable that contains the Sanity project ID. This is not the project ID itself, but the name of the environment variable. to the studio directory, relative to the root of the project. string representing the name of the environment variable that contains the Sanity API access token. This is not the token itself, but the name of the environment variable. to sanity. // stackbit.config.jsexport default { contentSources: [ new SanityContentSource({ , (__dirname, \"studio\"), studioUrl: \"\", , , || \"production\" }) ], mapModels: ({ models }) => { // page definitions and model decorations ... }, import: { contentFile: \"sanity-export/export.tar.gz\", datasetEnvVar: \"SANITY_DATASET\", , , projectIdEnvVar: \"SANITY_PROJECT_ID\", sanityStudioPath: \"studio\", tokenEnvVar: \"SANITY_ACCESS_TOKEN\", type: \"sanity\" } // other properties ...}; Last 25, 2025 PreviousHygraphNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";import { SanityContentSource } from \"@stackbit/cms-sanity\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  ssgName: \"nextjs\",  nodeVersion: \"16\",  contentSources: [    new SanityContentSource({      rootPath: __dirname,      studioPath: path.join(__dirname, \"studio\"),      studioUrl: \"https://project.sanity.studio\",      projectId: process.env.SANITY_PROJECT_ID!,      token: process.env.SANITY_ACCESS_TOKEN!,      dataset: process.env.SANITY_DATASET || \"production\"    })  ],  mapModels: ({ models }) => {    return models.map(model => {      if (model.name === \"page\") {        return { ...model, type: \"page\", urlPath: \"/{slug}\" };      }      return model;    });  }});\n```\n\nExample:\n```text\nnpm install -D @stackbit/types @stackbit/cms-sanity\n```\n\nExample:\n```text\nimport { SanityContentSource } from \"@stackbit/cms-sanity\";\nnew SanityContentSource({  rootPath: \"...\",  studioPath: \"...\",  studioUrl: \"...\",  projectId: \"...\",  token: \"...\",  dataset: \"...\",  studioInstallCommand: \"...\"});\n```\n\nExample:\n```text\n# .envSANITY_PROJECT_ID=\"...\"SANITY_ACCESS_TOKEN=\"...\"SANITY_DATASET=\"...\"\n```\n\nExample:\n```text\nnew SanityContentSource({  studioInstallCommand: \"...\"  // ...});\n```\n\nExample:\n```text\nnew SanityContentSource({  studioInstallCommand: `echo 'skipping install'`  // ...});\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  contentSources: [    new SanityContentSource({      rootPath: __dirname,      studioPath: path.join(__dirname, \"studio\"),      studioUrl: \"\",      projectId: process.env.SANITY_PROJECT_ID,      token: process.env.SANITY_ACCESS_TOKEN,      dataset: process.env.SANITY_DATASET || \"production\"    })  ],  mapModels: ({ models }) => {    // page definitions and model decorations ...  },  import: {    contentFile: \"sanity-export/export.tar.gz\",    datasetEnvVar: \"SANITY_DATASET\",    deployGraphql: false,    deployStudio: true,    projectIdEnvVar: \"SANITY_PROJECT_ID\",    sanityStudioPath: \"studio\",    tokenEnvVar: \"SANITY_ACCESS_TOKEN\",    type: \"sanity\"  }  // other properties ...};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.447Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":7,"totalLines":40,"estimatedTokens":2644}}256{"id":"doc-page_editor_netlify_docs-e56e9e91","source":"documentation","title":"Page editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/visual-editing/page-editor/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Enable the page editor Automatic document resolution Enable page editing manually Highlight active elements On this page Overview Enable the page editor Automatic document resolution Enable page editing manually Highlight active elements For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", contentSources: [ // ... ], modelExtensions: [{ name: \"page\", type: \"page\", urlPath: \"/{slug}\" }]}); Enable page editing manuallySection titled “Enable page editing manually” For cases where the there isn't a direct one-to-one mapping between document objects and URL paths, pages can be enabled by setting the document property when manually building the siteMap. // stackbit.config.tsimport { defineStackbitConfig, getLocalizedFieldForLocale, SiteMapEntry} from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", siteMap: ({ documents, models }) => { const pageModels = models.filter(m => m.type === \"page\").map(m => m.name); return documents ) .filter(Boolean) as SiteMapEntry[]; }}); Highlight active elementsSection titled “Highlight active elements” Visual Editor highlights elements in the preview that are actively focused in the page editor. Enabling this requires annotating pages and components. Last 23, 2025 PreviousInline editorNextSidebar buttons Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  contentSources: [    // ...  ],  modelExtensions: [{ name: \"page\", type: \"page\", urlPath: \"/{slug}\" }]});\n```\n\nExample:\n```text\n// stackbit.config.tsimport {  defineStackbitConfig,  getLocalizedFieldForLocale,  SiteMapEntry} from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  siteMap: ({ documents, models }) => {    const pageModels = models.filter(m => m.type === \"page\").map(m => m.name);    return documents      .filter(d => pageModels.includes(d.modelName))      .map(document => {        // ...        return {          document          // ...        };      })      .filter(Boolean) as SiteMapEntry[];  }});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.448Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":15,"estimatedTokens":1194}}257{"id":"doc-previewing_with_visual_editor_netlify_docs-2225c255","source":"documentation","title":"Previewing with Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/cloud-setup/previewing/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Preview Server Adjust preview viewport Custom viewport sizes Share preview On this page Overview Preview Server Adjust preview viewport Custom viewport sizes Share preview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Cloud Setup / Previewing with Visual Editor Copy page View as Markdown Copy as Markdown View as Markdown See and share changes in the visual editor before publishing to production. With the visual editor, you’re always in a preview state. There are ways to further customize that state and invite others to view. Deploy Previews in Netlify's Visual Editor Deploy Previews are accessible through the Visual Editor dashboard. Reviewers, Internal Builders, and Publishers now have simplified access to preview, review, and collaborate on site changes.To preview, go to your project in Netlify's Visual Editor and select \"More options\" (represented by three vertical dots). Select the preview to review your site.Any branch with a corresponding Deploy Preview will be included in the list, including Visual Editor working branch. Preview ServerSection titled “Preview Server” In the visual editor, the preview is an iframe that points to your site running in development mode. Learn more about this based on whether you are working in local development mode or not. Adjust preview viewportSection titled “Adjust preview viewport” Adjust the preview mode using the desktop and eye icons in the top toolbar. The desktop icon adjusts the size of the viewport within the preview frame. The eye icon enables preview mode, which hides Visual Editor editing controls. Click the edit icon (top left) to return to edit mode. Custom viewport sizesSection titled “Custom viewport sizes” Viewport sizes can be customized by providing the viewports configuration property. export default defineStackbitConfig({ viewports: [ { label: \"iPhone 14\", size: { , } }, { label: \"iPhone 14 Plus\", size: { , } } ]}); Tip The actual size will be shown whether or not viewports is defined. Share previewSection titled “Share preview” All users on the project can copy a link to the preview by opening the project's ellipsis menu in the Visual Editor dashboard. Deploy Preview URLs and branch preview URLs are open to anyone with the link, unless password protection or team login are set up. Note that people without access to the Netlify web app will not be able to make content changes on the site through the Visual Editor unless they are also part of the team account. To add people to your Netlify account, go to Members and select Add members. Last 15, 2025 PreviousImportNextPublishing Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nexport default defineStackbitConfig({  viewports: [    {      label: \"iPhone 14\",      size: { width: 390, height: 844 }    },    {      label: \"iPhone 14 Plus\",      size: { width: 428, height: 926 }    }  ]});\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.449Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":1375}}258{"id":"doc-use_git_cms_with_visual_editor_netlify_docs-b0cb0206","source":"documentation","title":"Use Git CMS with Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/content-sources/git/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Example configuration Prerequisites Options assetsConfig contentDirs models rootPath Annotations Limitations On this page Overview Example configuration Prerequisites Options assetsConfig contentDirs models rootPath Annotations Limitations For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\";import { GitContentSource } from \"@stackbit/cms-git\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", contentSources: [ new GitContentSource({ , contentDirs: [\"content\"], models: [ { name: \"Page\", type: \"page\", urlPath: \"/{slug}\", filePath: \"content/pages/{slug}.json\", fields: [{ name: \"title\", type: \"string\", }] } ], assetsConfig: { referenceType: \"static\", staticDir: \"public\", uploadDir: \"images\", publicPath: \"/\" } }) ]}); PrerequisitesSection titled “Prerequisites” The only thing required to work with Git CMS is to install the development dependencies. Terminal windownpm install -D @stackbit/types @stackbit/cms-git OptionsSection titled “Options” Git CMS is unique in that all content modeling must be done within content source configuration. The options to define the schema are documented below. Note that when Visual Editor reads and writes content to your remote repository, it uses the repository URL and branch you define in Git when you configure your project. These values aren’t used in local development because Visual Editor writes content changes to disk when running locally. assetsConfigSection titled “assetsConfig” Defines where local site assets are stored in your project and how other content references these assets. Required? No. : (required) specifies how content files reference asset files. , relative. uploadDir: (required) path inside assetsDir in which to store uploaded assets, relative to either staticDir (for static assets) or assetsDir (for relative assets). Additional properties for static : directory path relative to the project root in which the site framework copies files to the directory that get deployed. from which the static files are publicly available. Additional properties for relative : path to the directory containing all the assets to your project, relative to the project root. Static assetsSection titled “Static assets” Here's an example configuration for this object using static assets from a public/images directory. // stackbit.config.tsexport default defineStackbitConfig({ contentSources: [ new GitContentSource({ assetsConfig: { referenceType: \"static\", staticDir: \"public\", uploadDir: \"images\", publicPath: \"/\" } // ... }) ]}); All assets must be placed under the directory set in staticDir, either directly or in subdirectories. They cannot be colocated with page content or source code. The value is always relative to the root of the project. When the build is run, assets are served from the URL path set by publicPath. The full URLs are constructed as {publicPath}/{file path under staticDir}. With the example configuration above, an image file named public/images/image.png in your repository will be served from the URL /images/image.png. Images uploaded by editors would be saved in {staticDir}/{uploadDir}, or in the above case: {root}/public/images. Relative assetsSection titled “Relative assets” When asset files are colocated with content, use relative references. // stackbit.config.tsexport default defineStackbitConfig({ contentSources: [ new GitContentSource({ assetsConfig: { referenceType: \"relative\", assetsDir: \"src\", uploadDir: \"images\" } // ... }) ]}); assetsDir can include files of different types. However, only files with specific extensions will be treated as assets (png, jpg, jpeg, gif, svg, ico, etc.). Images uploaded by editors would be saved in {assetsDir}/{uploadDir}, or in the above case: {root}/src/images. contentDirsSection titled “contentDirs” Defines directories in which to look for content. Each document is mapped to a model using the value of the type property. Required? Yes. Allowed string representing a directory path, relative to the root of the project. // stackbit.config.tsexport default defineStackbitConfig({ contentSources: [ new GitContentSource({ contentDirs: [\"content\"] // ... }) ]}); modelsSection titled “models” This is your schema definition for all file-based content. Required? Yes. Allowed array of model definitions // stackbit.config.tsexport default defineStackbitConfig({ contentSources: [ new GitContentSource({ models: [ { name: \"Page\", type: \"page\", urlPath: \"/{slug}\", filePath: \"content/pages/{slug}.json\", fields: [{ name: \"title\", type: \"string\", }] } // ... ] // ... }) ]}); Model Properties Each defined model can be configured with a number of properties. These are detailed further in a separate document. Access the reference rootPathSection titled “rootPath” Absolute path to the root of your project. This is used to build relative paths for other configuration properties. Required? Yes. Allowed string representing the absolute path to the project root. // stackbit.config.tsexport default defineStackbitConfig({ contentSources: [ new GitContentSource({ // ... }) ]}); AnnotationsSection titled “Annotations” When specifying object ID for annotations, most content sources will have an obvious ID value. For Git CMS, this value is the path to the source file, relative to the root of the project, and including the file extension. For example, say a home page is located at content/pages/index.json. .└── content/ └── pages/ └── index.json The ID value would be content/pages/index.json. <div data-sb-object-id=\"content/pages/index.json\">...</div> LimitationsSection titled “Limitations” “Created” and “Modified” columns aren’t available for Git CMS. Git CMS doesn’t provide accurate metadata for “Created” and “Modified” dates by default since data is only read from your working branch. These columns are therefore not available in the content editor when you use Git CMS. Last 14, 2025 PreviousDatoCMSNextHygraph Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";import { GitContentSource } from \"@stackbit/cms-git\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  contentSources: [    new GitContentSource({      rootPath: __dirname,      contentDirs: [\"content\"],      models: [        {          name: \"Page\",          type: \"page\",          urlPath: \"/{slug}\",          filePath: \"content/pages/{slug}.json\",          fields: [{ name: \"title\", type: \"string\", required: true }]        }      ],      assetsConfig: {        referenceType: \"static\",        staticDir: \"public\",        uploadDir: \"images\",        publicPath: \"/\"      }    })  ]});\n```\n\nExample:\n```text\nnpm install -D @stackbit/types @stackbit/cms-git\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  contentSources: [    new GitContentSource({      assetsConfig: {        referenceType: \"static\",        staticDir: \"public\",        uploadDir: \"images\",        publicPath: \"/\"      }      // ...    })  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  contentSources: [    new GitContentSource({      assetsConfig: {        referenceType: \"relative\",        assetsDir: \"src\",        uploadDir: \"images\"      }      // ...    })  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  contentSources: [    new GitContentSource({      contentDirs: [\"content\"]      // ...    })  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  contentSources: [    new GitContentSource({      models: [        {          name: \"Page\",          type: \"page\",          urlPath: \"/{slug}\",          filePath: \"content/pages/{slug}.json\",          fields: [{ name: \"title\", type: \"string\", required: true }]        }        // ...      ]      // ...    })  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsexport default defineStackbitConfig({  contentSources: [    new GitContentSource({      rootPath: __dirname      // ...    })  ]});\n```\n\nExample:\n```text\n.└── content/    └── pages/        └── index.json\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.450Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":8,"totalLines":44,"estimatedTokens":2660}}259{"id":"doc-publishing_with_visual_editor_netlify_docs-cd009d64","source":"documentation","title":"Publishing with Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/cloud-setup/publishing/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Publishing workflow Publish content changes to production Content changes with Git CMS Publishing granularity Global (data) objects Publish individual objects Publish multiple pages Scheduled publishing Schedule content to be published View publishing schedule Scheduled publishing granularity Edit publishing schedule Cancel publishing schedule Group publishing schedules Set timezone User visibility See my changes On this page Overview Publishing workflow Publish content changes to production Content changes with Git CMS Publishing granularity Global (data) objects Publish individual objects Publish multiple pages Scheduled publishing Schedule content to be published View publishing schedule Scheduled publishing granularity Edit publishing schedule Cancel publishing schedule Group publishing schedules Set timezone User visibility See my changes For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Cloud Setup / Publishing with Visual Editor Copy page View as Markdown Copy as Markdown View as Markdown Customize the visual editor to work with your existing publishing workflows. Note The current version of this feature is available to sites using content source interface. Contact us if you wish to enable this feature for your site. To optimize publishing for your needs, you can scope how and when to publish changes. Publishing workflowSection titled “Publishing workflow” The publish modal changes context based on the current page being viewed in the preview and sitemap. When there are changes made to the current page, objects referenced within the page, or global objects, the Publish button is activated and lists all changes. Publish content changes to productionSection titled “Publish content changes to production” By default, publishing from the visual editor will publish content changes to the content source, but it won't automatically trigger a production deploy. In order to do so, a build hook needs to be configured. An exception to this is if the content is stored in local files (Git CMS), in which case the behavior will be inferred from the site's configuration in Netlify to build and deploy the site. Content changes with Git CMSSection titled “Content changes with Git CMS” When working with files as the content source (Git CMS), content is always merged by default from the working branch to the content publishing branch. This behavior can be configured to open a pull request instead in the Content publishing section of the visual editor settings. When content changes are configured to open a pull request, the publish dialog with the pending changes will be updated after the pull request is merged. To navigate to your site's visual editor settings from the visual editor, select Visual editor settings from the options menu. Merge conflictsSection titled “Merge conflicts” When publishing content changes with Git CMS, merge conflicts prompt an error message and cancel the publishing action. Pending changesSection titled “Pending changes” If new changes are made while publishing, the list shown in the publish dialog won't be updated until the current publish action is complete. Publishing granularitySection titled “Publishing granularity” Content can be published per page or per object. The publish modal changes context based on the current page being viewed in the preview and sitemap. Global (data) objectsSection titled “Global (data) objects” Changes to global objects will appear in all pages. They only need to be published once to affect the pages on which they are used. Publish individual objectsSection titled “Publish individual objects” Individual objects can be selected and published without publishing the page. For example, you can publish changes to an author object without publishing changes to a blog post. Objects can also be published from the content tab. Statuses are noted here to give a visual representation between new and changed items. Those without labels are assumed to be changed. Read more about document status labels. Publish multiple pagesSection titled “Publish multiple pages” Per page is the most you can publish at one time. However, it is possible to implement bulk publish with Bulk Document Actions. Scheduled publishingSection titled “Scheduled publishing” In order to use scheduled publishing ensure that you are using the most recent version of your content source package. Scheduled publishing is supported for Contentful and Sanity content sources, enabling content editors to defer publishing events to a future date and time in a specific timezone. Publishing schedules are handled on a per-document (content entry) basis. Documents are published with all of their pending changes, no matter if those were made before or after the content was scheduled to be published. If content validations are not met, the content will still be published. Review all the content validations carefully before scheduling content for publishing. Schedules cannot be edited, but can be deleted and recreated with different settings. Only publish events can be scheduled. Unpublishing content must occur in real-time. See below for further details. Schedule content to be publishedSection titled “Schedule content to be published” Scheduled publishing is handled through the publishing modal, as with the typical publishing workflow. Open the publish modal and select the documents to schedule. Then click on the schedule icon next to the publish button. Choose a date and, time, and timezone. Finally, click on Set Schedule and wait for the confirmation message. View publishing scheduleSection titled “View publishing schedule” Upcoming publish events can be viewed on individual documents in the publishing modal. Hover over the schedule icon to prompt a tooltip with the schedule for that document. The schedule is also available on individual documents in the content editor. Scheduled publishing granularitySection titled “Scheduled publishing granularity” As with the typical publishing workflow, a single document or a select set of documents can be scheduled together. This can be done by selecting a specific document in the publishing modal, or when editing the document in the content editor. Edit publishing scheduleSection titled “Edit publishing schedule” Once the date for a content entry to be published in the future is set, it can't be changed. Instead, cancel the current schedule and create a new schedule. Cancel publishing scheduleSection titled “Cancel publishing schedule” Canceling schedules is handled in the content editor. Click the schedule icon and then the delete icon to cancel a specific schedule event. Group publishing schedulesSection titled “Group publishing schedules” Each document's publishing schedule is managed individually, and cannot be managed as a group. To add a single document to be published to an existing schedule, choose the same day and time (in the same timezone) as the existing schedule. To see all the content entries that are scheduled to be published, navigate to ‘Content’ and filter for Publish to see all content entries scheduled for publishing Scheduled Date to see all content entries scheduled for publishing at a certain date Set timezoneSection titled “Set timezone” By default, the timezone shown in the scheduling modal will be your local time, regardless of how the modal was triggered. Choosing a different timezone for a schedule will be translated to your local timezone when viewing a schedule. User visibilitySection titled “User visibility” Avatars representing users who have many any changes on the current page are shown to the left of the Publish trigger (1). Within the publish dialog, avatars are attached to each individual object (2). See my changesSection titled “See my changes” You can optionally choose to select only the changes you've made to the current page and objects on that page. Last 25, 2025 PreviousPreviewingNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.451Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2649}}260{"id":"doc-use_contentstack_with_visual_editor_netlify_docs-abc3960d","source":"documentation","title":"Use Contentstack with Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/content-sources/contentstack/","text":"Example:\n```text\n// stackbit.config.tsimport process from \"process\";import path from \"path\";import {  defineStackbitConfig,  DocumentStringLikeFieldNonLocalized,  SiteMapEntry} from \"@stackbit/types\";import { ContentstackContentSource } from \"@stackbit/cms-contentstack\";\nrequire(\"dotenv\").config({ path: path.resolve(process.cwd(), \".env\") });\nexport default defineStackbitConfig({  stackbitVersion: \"~0.5.0\",  ssgName: \"nextjs\",  nodeVersion: \"18\",  styleObjectModelName: \"siteConfig\",  contentSources: [    new ContentstackContentSource({      apiKey: process.env.CONTENTSTACK_API_KEY!,      managementToken: process.env.CONTENTSTACK_MANAGEMENT_TOKEN!,      authtoken: process.env.CONTENTSTACK_AUTHTOKEN,      branch: process.env.CONTENTSTACK_BRANCH!,      publishEnvironmentName: \"production\",      skipFetchOnStartIfCache: true    })  ],  sitemap: ({ documents }) => {    return documents.reduce((sitemap: SiteMapEntry[], document) => {      if (\"url\" in document.fields) {        const titleValue = (document.fields.title as          | DocumentStringLikeFieldNonLocalized          | undefined)?.value;        const urlValue = (document.fields          .url as DocumentStringLikeFieldNonLocalized).value;        sitemap.push({          label: titleValue,          urlPath: urlValue,          document: document        });      }      return sitemap;    }, []);  }});\n```\n\nExample:\n```text\nnpm install -D @stackbit/types @stackbit/cms-contentstack\n```\n\nExample:\n```text\nimport { ContentstackContentSource } from \"@stackbit/cms-contentstack\";\nnew ContentstackContentSource({  apiKey: \"...\",  managementToken: \"...\",  authtoken: \"...\",  branch: \"...\",  publishEnvironmentName: \"...\",  skipFetchOnStartIfCache: \"...\"});\n```\n\nExample:\n```text\n# .envCONTENTSTACK_API_KEY=\"...\"CONTENTSTACK_MANAGEMENT_TOKEN=\"...\"CONTENTSTACK_AUTHTOKEN=\"...\"CONTENTSTACK_BRANCH=\"...\"\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.452Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":4,"totalLines":24,"estimatedTokens":471}}261{"id":"doc-use_hygraph_with_visual_editor_netlify_docs-8b3220cc","source":"documentation","title":"Use Hygraph with Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/content-sources/hygraph/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Example configuration Prerequisites Usage Options Store sensitive values Local development Install ngrok Start ngrok agent Start stackbit dev Content type inference Use multiple projects or environments On this page Overview Example configuration Prerequisites Usage Options Store sensitive values Local development Install ngrok Start ngrok agent Start stackbit dev Content type inference Use multiple projects or environments For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from '@stackbit/types';import { HygraphContentSource } from \"@stackbit/cms-hygraph\"; // Use defineStackbitConfig to allow Typescript checksexport default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", ssgName: \"nextjs\", nodeVersion: \"20\", // is required for HygraphContentSource // as it has ESM only dependencies. , contentSources: [ new HygraphContentSource({ // Hygraph project ID. // Can be found in project settings screen in Hygraph Studio. !, // Hygraph project region. // Can be found in project settings screen in Hygraph Studio. // !, // Hygraph project environment. !, // Hygraph content API endpoint URL. // Must match the configured region. // Example: // https://{REGION}.cdn.hygraph.com/content/{HASH}/{ENVIRONMENT} !, // Hygraph management API endpoint URL. // Must match the configured region. // Example: // https://management-{REGION}.hygraph.com/graphql !, // The management token. ! }) ], // This marks the Hygraph's \"Page\" model as a \"page\" models in the Visual-Editor modelExtensions: [ { name: 'Page', type: 'page' } ], // The sitemap maps between the \"Page\" entries and their url paths // allowing easy navigation between site pages in the Visual-Editor. sitemap: ({ documents }): SiteMapEntry[] => { // The \"documents\" include all the entries from Hygraph. return documents.reduce( (sitemap: SiteMapEntry[], document): SiteMapEntry[] => { // Filter documents that match \"Page\" model name // This is the model ID in Hygraph. if (!['Page'].includes(document.modelName)) { return sitemap; } const slugField = document.fields.slug as DocumentStringLikeFieldNonLocalized; if (!slugField || !slugField.value) { return sitemap; } sitemap.push({ urlPath: `/${slugField.value.replace(/^\\/|\\/$/g, '')}`, }); return sitemap; } ); }}); Notice the is being loaded from the @stackbit/cms-hygraph which must be installed first as a dev-dependency. This package is not needed in your production site. Hygraph is being configured using local environment variables. Visual Editor will automatically load a from '@stackbit/types';import { HygraphContentSource } from \"@stackbit/cms-hygraph\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", // ... other config options , contentSources: [ new HygraphContentSource({ projectId: \"...\", region: \"...\", environment: \"...\", contentApi: \"...\", managementApi: \"...\", managementToken: \"...\", }) ]}); OptionsSection titled “Options” The following are all required options, unless : The Hygraph project ID, found in the project settings screen in Hygraph Studio. Hygraph project region, found in the project settings screen in Hygraph Studio. Hygraph project environment. (Default: master) Hygraph content API endpoint URL. Must match the configured region. ://{REGION}.cdn.hygraph.com/content/{HASH}/{ENVIRONMENT} Hygraph Management API endpoint URL. Must match the configured region. ://management-{REGION}.hygraph.com/graphql management token. The management token must have the following API stage for content Content permissions enabled for all models, all stages, and all locales Management API - The management API must include 21 existing environments Read existing models Read existing components Read existing fields Read existing enumerations Read existing entries Read remote sources Read stages Read locales Can see schema view Update existing non-published entries Update published entries Publish non-published entries Create new entries Delete existing entries Create new webhooks Read existing webhooks Update existing webhooks Delete an existing webhook Can see Role & Permissions Settings Can read content permissions (Optional for debugging) Can use the playground componentQueryNestingLevel (Optional): Defines the nesting level in GraphQL queries for cyclic components. This helps reduce query complexity for large content schemas. (Default: 3) entries fetched by HygraphContentSource. The entriesFilter is applied as the “where” argument in the GraphQL query used to fetch entries. Since each Hygraph model has different “where” properties, entriesFilter is an object mapping a model’s API ID to its filter value. Warning Ensure that filtered-out entries are not referenced by entries that pass the filter. Otherwise, the Visual Editor will display “Field is missing or inaccessible” errors where a reference field points to a filtered-out entry. If your content architecture does not allow for this, consider using the permissionsForDocument method in stackbit.config.ts. The entriesFilter applies only to the “where” clause, so it cannot be used to filter by locales or stages. following filter entries where enumField is “foo” and title contains “homepage.” Post entries where author.name is “john.” entriesFilter: { Page: '{ , title_contains: \"homepage\" }', Post: '{ author: { name: \"john\" } }'} For more info visit Hygraph Filtering Documentation debugGraphQLQueries (Optional): Logs GraphQL queries, including complexity details for entry queries. To enable “debug” level logs, run stackbit dev with --log-level=debug windowstackbit dev --log-level=debug Learn more about query complexity. splitEntryRequestsPerModel (Optional): Splits GraphQL entry requests by model to reduce query complexity when the content schema is too complex for querying multiple models in a single request. When this flag is set to false (the default), a single GraphQL query includes all models, and as pages of entries are fetched, the number of models will { Pages(stage: DRAFT, , ) { ...PageFragment } Posts(stage: DRAFT, , ) { ...PostFragment } Authors(stage: DRAFT, , ) { ...AuthorFragment }} When this flag is set to true, each GraphQL query will contain a single model, and entries will be fetched serially, one model at a { Pages(stage: DRAFT, , ) { ...PageFragment }} Request { Posts(stage: DRAFT, , ) { ...PageFragment }} Store sensitive valuesSection titled “Store sensitive values” Sensitive values can be stored in a from \"@stackbit/cms-hygraph\"; export default { contentSources: [ new HygraphContentSource({ !, !, !, !, !, ! }), new HygraphContentSource({ !, !, !, !, !, ! }) ] // ...}; Last 14, 2025 PreviousGitNextSanity Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport {  defineStackbitConfig,  SiteMapEntry,  DocumentStringLikeFieldNonLocalized} from '@stackbit/types';import { HygraphContentSource } from \"@stackbit/cms-hygraph\";\n// Use defineStackbitConfig to allow Typescript checksexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  ssgName: \"nextjs\",  nodeVersion: \"20\",\n  // useESM: true is required for HygraphContentSource  // as it has ESM only dependencies.  useESM: true,\n  contentSources: [    new HygraphContentSource({      // Hygraph project ID.      // Can be found in project settings screen in Hygraph Studio.      projectId: process.env.HYGRAPH_PROJECT_ID!,\n      // Hygraph project region.      // Can be found in project settings screen in Hygraph Studio.      // Example: US-WEST-2      region: process.env.HYGRAPH_REGION!,\n      // Hygraph project environment. Default: master      environment: process.env.HYGRAPH_ENVIRONMENT!,\n      // Hygraph content API endpoint URL.      // Must match the configured region.      // Example:      // https://{REGION}.cdn.hygraph.com/content/{HASH}/{ENVIRONMENT}      contentApi: process.env.HYGRAPH_ENDPOINT!,\n      // Hygraph management API endpoint URL.      // Must match the configured region.      // Example:      // https://management-{REGION}.hygraph.com/graphql      managementApi: process.env.HYGRAPH_MANAGEMENT_API!,\n      // The management token.      managementToken: process.env.HYGRAPH_MANAGEMENT_TOKEN!    })  ],\n  // This marks the Hygraph's \"Page\" model as a \"page\" models in the Visual-Editor  modelExtensions: [    { name: 'Page', type: 'page' }  ],\n  // The sitemap maps between the \"Page\" entries and their url paths  // allowing easy navigation between site pages in the Visual-Editor.  sitemap: ({ documents }): SiteMapEntry[] => {    // The \"documents\" include all the entries from Hygraph.    return documents.reduce(      (sitemap: SiteMapEntry[], document): SiteMapEntry[] => {        // Filter documents that match \"Page\" model name        // This is the model ID in Hygraph.        if (!['Page'].includes(document.modelName)) {          return sitemap;        }        const slugField = document.fields.slug as DocumentStringLikeFieldNonLocalized;        if (!slugField || !slugField.value) {          return sitemap;        }        sitemap.push({          urlPath: `/${slugField.value.replace(/^\\/|\\/$/g, '')}`,          document: document        });        return sitemap;      }    );  }});\n```\n\nExample:\n```text\nnpm install -D @stackbit/types @stackbit/cms-hygraph\n```\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from '@stackbit/types';import { HygraphContentSource } from \"@stackbit/cms-hygraph\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  // ... other config options  useESM: true,  contentSources: [    new HygraphContentSource({      projectId: \"...\",      region: \"...\",      environment: \"...\",      contentApi: \"...\",      managementApi: \"...\",      managementToken: \"...\",    })  ]});\n```\n\nExample:\n```text\nhttps://{REGION}.cdn.hygraph.com/content/{HASH}/{ENVIRONMENT}\n```\n\nExample:\n```text\nhttps://management-{REGION}.hygraph.com/graphql\n```\n\nExample:\n```text\nentriesFilter: {   Page: '{ enumField: foo, title_contains: \"homepage\" }',   Post: '{ author: { name: \"john\" } }'}\n```\n\nExample:\n```text\nstackbit dev --log-level=debug\n```\n\nExample:\n```text\nquery {  Pages(stage: DRAFT, first: 100, skip: 0) {    ...PageFragment  }  Posts(stage: DRAFT, first: 100, skip: 0) {    ...PostFragment  }  Authors(stage: DRAFT, first: 100, skip: 0) {    ...AuthorFragment  }}\n```\n\nExample:\n```text\nquery {  Pages(stage: DRAFT, first: 100, skip: 0) {    ...PageFragment  }}\n```\n\nExample:\n```text\nquery {  Posts(stage: DRAFT, first: 100, skip: 0) {    ...PageFragment  }}\n```\n\nExample:\n```text\n# .envHYGRAPH_PROJECT_ID=HYGRAPH_REGION=HYGRAPH_ENVIRONMENT=masterHYGRAPH_ENDPOINT=HYGRAPH_MANAGEMENT_API=HYGRAPH_MANAGEMENT_TOKEN=\n```\n\nExample:\n```text\nngrok http 8090\n```\n\nExample:\n```text\nSession Status    online...Forwarding        http://xyz.ngrok.app -> http://localhost:8090Forwarding        https://xyz.ngrok.app -> http://localhost:8090\n```\n\nExample:\n```text\nnpm i -g @stackbit/cli\n```\n\nExample:\n```text\nstackbit dev --csi-webhook-url=https://<REPLACE>.ngrok.app/_stackbit/onWebhook\n```\n\nExample:\n```text\n// stackbit.config.tsimport { HygraphContentSource } from \"@stackbit/cms-hygraph\";\nexport default {  contentSources: [    new HygraphContentSource({      projectId: process.env.HYGRAPH_PROJECT_ID_01!,      region: process.env.HYGRAPH_REGION_01!,      environment: process.env.HYGRAPH_ENVIRONMENT_01!,      contentApi: process.env.HYGRAPH_ENDPOINT_01!,      managementApi: process.env.HYGRAPH_MANAGEMENT_API_01!,      managementToken: process.env.HYGRAPH_MANAGEMENT_TOKEN_01!    }),    new HygraphContentSource({      projectId: process.env.HYGRAPH_PROJECT_ID_02!,      region: process.env.HYGRAPH_REGION_02!,      environment: process.env.HYGRAPH_ENVIRONMENT_02!,      contentApi: process.env.HYGRAPH_ENDPOINT_02!,      managementApi: process.env.HYGRAPH_MANAGEMENT_API_02!,      managementToken: process.env.HYGRAPH_MANAGEMENT_TOKEN_02!    })  ]  // ...};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.453Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":16,"totalLines":95,"estimatedTokens":3593}}262{"id":"doc-use_visual_editor_with_gatsby_netlify_docs-9b7ca655","source":"documentation","title":"Use Visual Editor with Gatsby | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/frameworks/gatsby/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Visual Editor for a Gatsby project Requirements Specify the Node version Content reload Run Visual Editor locally On this page Overview Configure Visual Editor for a Gatsby project Requirements Specify the Node version Content reload Run Visual Editor locally For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", ssgName: \"gatsby\", ssgVersion: \"5\", nodeVersion: \"18\", contentSources: [ // ... ]}); // stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", ssgName: \"gatsby\", ssgVersion: \"5\", nodeVersion: \"16\", contentSources: [ // ... ]}); RequirementsSection titled “Requirements” There are a few unique conditions when using a Gatsby project with Visual Gatsby versions have strict Node.js requirements, which must be passed on to Visual Editor. Content reloading must be handled manually. Running the development server requires specifying the host when using with Visual Editor. See the sections below for more information. Specify the Node versionSection titled “Specify the Node version” Newer versions of Gatsby have strict Node.js version requirements. For example, Gatsby 5.x requires Node 18+. When working locally, ensure that you're running a compatible version of Node.js. If you're not working locally, this can be configured using nodeVersion. Content reloadSection titled “Content reload” Gatsby caches content after fetching it from source plugins, and thus must be instructed to refresh when content is changed. This requires the the refresh endpoint by setting the ENABLE_GATSBY_REFRESH_ENDPOINT environment variable to true. This can also be done inline when starting stackbit dev (see below). Leverage the stackbitObjectsChanged dispatched event to trigger a content refresh, being sure to override Visual Editor’s default behavior by calling preventDefault() on the event object. Here is a basic example that could be added to a page or app component. (Note that you may want to add environment checks in these listeners.) import React, { useEffect } from \"react\"; export default function ComposablePageTemplate({ data }) { useEffect(() => { const handleContentChange = async event => { event.preventDefault(); await fetch(\"/__refresh\", { method: \"POST\" }); }; window.addEventListener(\"stackbitObjectsChanged\", handleContentChange); return () => { window.removeEventListener(\"stackbitObjectsChanged\", handleContentChange); }; }, []); // ...} Run Visual Editor locallySection titled “Run Visual Editor locally” When using Visual Editor in local development with a Gatsby project, you must specify the host as 127.0.0.1 when starting your server. Terminal windownpm run develop -- --host 127.0.0.1 Note Notice the extra --, which passes on the host option to the gatsby command. You may also wish to enable the refresh endpoint (noted above) inline with the command. Terminal windowENABLE_GATSBY_REFRESH_ENDPOINT=true npm run develop -- --host 127.0.0.1 Last 14, 2025 PreviousEleventyNextHydrogen Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  ssgName: \"gatsby\",  ssgVersion: \"5\",  nodeVersion: \"18\",  contentSources: [    // ...  ]});\n```\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  ssgName: \"gatsby\",  ssgVersion: \"5\",  nodeVersion: \"16\",  contentSources: [    // ...  ]});\n```\n\nExample:\n```text\nimport React, { useEffect } from \"react\";\nexport default function ComposablePageTemplate({ data }) {  useEffect(() => {    const handleContentChange = async event => {      event.preventDefault();      await fetch(\"/__refresh\", { method: \"POST\" });    };\n    window.addEventListener(\"stackbitObjectsChanged\", handleContentChange);\n    return () => {      window.removeEventListener(\"stackbitObjectsChanged\", handleContentChange);    };  }, []);\n  // ...}\n```\n\nExample:\n```text\nnpm run develop -- --host 127.0.0.1\n```\n\nExample:\n```text\nENABLE_GATSBY_REFRESH_ENDPOINT=true npm run develop -- --host 127.0.0.1\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.454Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":5,"totalLines":34,"estimatedTokens":1706}}263{"id":"doc-use_contentful_with_visual_editor_netlify_docs-09431c7d","source":"documentation","title":"Use Contentful with Visual Editor | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/content-sources/contentful/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Contentful as a content source Prerequisites Usage Content type inference Use multiple spaces or environments Handle Contentful presets Duplicate references Add models as exceptions Provision Contentful Export content from Contentful Import configuration On this page Overview Configure Contentful as a content source Prerequisites Usage Content type inference Use multiple spaces or environments Handle Contentful presets Duplicate references Add models as exceptions Provision Contentful Export content from Contentful Import configuration For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@stackbit/types\";import { ContentfulContentSource } from \"@stackbit/cms-contentful\"; export default defineStackbitConfig({ stackbitVersion: \"~0.6.0\", ssgName: \"nextjs\", nodeVersion: \"16\", contentSources: [ new ContentfulContentSource({ !, !, !, !, }) ], models: { page: { type: \"page\", urlPath: \"/{slug}\" } }}); Notice the is being loaded from the @stackbit/cms-contentful which must be installed first. This package is not needed in your production site. Contentful is being configured using local environment variables. Visual Editor will automatically load a from \"@stackbit/cms-contentful\"; new ContentfulContentSource({ spaceId: \"...\", environment: \"...\", previewToken: \"...\", accessToken: \"...\", }); OptionsSection titled “Options” The following are all required options, unless : the personal access token for your authenticated user. This is sometimes called a management token. It is not the delivery API key for your space. of the environment in which the content is stored in Contentful. preview API key for the space and environment you're using. for the space, which can be found in the URL of the space. useWebhookForContentUpdates: (optional, ) whether or not to rely on a Contentful webhook for reacting to content changes. When set to false (default), Visual Editor polls the Contentful Sync API every second for new and updated content, but still relies on webhooks for deleted entries. When set to true, Visual Editor minimizes the number of API calls and relies on webhooks for all content changes. Store sensitive valuesSection titled “Store sensitive values” Sensitive values can be stored in a from \"@stackbit/cms-contentful\"; export default { contentSources: [ new ContentfulContentSource({ , , , }), new ContentfulContentSource({ , , , }) ] // ...}; Conflicting model namesSection titled “Conflicting model names” Note that if there are conflicting model names (for example, IDs), the model that was loaded last (later in the contentSources array) will override those defined earlier. Handle Contentful presetsSection titled “Handle Contentful presets” In Contentful, all relationships among objects are references — you can't embed entries inside another entry. By default, Visual Editor uses existing references when creating new content from a preset. Consider a scenario in which a page model has two fields — components and author — both of which hold references to other entries in the CMS. If you then create a new page from a preset, Visual Editor will use the existing components and author entries. The only new content created will be the page entry. You can override this behavior using the presetReferenceBehavior setting in your configuration file. See below for examples. Note Note that preset configuration changes only apply to newly-created presets. This is because preset configurations are stored as files and Visual Editor will not adjust existing files in your repository. Duplicate referencesSection titled “Duplicate references” If you'd prefer for Visual Editor to duplicate references by default rather than using existing references, you can set that behavior in your configuration file. // stackbit.config.jsexport default { presetReferenceBehavior: \"duplicateContents\" // ...}; Add models as exceptionsSection titled “Add models as exceptions” There will likely be exceptions to that rule. Again, using the example above, you may want buttons to be duplicated, but author references to be copied. Specify exceptions to copyReferenceSection titled “Specify exceptions to copyReference” In that case, we can leave the default presetReferenceBehavior set to copyReference and set the models that should duplicate the content instead (button). // stackbit.config.jsexport default { duplicatableModels: [\"button\"] // ...}; Specify exceptions to duplicateContentsSection titled “Specify exceptions to duplicateContents” The option changes if you've overridden the default behavior. In that case, you'd use nonDuplicatableModels: // stackbit.config.jsexport default { presetReferenceBehavior: \"duplicateContents\", nonDuplicatableModels: [\"author\"] // ...}; Provision ContentfulSection titled “Provision Contentful” Note This is only relevant when creating a Visual Editor project from a template.You don't need Contentful provisioning if you have already set up a Contentful space for your project, or if you plan to manually create and configure a space. Visual Editor will handle provisioning a new Contentful space, along with the initial payload of models and content when creating a new project from a template. Export content from ContentfulSection titled “Export content from Contentful” In most cases, projects that can be provisioned with Contentful as a content source have a Contentful space as the source of truth for duplicated projects. The first step in preparing your project to be duplicated is to export the content schema and the initial site contents from your Contentful space. Be sure to configure the exports to include content types, entries, and to download assets. This will place your exported data in a new directory located wherever you ran the export command. Place this directory and its contents in your project and commit the files to Git. Import configurationSection titled “Import configuration” Once you've exported the content (and committed the data files), all that is left to do is add configuration for importing the content during the provisioning process. The following properties should be added to an import property in your Visual Editor configuration file. All properties are required and are strings, unless otherwise noted. this to the directory containing your exported content, not the path to exported assets. The contentFile contains paths relative to this directory, which Visual Editor will use to upload assets into the new space. property can be ignored if uploadAssets is set to false. to the export.json file provided by the Contentful export. string representing the name of the environment variable that contains the API delivery token that can be used to retrieve content from Contentful. This is not the token itself, but the name of the environment variable. string representing the name of the environment variable that contains the API preview token that can be used to retrieve content from Contentful. This is not the token itself, but the name of the environment variable. string representing the name of the environment variable that contains the Contentful space ID. This is not the space ID itself, but the name of the environment variable. to contentful. uploadAssets: (boolean) whether exported assets should be uploaded. This is typically true when you're base space included asset entries. // stackbit.config.jsexport default { contentSources: [ new ContentfulContentSource({ , , , }) ], models: { // page definitions and model decorations ... }, import: { type: \"contentful\", contentFile: \"contentful/export.json\", , assetsDirectory: \"contentful\", spaceIdEnvVar: \"CONTENTFUL_SPACE_ID\", deliveryTokenEnvVar: \"CONTENTFUL_DELIVERY_TOKEN\", previewTokenEnvVar: \"CONTENTFUL_PREVIEW_TOKEN\" } // other properties ...}; Last 14, 2025 PreviousOverviewNextContentstack Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.tsimport { defineStackbitConfig } from \"@stackbit/types\";import { ContentfulContentSource } from \"@stackbit/cms-contentful\";\nexport default defineStackbitConfig({  stackbitVersion: \"~0.6.0\",  ssgName: \"nextjs\",  nodeVersion: \"16\",  contentSources: [    new ContentfulContentSource({      spaceId: process.env.CONTENTFUL_SPACE_ID!,      environment: process.env.CONTENTFUL_ENVIRONMENT!,      previewToken: process.env.CONTENTFUL_PREVIEW_TOKEN!,      accessToken: process.env.CONTENTFUL_MANAGEMENT_TOKEN!,      useWebhookForContentUpdates: true    })  ],  models: {    page: { type: \"page\", urlPath: \"/{slug}\" }  }});\n```\n\nExample:\n```text\nnpm install -D @stackbit/types @stackbit/cms-contentful\n```\n\nExample:\n```text\nimport { ContentfulContentSource } from \"@stackbit/cms-contentful\";\nnew ContentfulContentSource({  spaceId: \"...\",  environment: \"...\",  previewToken: \"...\",  accessToken: \"...\",  useWebhookForContentUpdates: true});\n```\n\nExample:\n```text\n# .envCONTENTFUL_SPACE_ID=\"...\"CONTENTFUL_ENVIRONMENT=\"...\"CONTENTFUL_PREVIEW_TOKEN=\"...\"CONTENTFUL_MANAGEMENT_TOKEN=\"...\"\n```\n\nExample:\n```text\n// stackbit.config.tsimport { ContentfulContentSource } from \"@stackbit/cms-contentful\";\nexport default {  contentSources: [    new ContentfulContentSource({      spaceId: process.env.CONTENTFUL_SPACE_ID_01,      environment: process.env.CONTENTFUL_ENVIRONMENT_01,      previewToken: process.env.CONTENTFUL_PREVIEW_TOKEN_01,      accessToken: process.env.CONTENTFUL_MANAGEMENT_TOKEN_01    }),    new ContentfulContentSource({      spaceId: process.env.CONTENTFUL_SPACE_ID_02,      environment: process.env.CONTENTFUL_ENVIRONMENT_02,      previewToken: process.env.CONTENTFUL_PREVIEW_TOKEN_02,      accessToken: process.env.CONTENTFUL_MANAGEMENT_TOKEN_02    })  ]  // ...};\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  presetReferenceBehavior: \"duplicateContents\"  // ...};\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  duplicatableModels: [\"button\"]  // ...};\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  presetReferenceBehavior: \"duplicateContents\",  nonDuplicatableModels: [\"author\"]  // ...};\n```\n\nExample:\n```text\n// stackbit.config.jsexport default {  contentSources: [    new ContentfulContentSource({      spaceId: process.env.CONTENTFUL_SPACE_ID,      environment: process.env.CONTENTFUL_ENVIRONMENT,      previewToken: process.env.CONTENTFUL_PREVIEW_TOKEN,      accessToken: process.env.CONTENTFUL_MANAGEMENT_TOKEN    })  ],  models: {    // page definitions and model decorations ...  },  import: {    type: \"contentful\",    contentFile: \"contentful/export.json\",    uploadAssets: true,    assetsDirectory: \"contentful\",    spaceIdEnvVar: \"CONTENTFUL_SPACE_ID\",    deliveryTokenEnvVar: \"CONTENTFUL_DELIVERY_TOKEN\",    previewTokenEnvVar: \"CONTENTFUL_PREVIEW_TOKEN\"  }  // other properties ...};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.455Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":9,"totalLines":51,"estimatedTokens":3316}}264{"id":"doc-migrate_sites_and_projects_overview_netlify_docs-c122f321","source":"documentation","title":"Migrate sites and projects overview | Netlify Docs","url":"https://docs.netlify.com/resources/migrate/overview/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Migrate Migrate Overview Vercel to Netlify migration with AI agent On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Migrate / Migrate sites and projects overview Copy page View as Markdown Copy as Markdown View as Markdown Get support migrating your projects to Netlify. We want to help you make this transition smooth. For custom questions not covered by documentation, reach out to Netlify Support. Get answers from our Ask Netlify AI bot that answers questionsbased on our docs and official Support a conversation Last 12, 2026 PreviousSupportNextVercel to Netlify migration with AI agent Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.456Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":546}}265{"id":"doc-production_launch_checklist_netlify_docs-e9ac5779","source":"documentation","title":"Production launch checklist | Netlify Docs","url":"https://docs.netlify.com/resources/checklists/production-checklist","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Checklists Checklists Overview Production checklist Onboard to Pro checklist Security checklist Vercel to Netlify migration checklist On this page Overview Finalize names Collaborate securely and efficiently Optimize performance and ensure quality Secure your information Prepare for production traffic Communicate with customers Expect the unexpected On this page Overview Finalize names Collaborate securely and efficiently Optimize performance and ensure quality Secure your information Prepare for production traffic Communicate with customers Expect the unexpected For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Resources / Checklists / Production launch checklist Copy page View as Markdown Copy as Markdown View as Markdown After you add a new site on Netlify, but before you release it to your customers, consider the following recommendations for getting your project ready for production. Note that not all recommendations apply to all sites. Some recommendations are specific to when certain features are in use. Also, some recommended tasks can be completed once at the team level and apply to future sites you launch. While your project might not warrant taking action on all the recommendations below, we suggest that you at least review them all to consider which recommended tasks would benefit your business. Extra benefits for Pro and Enterprise teams Some of the below recommendations involve features that aren’t available on all plans. Plan requirements are indicated below. Finalize namesSection titled “Finalize names” Make any desired edits to your team name and site name before configuring anything else since some configuration values may depend on these slugs. Collaborate securely and efficientlySection titled “Collaborate securely and efficiently” Configure automatic deploy subdomains for unified branded URLs across your Deploy Previews and branch deploys. If you don’t intend for your branch deploys to be publicly searchable, use custom headers to prevent branch deploys from being indexed by search engines. Invite reviewers to get stakeholder sign-offs using collaborative Deploy Previews. Send your stakeholders the Reviewer quickstart to teach them how to share feedback. Pro and Enterprise teamsSection titled “Pro and Enterprise teams” Set up Slack notifications for team awareness of deploy activity. Protect non-production deploys from unauthorized access. Add team members with the minimum level of permissions required for their work to enable collaboration while keeping your sites secure. Add at least one other Team Owner so that while you’re away from work someone else can add team members, set user permissions, transfer projects, and more to keep things running smoothly. Enterprise teams onlySection titled “Enterprise teams only” Enable and enforce SAML single sign-on for your team (or organization if applicable). Optimize performance and ensure qualitySection titled “Optimize performance and ensure quality” Optimize your build performance and build time so your team can spend more time creating and less time waiting. Optimize the size and format of your images with Netlify Image CDN to improve the runtime performance and reliability of your site. Optimize the number of files updated for your deploys to reduce deploy times and make the most of Netlify’s CDN cache. Create cache key variations to optimize cache performance. Opt out of automatic cache invalidation for proxied responses to optimize cache performance. Add the durable cache for serverless function responses to reduce response times and variability in performance. Cache edge function responses for even faster response times. Customize edge function error handling to fail closed or open depending on your audience and content. Configure your serverless functions region to the closest to your data sources. Add unit testing and integration testing to your site builds. Plan synthetic performance testing to optimize your site performance before your initial launch and avoid performance regressions in the future. For example, set up embedded Lighthouse scores. Enable Web Analytics to monitor trends in site activity. If you want to monitor production traffic only, make Web Analytics distinguish between deployed branches. Pro and Enterprise teamsSection titled “Pro and Enterprise teams” Enable Real User Monitoring to monitor your site's usability and performance. Enterprise teams onlySection titled “Enterprise teams only” Configure Log Drains to pipe data from Netlify’s CDN to third-party monitoring services for analysis, alerting, and data persistence. Secure your informationSection titled “Secure your information” If your site is connected to a public repository, review the following settings to make sure they balance your needs for protecting security and welcoming variable policy. Deploy log visibility. Flag your most sensitive environment variable values with Secrets Controller to apply stricter security measures and perform secret scanning of your code and build output files. Import .env file variables for security and consistency between local and remote builds. Confirm that you haven’t committed any sensitive environment variables to your repository. Pro and Enterprise teamsSection titled “Pro and Enterprise teams” Make variables available to only the scopes that need them for tighter control of your sensitive data. If you have multiple sites, use shared environment variables for non-sensitive values where possible for dev productivity. Enterprise teams onlySection titled “Enterprise teams only” Configure Private Connectivity to reduce the risk to your backend environment. Prepare for production trafficSection titled “Prepare for production traffic” Configure your site for HSTS preload to enhance performance and security. Check for consistent trailing slashes for SEO and enable pretty URLs if needed. Set up a custom 404 page in line with your branding. Work with your legal representation to make sure your site is following all privacy regulations that apply to your site. Then use country-based redirects to show appropriate disclosures and get the appropriate consent per location. Add a custom domain and configure DNS. If you’re using external DNS, confirm that your primary domain is www or another subdomain instead of an apex domain to optimize your use of our CDN. If you plan to have more than 5 domain aliases that are subdomains of the same domain, manage your HTTPS certificates to avoid rate limiting for subdomains. Enterprise teams onlySection titled “Enterprise teams only” Set up Firewall Traffic Rules to permit or block access to your site based on IP address or geographic location. Set up rate limiting rules to protect against API abuse, authentication attacks, and more. If you’re migrating an existing domain you’ve already used, and you have access to premium support, reach out to your dedicated account support team for help working through our Enterprise domain migration launch checklist. If you’re using external DNS, configure your domains to use the High-Performance Edge to benefit from proactive DDoS mitigation and optimize response times and cache hits. If your site will handle HIPAA-regulated data, visit our Trust Center to download our reference architecture for HIPAA-compliant composable sites on Netlify. Communicate with customersSection titled “Communicate with customers” If your business involves up the Netlify Email Integration to send emails and keep your templates version controlled alongside the rest of your project. Set up your domain to receive emails. If you’re using Netlify extra spam prevention. Add an <input> with name=\"email\" to streamline replying to form submitters. Create a custom success page in line with your branding. Create a process for managing sensitive form data. Expect the unexpectedSection titled “Expect the unexpected” Plan a maintenance page process. Familiarize your team with the following tools and in case they need to revert site changes quickly. Manual deploy deletion in case they ever need to remove accidentally deployed sensitive information. Fix failed deploys and build errors with Netlify’s AI-enabled suggested solutions Pro and Enterprise teamsSection titled “Pro and Enterprise teams” Familiarize your team with our tips for requesting support by email. Enterprise teams onlySection titled “Enterprise teams only” Familiarize your team with the following tools and prioritization to reduce wait times for important builds in your team build queue. If you have Premium Support, your dedicated Slack channel and phone number for support. Last 9, 2026 PreviousOverviewNextOnboard to Pro checklist Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.457Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":2552}}266{"id":"doc-debug_with_vs_code_and_netlify_cli_netlify_docs-30031912","source":"documentation","title":"Debug with VS Code and Netlify CLI | Netlify Docs","url":"https://docs.netlify.com/api-and-cli-guides/cli-guides/debug-with-vscode/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI API & CLI guides API & CLI guides Overview API guides Get started with API Deploy project from a zip file with API Deploy zip file to production More API guides API reference docs Go client JS client CLI guides Get started with CLI Local development Manage functions Debug with VSCode More CLI guides CLI reference docs On this page Overview Create a configuration file Launch the debugger Debug functions On this page Overview Create a configuration file Launch the debugger Debug functions For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 API And CLI Guides / CLI Guides / Debug with VS Code and Netlify CLI Copy page View as Markdown Copy as Markdown View as Markdown You can use the VS Code debugger while you run your project with the Netlify CLI. This document outlines how to configure VS Code and how to launch the debugger. Create a configuration fileSection titled “Create a configuration file” Create a launch.json file under a .vscode directory in your project with the following content. { \"version\": \"0.2.0\", \"configurations\": [ { \"name\": \"netlify dev\", \"type\": \"node\", \"request\": \"launch\", \"skipFiles\": [\"<node_internals>/**\"], \"outFiles\": [\"${workspaceFolder}/.netlify/functions-serve/**/*.js\"], \"program\": \"${workspaceFolder}/node_modules/.bin/netlify\", \"args\": [\"dev\"], \"console\": \"integratedTerminal\", \"env\": { \"BROWSER\": \"none\" }, \"serverReadyAction\": { \"pattern\": \"Server now ready on (https?://[\\\\w:.-]+)\", \"uriFormat\": \"%s\", \"action\": \"debugWithChrome\" } }, { \"name\": \"netlify \", \"type\": \"node\", \"request\": \"launch\", \"skipFiles\": [\"<node_internals>/**\"], \"outFiles\": [\"${workspaceFolder}/.netlify/functions-serve/**/*.js\"], \"program\": \"${workspaceFolder}/node_modules/.bin/netlify\", \"args\": [\"functions:serve\"], \"console\": \"integratedTerminal\" } ]} Launch the debuggerSection titled “Launch the debugger” After you create the configuration file, launch the Run and Debug from the VS Code sidebar. To reduce noise, we recommend that you deactivate Caught Exceptions. In the top menu, select the command to run — either netlify dev or netlify Run the debugger. If you select netlify dev, the CLI will start a local development environment and open a browser with the site URL. If you select netlify , the CLI will start a standalone Netlify Functions server. Debug functionsSection titled “Debug functions” Use the --inspect Node.js option to debug functions. Visit managing functions for more information. Last 14, 2025 PreviousManage functionsNextMore CLI guides Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n{  \"version\": \"0.2.0\",  \"configurations\": [    {      \"name\": \"netlify dev\",      \"type\": \"node\",      \"request\": \"launch\",      \"skipFiles\": [\"<node_internals>/**\"],      \"outFiles\": [\"${workspaceFolder}/.netlify/functions-serve/**/*.js\"],      \"program\": \"${workspaceFolder}/node_modules/.bin/netlify\",      \"args\": [\"dev\"],      \"console\": \"integratedTerminal\",      \"env\": { \"BROWSER\": \"none\" },      \"serverReadyAction\": {        \"pattern\": \"Server now ready on (https?://[\\\\w:.-]+)\",        \"uriFormat\": \"%s\",        \"action\": \"debugWithChrome\"      }    },    {      \"name\": \"netlify functions:serve\",      \"type\": \"node\",      \"request\": \"launch\",      \"skipFiles\": [\"<node_internals>/**\"],      \"outFiles\": [\"${workspaceFolder}/.netlify/functions-serve/**/*.js\"],      \"program\": \"${workspaceFolder}/node_modules/.bin/netlify\",      \"args\": [\"functions:serve\"],      \"console\": \"integratedTerminal\"    }  ]}\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.457Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":1241}}267{"id":"doc-use_visual_editor_with_hydrogen_netlify_docs-19ebf1c1","source":"documentation","title":"Use Visual Editor with Hydrogen | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/frameworks/hydrogen/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Visual Editor for a Hydrogen project Content reload Example On this page Overview Configure Visual Editor for a Hydrogen project Content reload Example For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Frameworks / Use Visual Editor with Hydrogen Copy page View as Markdown Copy as Markdown View as Markdown Learn how to use Visual Editor with a Hydrogen-based website. Shopify’s Hydrogen is a relatively new project at the time of writing. It heavily utilizes React Server Components, a feature which is still under development by the React core team.Due to the early stage of this framework, a few workarounds were necessary to fully integrate it with Visual Editor. Most probably, we'd be able to remove these in the future. Configure Visual Editor for a Hydrogen projectSection titled “Configure Visual Editor for a Hydrogen project” Hydrogen is supported through the option (learn more. Follow the example repository for a concrete example of using Visual Editor with Hydrogen. Here's an excerpt from Visual Editor configuration file: // stackbit.config.jsexport default { stackbitVersion: \"~0.6.0\", cmsName: \"contentful\", nodeVersion: \"16\", ssgName: \"custom\", devCommand: \"echo Starting && APP_PORT={PORT} npm run dev-no-window\", experimental: { ssg: { name: \"Hydrogen\", logPatterns: { up: [\"Local: http\"] } } }}; Notes on the development mode, Hydrogen currently always opens a browser window automatically on startup, which fails when running inside a terminal-only container. Hence, note the npm run dev-no-window script which takes care to work around this behavior. Usage of the experimental.ssg.logPatterns.up property. The string 'Local: http' is part of the log message that appears when the Vite dev server is ready to accept requests. At the time of writing, Hydrogen is not yet based on Vite 3.x and thus HMR is not in effect while a Hydrogen site is open in the visual editor. Content reloadSection titled “Content reload” In the example repository, the main App component includes the StackbitHCR client-side component, which is tasked with capturing the 'stackbitObjectsChanged' window event. When a relevant content change is detected, the code utilizes Hydrogen's useServerProps React hook to trigger a refresh to the displayed server-side components. However, that is not yet a streamlined solution with a stable API. We expect that Hydrogen will provide a clear method for triggering a refresh to server-rendered pages from the client-side Learn more about listening to content change events. ExampleSection titled “Example” Hydrogen Demo Store + Contentful Example — based on Hydrogen's demo store, with the Journal section modified to fetch data from Contentful rather than Shopify's backend. Last 14, 2025 PreviousGatsbyNextNext.js Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.jsexport default {  stackbitVersion: \"~0.6.0\",  cmsName: \"contentful\",  nodeVersion: \"16\",  ssgName: \"custom\",  devCommand: \"echo Starting && APP_PORT={PORT} npm run dev-no-window\",  experimental: {    ssg: {      name: \"Hydrogen\",      logPatterns: { up: [\"Local: http\"] }    }  }};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.458Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":1444}}268{"id":"doc-use_visual_editor_with_nuxt_3_netlify_docs-cf45ee57","source":"documentation","title":"Use Visual Editor with Nuxt 3 | Netlify Docs","url":"https://docs.netlify.com/manage/visual-editor/frameworks/nuxt3/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Visual editing Visual editing Visual editor overview Get started Get started overview Visual editor quickstart Set up visual editor locally Customize editing experience Manage visual editing Visual editor walkthrough help Troubleshoot visual editor setup Visual editor glossary Concepts Concepts overview How visual editor works Structured content Content-driven development Reusable content Two-way content sync Configuration Analytics Automatic content reload Content presets Custom actions Document hooks Editorial permissions Global styles Local development Localization Personalization Preview controls Sitemap navigator Tree view Version control Asset sources Overview Aprimo Bynder Cloudinary Cloud setup Overview Container Git branching Import Previewing Publishing Content sources Overview Contentful Contentstack Custom DatoCMS Git Hygraph Sanity Frameworks Overview Angular Astro Custom Eleventy Gatsby Hydrogen Next.js Nuxt 3 SvelteKit Visual editing Overview Content editor Custom fields Field controls Field groups Inline editor Page editor Sidebar buttons Status labels Troubleshoot On this page Overview Configure Visual Editor for a Nuxt 3 project Access file-based content Content reload Example On this page Overview Configure Visual Editor for a Nuxt 3 project Access file-based content Content reload Example For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Visual Editor / Frameworks / Use Visual Editor with Nuxt 3 Copy page View as Markdown Copy as Markdown View as Markdown Learn how to use Visual Editor with a Nuxt 3-based website. Configure Visual Editor for a Nuxt 3 projectSection titled “Configure Visual Editor for a Nuxt 3 project” Nuxt 3 is supported through the option (learn more. Follow the example repository for a concrete example. Here's an excerpt from Visual Editor configuration file: // stackbit.config.jsexport default { stackbitVersion: \"~0.6.0\", cmsName: \"contentful\", nodeVersion: \"16\", ssgName: \"custom\", devCommand: \"npm run dev -- -p {PORT}\", experimental: { ssg: { name: \"Nuxt3\", logPatterns: { up: [\"Local: http\"] }, passthrough: [\"/vite-hmr/**\"] } }}; Like SvelteKit, Nuxt 3 uses Vite 3.x under the hood. Thus, similar experimental attributes are used to ensure compatibility with Visual Editor. Please see the SvelteKit guide for more. Access file-based contentSection titled “Access file-based content” The example repository does not use a headless CMS. Rather, it loads page content from local files in the same repository. By default, Nuxt does not include all files in the repository in either its client-side bundle or server-side functions. Thus, in the example, we configure Nitro to bundle content files as server assets and then use the storage API to access them. See the file utils/content.js in the example. Content reloadSection titled “Content reload” Here is how content reload is implemented in the client-side Nuxt plugin plugins/stackbit-listener.client.ts adds a listener to the window event stackbitObjectsChanged. This event is fired by Visual Editor on any content change, both when working locally and with Visual Editor projects. The plugin uses an emitter to notify whoever is listening on that emitter. The catch-all page route pages/[...slug].vue(GitHub captures this event and runs the refresh callback returned from its initial call to useAsyncData() (see Nuxt 3 guide to refresh data). Learn more about listening to content change events. ExampleSection titled “Example” Nuxt 3 Example Last 14, 2025 PreviousNext.jsNextSvelteKit Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n// stackbit.config.jsexport default {  stackbitVersion: \"~0.6.0\",  cmsName: \"contentful\",  nodeVersion: \"16\",  ssgName: \"custom\",  devCommand: \"npm run dev -- -p {PORT}\",  experimental: {    ssg: {      name: \"Nuxt3\",      logPatterns: { up: [\"Local:    http\"] },      passthrough: [\"/vite-hmr/**\"]    }  }};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.459Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":1348}}269{"id":"doc-error_reference_netlify_docs-89494b6e","source":"documentation","title":"Error reference | Netlify Docs","url":"https://docs.netlify.com/resources/troubleshooting/error-reference/","text":"Example:\n```text\nBulid failed due to a user error: Build script returned non-zero exit code: 2Failing build: Failed to build site\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.460Z","totalSectionsIncluded":0,"totalCodeBlocksIncluded":1,"totalLines":6,"estimatedTokens":37}}270{"id":"doc-migrate_from_vercel_to_netlify_with_an_ai_agent_-bdd2a24f","source":"documentation","title":"Migrate from Vercel to Netlify with an AI agent | Netlify Docs","url":"https://docs.netlify.com/resources/migrate/vercel-ai-agent-migration/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Migrate Migrate Overview Vercel to Netlify migration with AI agent On this page Overview Prerequisites Understanding the migration scope Directory mappings Runtime differences Configuration transformations Migration workflow Step the AI prompt Step the AI agent Step automated changes Step dependencies Step locally Step and deploy Runtime considerations Edge Functions (Deno runtime) Serverless Functions (Node runtime) Environment variables Migrating from Vercel Scoped variables Verification checklist Troubleshooting Build failures Runtime errors Environment variable issues Edge Function migration Before (Vercel) After (Netlify) Resources Migration tools and examples Netlify documentation Additional resources On this page Overview Prerequisites Understanding the migration scope Directory mappings Runtime differences Configuration transformations Migration workflow Step the AI prompt Step the AI agent Step automated changes Step dependencies Step locally Step and deploy Runtime considerations Edge Functions (Deno runtime) Serverless Functions (Node runtime) Environment variables Migrating from Vercel Scoped variables Verification checklist Troubleshooting Build failures Runtime errors Environment variable issues Edge Function migration Before (Vercel) After (Netlify) Resources Migration tools and examples Netlify documentation Additional resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending from \"@netlify/edge-functions\"; export default async (request: Request, ) => { const apiKey = Netlify.env.get(\"API_KEY\"); // ... function logic}; export const = { path: \"/api/geolocation\"}; Import statement updates for DenoSection titled “Import statement updates for Deno” // Before (Node.js imports)import { parse } from 'url';import crypto from 'crypto'; // After (Deno-compatible)import { parse } from 'node:url';import crypto from 'node:crypto';// Or use Deno's built-in URL API Next.js version updatesSection titled “Next.js version updates” If your project uses Next.js, the agent may update to version 13.5+ to ensure compatibility with Netlify's zero-configuration Next.js support: { \"dependencies\": { \"next\": \"^14.0.0\" }} Step dependenciesSection titled “Step dependencies” After the agent completes its changes, install the required Netlify windownpm install @netlify/functions @netlify/edge-functions @netlify/blobs Step locallySection titled “Step locally” Verify the migration with Netlify's local development window# Start local development environmentnetlify dev This your build command Starts the Netlify Dev server Emulates Edge Functions and serverless functions Provides access to environment variables Test your to previously working Vercel endpoints Verify Edge Function responses (e.g., geolocation) Check API route functionality Test form submissions if applicable Step and deploySection titled “Step and deploy” Once local testing succeeds, deploy to window# Build for productionnetlify build # Deploy to productionnetlify deploy --prod The agent ensures your netlify.toml is configured correctly, so the deployment should succeed without additional configuration. Runtime considerationsSection titled “Runtime considerations” Edge Functions (Deno runtime)Section titled “Edge Functions (Deno runtime)” Netlify Edge Functions run on Deno, not Node.js. Key requirements: // for built-in modulesimport { Buffer } from \"node:buffer\"; // URL imports for Deno modulesimport { serve } from \"https://deno.land/std/http/server.ts\"; // imports won't workimport { Buffer } from \"buffer\"; Environment variables: // environment APIconst dbUrl = Netlify.env.get(\"DATABASE_URL\"); // not available in Denoconst dbUrl = process.env.DATABASE_URL; No global side Functions should not have top-level side effects. Initialize within the handler function. Serverless Functions (Node runtime)Section titled “Serverless Functions (Node runtime)” Netlify serverless functions use Node.js and support CommonJS or ESM: // netlify/functions/api.mtsimport type { Config } from \"@netlify/functions\"; export default async (req: Request) => { const data = await fetch(\"https://api.example.com/data\"); return new Response(JSON.stringify(await data.json()), { headers: { \"Content-Type\": \"application/json\" } });}; export const = { path: \"/api/data\"}; Use ; export default async function handler(request) { const country = request.geo.country || 'Unknown'; const city = request.geo.city || 'Unknown'; return new Response(JSON.stringify({ country, city }), { headers: { 'content-type': 'application/json' } });} After (Netlify)Section titled “After (Netlify)” // netlify/edge-functions/geolocation.tsimport type { Config, Context } from \"@netlify/edge-functions\"; export default async (request: Request, ) => { const country = context.geo?.country?.name || \"Unknown\"; const city = context.geo?.city || \"Unknown\"; return new Response(JSON.stringify({ country, city }), { headers: { \"content-type\": \"application/json\" } });}; export const = { path: \"/api/geolocation\"}; Key types imported from @netlify/edge-functions Geolocation accessed via context.geo instead of request.geo Explicit Config export defines the route path Uses Deno-compatible syntax ResourcesSection titled “Resources” Migration tools and examplesSection titled “Migration tools and examples” Netlify AI context Development MDC Netlify documentationSection titled “Netlify documentation” Edge Functions overview Serverless Functions guide Next.js on Netlify Environment variables setup Netlify Image CDN Netlify Blobs storage Additional resourcesSection titled “Additional resources” General Vercel to Netlify migration checklist Production readiness checklist Fix failed deploys with AI Join the community Have questions about your migration? The Netlify community forums are a great place to get help from other developers who have successfully migrated from Vercel. Last 30, 2026 PreviousOverviewNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\n[build]  command = \"npm run build\"  publish = \".next\"  # or \"dist\" depending on framework\n[build.environment]  NODE_VERSION = \"20\"\n[functions]  directory = \"netlify/functions\"\n[build.edge_functions]  directory = \"netlify/edge-functions\"\n```\n\nExample:\n```text\ntask: migrate_projectdescription: >  Convert existing Vercel project to fully functional Netlify deployment.  Ensure total compliance with Netlify conventions and runtime.\nREQUIREMENTS:  - must_build_with: netlify build  - must_deploy_with: netlify deploy  - must_pass_local_test: netlify dev  - runtime_edge: Deno (no Node-only syntax)  - runtime_functions: ESM + TypeScript (.mts)  - use_env: Netlify.env.get()  - never_use: process.env  - ensure_latest_next: true\nmappings:  vercel_edge → netlify/edge-functions  vercel_api → netlify/functions  vercel_isr → on-demand builders or edge  vercel_kv_blob → @netlify/blobs  vercel_image → Netlify Image CDN  vercel_cron → scheduled functions  env → Netlify dashboard/CLI\ndirectories:  functions: netlify/functions  edge: netlify/edge-functions  ignore: .netlify\ndependencies:  - \"@netlify/functions@latest\"  - \"@netlify/edge-functions@latest\"  - \"@netlify/blobs@latest\"\nnetlify_toml:  build.command: npm run build  build.publish: .next or dist  functions.directory: netlify/functions  build.edge_functions: netlify/edge-functions\nverify:  - npm install success  - netlify dev success  - all routes respond  - no syntax errors  - env accessible\nnotes:  - Edge uses Deno; adapt imports accordingly  - prefer URL imports or node: prefix  - no global side effects  - update Next.js versions if build fails  - doc_ref: https://docs.netlify.com/ai-context/netlify-development.mdc\n```\n\nExample:\n```text\n# Before (Vercel structure)api/  hello.js  users.jsedge/  geolocation.js\n# After (Netlify structure)netlify/  functions/    hello.mts    users.mts  edge-functions/    geolocation.ts\n```\n\nExample:\n```text\n// Before (Vercel)const apiKey = process.env.API_KEY;\n// After (Netlify Edge Function)import { Config } from \"@netlify/edge-functions\";\nexport default async (request: Request, context: Context) => {  const apiKey = Netlify.env.get(\"API_KEY\");  // ... function logic};\nexport const config: Config = {  path: \"/api/geolocation\"};\n```\n\nExample:\n```text\n// Before (Node.js imports)import { parse } from 'url';import crypto from 'crypto';\n// After (Deno-compatible)import { parse } from 'node:url';import crypto from 'node:crypto';// Or use Deno's built-in URL API\n```\n\nExample:\n```text\n{  \"dependencies\": {    \"next\": \"^14.0.0\"  }}\n```\n\nExample:\n```text\nnpm install @netlify/functions @netlify/edge-functions @netlify/blobs\n```\n\nExample:\n```text\n# Start local development environmentnetlify dev\n```\n\nExample:\n```text\n# Build for productionnetlify build\n# Deploy to productionnetlify deploy --prod\n```\n\nExample:\n```text\n// Correct: Use node: prefix for built-in modulesimport { Buffer } from \"node:buffer\";\n// Correct: Use URL imports for Deno modulesimport { serve } from \"https://deno.land/std/http/server.ts\";\n// Incorrect: Node-style imports won't workimport { Buffer } from \"buffer\";\n```\n\nExample:\n```text\n// Correct: Netlify environment APIconst dbUrl = Netlify.env.get(\"DATABASE_URL\");\n// Incorrect: process.env not available in Denoconst dbUrl = process.env.DATABASE_URL;\n```\n\nExample:\n```text\n// netlify/functions/api.mtsimport type { Config } from \"@netlify/functions\";\nexport default async (req: Request) => {  const data = await fetch(\"https://api.example.com/data\");  return new Response(JSON.stringify(await data.json()), {    headers: { \"Content-Type\": \"application/json\" }  });};\nexport const config: Config = {  path: \"/api/data\"};\n```\n\nExample:\n```text\n# Set individual variablesnetlify env:set API_KEY \"your-key-value\"\n# Import from .env filenetlify env:import .env\n```\n\nExample:\n```text\n# Update to supported versionnpm install next@latest\n```\n\nExample:\n```text\nnpm install @netlify/functions @netlify/edge-functions\n```\n\nExample:\n```text\n# Clear npm cachenpm cache clean --force\n# Remove node_modules and lock filerm -rf node_modules package-lock.json\n# Reinstall with latest versionsnpm install\n```\n\nExample:\n```text\nClear the cache and update packages to their latest version\n```\n\nExample:\n```text\n// edge/geolocation.jsexport const config = { runtime: 'edge' };\nexport default async function handler(request) {  const country = request.geo.country || 'Unknown';  const city = request.geo.city || 'Unknown';\n  return new Response(JSON.stringify({ country, city }), {    headers: { 'content-type': 'application/json' }  });}\n```\n\nExample:\n```text\n// netlify/edge-functions/geolocation.tsimport type { Config, Context } from \"@netlify/edge-functions\";\nexport default async (request: Request, context: Context) => {  const country = context.geo?.country?.name || \"Unknown\";  const city = context.geo?.city || \"Unknown\";\n  return new Response(JSON.stringify({ country, city }), {    headers: { \"content-type\": \"application/json\" }  });};\nexport const config: Config = {  path: \"/api/geolocation\"};\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.462Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":19,"totalLines":127,"estimatedTokens":3097}}271{"id":"doc-assign_a_domain_to_your_site_or_app_netlify_docs-c1008364","source":"documentation","title":"Assign a domain to your site or app | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/assign-a-domain-to-your-site-app","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Assign a domain to your site or app Copy page View as Markdown Copy as Markdown View as Markdown Use your own domain for your Netlify site for free or you can add a domain you already own, then set up Netlify DNS for it. From your Site Overview or Site dashboard, on the left sidebar, select Domain management. Next, choose Add a domain, then Add a domain you already own. Enter your domain and follow the setup prompts. Choose whether you will use Netlify DNS or an External DNS Provider. If you’re using an External DNS Provider, check out their docs for help updating your DNS records and our DNS records docs. Find some customized help by selecting Pending DNS verification next to your domain. These in-app instructions are customized based on your added domain. If you decide to use Netlify DNS, select Options > Set up Netlify DNS and follow the setup prompts. Last 28, 2025 PreviousAdd domain redirectNextManage DNS records Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.462Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":845}}272{"id":"doc-dns_https_troubleshooting_tips_netlify_docs-fc3e04e1","source":"documentation","title":"DNS & HTTPS troubleshooting tips | Netlify Docs","url":"https://docs.netlify.com/manage/domains/troubleshooting-tips","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview DNS configuration Inactive Netlify DNS zone Custom certificate not working for automatic deploy subdomain Certificates and HTTPS HTTPS error messages On this page Overview DNS configuration Inactive Netlify DNS zone Custom certificate not working for automatic deploy subdomain Certificates and HTTPS HTTPS error messages For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / DNS & HTTPS troubleshooting tips Copy page View as Markdown Copy as Markdown View as Markdown If you’re having trouble accessing your site at your custom domain or branch subdomain, there is likely a problem with your DNS or HTTPS setup. This page includes tips and information to help get things working properly. DNS configurationSection titled “DNS configuration” The dig command line tool is a great tool for quickly diagnosing and understanding DNS responses. It is built into Linux and Mac, but can also be installed on Windows. Alternatively, you can use an online tool to run dig in the browser. NS1, the DNS provider backing Netlify DNS, has a great series of articles on using DIG to test and troubleshoot your DNS configuration. Inactive Netlify DNS zoneSection titled “Inactive Netlify DNS zone” A common DNS configuration issue is an inactive Netlify DNS zone. This prevents our service from creating or updating the automatic Let’s Encrypt SSL certificates for your custom domain. This can cause problems for branch subdomains. For more information, visit our Forums for a verified Support Guide on how to detect and fix inactive Netlify DNS zones. Custom certificate not working for automatic deploy subdomainSection titled “Custom certificate not working for automatic deploy subdomain” If a custom certificate is not working for your automatic deploy subdomain, ensure your certificate includes any new subdomains used for automatic deploy subdomains. For example, for the automatic deploy subdomain early-access.company.com , your custom certificate should include the domains *.company.com, *.early-access.company.com and not just *.company.com. Learn more about custom certificates and automatic deploys subdomains. Certificates and HTTPSSection titled “Certificates and HTTPS” There are many reasons why adding a Netlify certificate or uploading a custom certificate might not work. The common causes are listed below, but if they don’t seem to apply to you or you have additional questions, our Support team will be happy to help out! Most importantly, you’ll need to configure the DNS for the custom domain before Netlify can issue a certificate for you. Netlify must validate the domain in order to provision the certificate, and this step cannot be completed until the DNS records for your custom domain are pointing to our servers. All previous DNS settings must have their cache timeouts expired. The TTL setting on a DNS record determines how long the record may be cached. This cache must expire before your new DNS settings can be validated for certificate provisioning. If your site is configured to go through another service (for example, using Cloudflare “accelerate and protect”, or similar), you need to disable that routing before we can provision the certificate. Netlify must handle TLS termination to be able to provision a certificate. It is possible that the name servers we use have some old cached values for your domain name. You can attempt to accelerate cache expiration for your domains using the Flush Cache tool provided by Google Public DNS. It is possible that we will get a certificate for one name (for example, petsofnetlify.com) and not for another (for example, www.petsofnetlify.com or some domain alias). In this case selecting Renew certificate should resolve the issue. If it doesn’t, please post in the Netlify Support Forums so our support engineers can repair the certificate. HTTPS error messagesSection titled “HTTPS error messages” You can check the status of your certificate in Domain management > HTTPS. If there is a problem with the certificate, you may find one of the error messages below. (We’re using petsofnetlify.com as an example.) “petsofnetlify.com doesn’t appear to be served by Netlify”Section titled ““petsofnetlify.com doesn’t appear to be served by Netlify”” In order to make sure that the site is served by Netlify, check the HTTP response headers. Examine the HTTP response headers in your browser’s dev tools, using an online checker, or with the following terminal -s -v http://your-newly-configured-hostname.com 2>&1 | grep -i server Check for a line that says Repeat this for each domain connected to your site. If your custom domain is the apex domain or www subdomain (for example, petsofnetlify.com or www.petsofnetlify.com), we automatically serve your site and provision a certificate for both domains, so be sure they both have records pointing to Netlify. The next steps depend on what you find in the HTTP response headers. If you do find in all response headers, but still receive this error, it may be caused by incorrect A records. For information on setting a proper A record with Netlify, refer to our documentation on external DNS configuration. If you don’t find in all response headers, and you’ve eliminated the common problem sources listed above, please contact support. “petsofnetlify.com is not resolvable with a resolver that validates DNSSEC”Section titled ““petsofnetlify.com is not resolvable with a resolver that validates DNSSEC”” Netlify DNS doesn’t support DNSSEC. To use Netlify DNS, disable DNSSEC with your domain registrar or previous DNS host. You can use tools like DNSViz to figure out where DNSSEC is currently enabled. To keep DNSSEC enabled, you can stop using Netlify DNS and use external DNS instead. Last 14, 2025 PreviousWhy Netlify DNSNextLock your domain Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\ncurl -s -v http://your-newly-configured-hostname.com 2>&1 | grep -i server\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.463Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":2055}}273{"id":"doc-dns_records_netlify_docs-b867cdc0","source":"documentation","title":"DNS records | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/dns-records","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Supported record types Add a new record Edit a record Delete a record API endpoints On this page Overview Supported record types Add a new record Edit a record Delete a record API endpoints For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / DNS records Copy page View as Markdown Copy as Markdown View as Markdown DNS records are rules that tell domain name servers how to handle traffic to your domains and subdomains. For domains managed by Netlify, we will automatically create “NETLIFY” records that point to our servers when you assign a domain or subdomain for your site. To learn more, visit our Forums for a verified support guide on this type of DNS record. You can also add your own DNS records to point to other services, such as an email provider. Visit our Forums for a verified Support Guide on how to receive emails on your domain. Supported record typesSection titled “Supported record types” Netlify DNS supports the following types of : Address record, which is used to map host names to their IPv4 address. Address record, which is used to map host names to their IPv6 address. Authority (CA) Authorization, which is used to specify which CAs are allowed to create certificates for a domain. name record, which is used to specify alias names. exchange record, which is used in routing requests to mail servers. server record, which delegates a DNS zone to an authoritative server. Policy Framework record, a deprecated record type formerly used in e-mail validation systems (use a TXT record instead). locator record, which is used by some voice over IP, instant messaging protocols, and other applications. record, up to 255 characters. Can contain arbitrary text and can also be used to define machine-readable data, such as security or abuse prevention information. Add a new recordSection titled “Add a new record” To add a new DNS to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. Select the domain (or DNS zone) you want to add a new DNS record for. At the bottom of the DNS records section, select Add new record. Choose the type of record to create from the menu and fill in the remaining options. The fields you need to fill out will depend on the type of record you select. Select Save to create the record and make the changes live. Remember, it may take up to a few hours for record changes to propagate. Note that you can host records for other services, such as your mail provider or your backend API, with us as long as you host at least one website with us that uses the domain. Next step If you’re adding DNS records as part of the process of moving your DNS service to Netlify DNS, your next step is to delegate your domain to Netlify. Edit a recordSection titled “Edit a record” To make DNS changes, you need to first add a new record with the new value and then delete the old record. DNS allows multiple entries for the same name and type, so you can avoid downtime by making changes this way. Delete a recordSection titled “Delete a record” To delete a DNS to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. Select the domain (or DNS zone) you want to delete a DNS record for. In the DNS records section, find the record you want to delete. Select the record to expand the details and then select the delete option. Review the warning message and select Delete to confirm. Remember, it may take up to a few hours for record changes to propagate. API endpointsSection titled “API endpoints” You can use the API to get DNS records, create DNS records, and more. Last 19, 2026 PreviousDelegate a standalone subdomainNextEnable IPv6 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.464Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1539}}274{"id":"doc-release_phases_netlify_docs-b6d1e85a","source":"documentation","title":"Release Phases | Netlify Docs","url":"https://docs.netlify.com/release-phases/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI On this page Overview Beta Private beta Public beta Early access General availability Deprecated End of service On this page Overview Beta Private beta Public beta Early access General availability Deprecated End of service For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Release Phases Copy page View as Markdown Copy as Markdown View as Markdown As part of the product lifecycle, Netlify offers features and functionality at different stages of development. Features may go through all phases or just some. The product lifecycle covers everything from significant new services on our platform to minor updates like a new flag in our command line interface (CLI). This page serves as a reference to define each release phase. BetaSection titled “Beta” Beta features are still under development. They are ready for testing and use in projects that are not mission critical. Netlify uses two beta release and public. Private betaSection titled “Private beta” Private beta features are enabled individually for selected users or teams with internal approval. Netlify uses this phase to gather qualitative feedback to guide development. Certain private beta features may use Netlify Labs to enable access. Outages within the feature or sites using the feature are possible, but these should not impact other sites or systems. Breaking changes are likely to occur. Public betaSection titled “Public beta” Features in public beta are available to all users, although certain features or functionality may be available only for teams on specific pricing plans. Netlify uses the public beta phase to gather higher-volume qualitative feedback, aggregate usage data, and perform error monitoring. Features in public beta may be automatically enabled for all users, or they may require opting in through Netlify Labs or another mechanism. Although we aim for production quality and stability, they aren’t guaranteed at this release phase. Bugs are expected, and breaking changes are possible. Early accessSection titled “Early access” When we’re making significant changes and improvements to an existing feature, we may make an Early Access version of the feature available for users to opt-in and start using early. Each Early Access feature may have its own specific opt-in or rollout process. General availabilitySection titled “General availability” At the general availability phase, features are production-ready for mission critical applications. They meet Netlify standards for production quality and stability and abide by our service-level agreements. Breaking changes are unlikely and require significant prior notice. Versioned services such as Netlify CLI, Netlify REST API, and related clients and SDKs follow semantic versioning. While there are multiple releases available for these services, we recommend that you use the latest version. DeprecatedSection titled “Deprecated” A feature or functionality marked as deprecated is still available, but we don’t recommend its continued use or adoption for new use cases. Before any deprecated feature reaches end of service, Netlify provides time and guidance to migrate off. While breaking changes are unlikely until a service is shut down, there may be degraded quality and stability during a deprecation period. End of serviceSection titled “End of service” A feature at the end of service phase is no longer available or supported. Last 19, 2025 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.465Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1235}}275{"id":"doc-create_new_project_with_an_ai_agent_netlify_docs-5dd9dc77","source":"documentation","title":"Create new project with an AI agent | Netlify Docs","url":"https://docs.netlify.com/start/quickstarts/create-new-project-with-ai-agent","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Start Start Choose your path What is Netlify? Quickstarts Netlify Drop Quickstart Create a new project with an AI agent Iterate on a project with an AI agent Deploy from your repository Deploy from AI code generation tool Create a repo from Netlify Core Concepts Version control Primitives Framework setup guides Agent setup guides Netlify CLI Netlify API Beginner’s glossary On this page Overview Video walkthrough overview Create a new project steps Next steps On this page Overview Video walkthrough overview Create a new project steps Next steps For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Start / Quickstarts / Create new project with an AI agent Copy page View as Markdown Copy as Markdown View as Markdown Learn how to create a new project from a prompt using an AI agent directly from your Netlify dashboard. When you start a new project this way, your project gets the best context and feedback loops for building and debugging custom experiences with features like forms, Blobs, Netlify Identity to manage access and authorization, and more. Video walkthrough overviewSection titled “Video walkthrough overview” For a video walkthrough of this process, check out the following walkthrough transcript Meet a new way to start projects on Netlify. Go to netlify.new, describe what you want to build, and choose an agent. Netlify runs the agent, generates the project, and deploys it. In minutes, you have a live site running on production infrastructure. Everything you need to ship is there from the first identity for auth Storage to manage data assets and files Serverless functions for APIs AI gateway for model access and skills that help agents use Netlify primitives the right way. Keep iterating with agent runners using your own prompt library or switch to code. Prompts and code operate on the same project, the same infrastructure and the same workflow. Projects live in real repositories. Changes are reviewable. Deployments follow the approval process you already use. Your next idea could be live in minutes. Start building at netlify.new. Create a new project stepsSection titled “Create a new project steps” To use this feature, you need a Credit-based pricing plan and must have enabled AI features. To start a new project with an AI to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select Add new project. Enter your own prompt or select a starter prompt to use or edit. You can also dictate a prompt. Optionally, choose your AI agent and add any additional images or files. Start building with Build now. Checkpoint Once your project builds, you should find a notification on your dashboard that your project's first deployment is ready for review. Next stepsSection titled “Next steps” Customize your project name Continue building with Agent Runners Add a custom domain Last 30, 2026 Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.466Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1107}}276{"id":"doc-automatic_deploy_subdomains_netlify_docs-029080a1","source":"documentation","title":"Automatic deploy subdomains | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/automatic-deploy-subdomains","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Use cases Domain requirements Example deploy URLs Automatic deploy subdomains for Deploy Previews Set an automatic deploy subdomain for Deploy Previews Automatic deploy subdomains for branch deploys Prerequisites Set an automatic deploy subdomain for branch deploys Choose a unique URL for your branch deploys Limitations for sites with existing branch subdomains Use a new custom domain for your automatic deploy subdomain Use the Netlify API to set automatic deploy subdomains Custom certificate requirements Remove an automatic deploy subdomain On this page Overview Use cases Domain requirements Example deploy URLs Automatic deploy subdomains for Deploy Previews Set an automatic deploy subdomain for Deploy Previews Automatic deploy subdomains for branch deploys Prerequisites Set an automatic deploy subdomain for branch deploys Choose a unique URL for your branch deploys Limitations for sites with existing branch subdomains Use a new custom domain for your automatic deploy subdomain Use the Netlify API to set automatic deploy subdomains Custom certificate requirements Remove an automatic deploy subdomain For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Automatic deploy subdomains Copy page View as Markdown Copy as Markdown View as Markdown With automatic deploy subdomains, you can set up automatically branded URLs for Deploy Previews or branch deploys — unifying your site’s preview environments, auth flows, third-party services, and other site versions with a shared custom domain. Automatic deploy subdomains are a type of custom domain that you can set for all Deploy Previews or all branch deploys. Use casesSection titled “Use cases” When you set up an automatic deploy subdomain for all of your Deploy Previews or branch deploys, you branded deploy URLs that don’t include the Netlify subdomain. For example, build greater trust with your stakeholders by sharing deploy-preview-42.company.com instead of deploy-preview-42--mysitename.netlify.app. Use third-party services the way you do for your production site, such as auth flow services that rely on a custom domain. Ensure deploys are “trusted” and in the “allowed domain list” for any third-party scripts or services that require this. Meet internal security requirements while leveraging Netlify’s Deploy Previews and branch deploys to preview and collaborate on changes before they go live. Once you configure an automatic deploy subdomain, Netlify uses this custom domain for your Deploy Previews and/or branch deploys by default within the Netlify UI, the API, CLI, and deploy notifications. Domain requirementsSection titled “Domain requirements” The custom domain you set as your automatic deploy subdomain must be managed by Netlify DNS and available to your team. By default, domains managed by Netlify DNS can be applied to your Deploy Previews or branch deploys. For example, if you already delegated company.com to Netlify DNS, then subdomains of company.com, such as early-access.company.com, are also delegated to Netlify DNS by default. That means you can use early-access.company.com as your automatic deploy subdomain. If you want to use a custom domain that Netlify DNS does not already manage, add the custom domain to your Netlify team and configure it to be managed by Netlify DNS. Learn more in these domain setup steps. Want to use a subdomain without bringing the apex domain to Netlify DNS? You can bring a subdomain to Netlify DNS without the apex domain. For example, you can delegate docs.company.com to Netlify DNS without also delegating company.com. Learn more about stand-alone subdomain support. Example deploy URLsSection titled “Example deploy URLs” Site deploysNetlify subdomainAutomatic deploy subdomainDeploy Previewdeploy-preview-42--mysitename.netlify.appdeploy-preview-42.company-internal-testing.comBranch deploy, e.g. staging branchstaging--mysitename.netlify.appstaging.company-internal-testing.comAtomic deploy permalinkUses the Netlify subdomain and a deploy ID, such as 1234abcd12acde000111cdef--mysitename.netlify.app.N/A When you set an automatic deploy subdomain for all Deploy Previews or all branch deploys, your deploys are still accessible at the Netlify subdomain, such as deploy-preview-42--mysitename.netlify.app or staging--mysitename.netlify.app. Using High-Performance Edge? If your site is on the High-Performance Edge, then automatic deploy subdomains are served from the High-Performance Edge. However, Netlify subdomains (*.netlify.app) are always served from the standard network. Your deploy permalinks, which offer unique URLs for successful deploys of your site, will continue to use the Netlify subdomain. Unlike other deploy URLs, deploy permalinks do not update with new Git commits. Instead, Netlify generates new deploy permalinks for each successful deploy of your site. Not sure if you want to use Deploy Previews or branch deploys? Deploy Previews are scoped to a pull/merge request while branch deploys are scoped to a branch. Branch deploys can offer a longer-standing URL than Deploy Previews since they are based on the branch name and not the pull/merge request. Learn more about the difference between these deploys in these docs. Automatic deploy subdomains for Deploy PreviewsSection titled “Automatic deploy subdomains for Deploy Previews” Deploy Previews are automatically enabled for all sites using continuous integration with Netlify. If your site doesn’t have Netlify continuous integration set up, check out these docs. Set an automatic deploy subdomain for Deploy PreviewsSection titled “Set an automatic deploy subdomain for Deploy Previews” To set up an automatic deploy subdomain for your site’s Deploy to Domain management > Automatic deploy subdomains. Select Edit custom domains. Next to Deploy Previews, select Add custom domain. Under Domain, you’ll find domains managed by Netlify DNS. Select your chosen custom domain. Optionally, enter an additional subdomain, such as early-access or qa. Want to use a different domain? If you can’t find the domain you want to add in the drop-down menu, check out these docs for adding a new custom domain. Review the preview of the deploy URL for your Deploy Previews. To confirm, select Save. Once saved, Netlify updates the domain for all open Deploy Previews. If you applied a custom domain that is not already live as your primary site domain (or does not already have a security certificate), then your new deploy URL may take up to 24 hours to resolve and work with HTTPS. Automatic deploy subdomains for branch deploysSection titled “Automatic deploy subdomains for branch deploys” Branch deploys are often used for maintaining a separate version of your site for QA, internal testing, or even to manage different versions of site content for different audiences or product versions. If you are already using branch subdomains, check out our branch subdomain comparison docs to understand the key differences between these subdomains and how they can work together. If you set up an automatic deploy subdomain for branch deploys on your site, then each branch deploy will generate the same automatic deploy subdomain and include your branch deploy’s unique branch name. PrerequisitesSection titled “Prerequisites” To set up an automatic deploy subdomain for your site’s branch deploys, you must first enable branch deploys for your site. To enable branch deploys for your site, go to Project configuration > Build & deploy > Branches and deploy contexts. Select Configure. Next to Branch deploys, set up branch deploys for a specific branch or for all non-production branches. To confirm, select Save. Once branch deploys are enabled, create a new branch and push a commit to this branch in your connected site repo. Netlify will automatically generate a branch deploy, which you can preview in your site’s deploy list. Created a deploy with the CLI? If you created a deploy using the Netlify CLI’s --alias flag, then be aware that these deploys are not branch deploys and do not support branch subdomains or automatic deploy subdomains. We recommend you avoid using --alias with any of your branch names. Set an automatic deploy subdomain for branch deploysSection titled “Set an automatic deploy subdomain for branch deploys” To set up an automatic deploy subdomain for your site’s branch to Domain management > Automatic deploy subdomains. Select Edit custom domains. Next to Branch deploys, select Add custom domain. Under Domain, you’ll find domains managed by Netlify DNS. Select your chosen custom domain. Optionally, enter an additional subdomain, such as early-access or qa. Want to use a different domain? If you can’t find the domain you want to add in the drop-down menu, check out these docs for adding a new custom domain. Review the preview of the deploy URL for your branch deploys. To confirm, select Save. Once saved, Netlify updates the domain for all active branch deploys. If you applied a custom domain that is not already live as your primary site domain (or does not already have a security certificate), then your new deploy URL may take up to 24 hours to resolve and work with HTTPS. Choose a unique URL for your branch deploysSection titled “Choose a unique URL for your branch deploys” It is possible to configure automatic subdomains for branch deploys so that a branch subdomain conflicts with another site’s production domain. Since Deploy Previews are appended with the pull/merge request number, their automatic subdomains are unlikely to conflict with other domains. For A has a primary site domain of staging.company.com for the production site. Site B has an automated domain of staging.company.com for its staging branch. When there is a conflict, domains listed in your Production domains settings will take precedence over other internal domains. So in this example, staging.company.com will resolve to the content of site A. To prevent accidental domain duplication, you might choose to add another subdomain level to your branch subdomains that is not used in production, such as internal in staging.internal.company.com. If you get a domain conflict, you can rename the branch. For example, you can rename the branch from staging to qa. Then, the next time you deploy this branch, it would use the qa.company.com domain. Limitations for sites with existing branch subdomainsSection titled “Limitations for sites with existing branch subdomains” Once you add an automatic deploy subdomain for branch deploys, you cannot edit or change existing manual branch subdomains. You also cannot manually add new branch subdomains, but existing branch subdomains will still work. If you configured branch subdomains before enabling automatic deploy subdomains, both the branch subdomains and automatic deploy subdomains will resolve and be available. If both are set up, the Netlify UI, CLI, API, and deploy notifications will link to the automatic deploy subdomain by default. To make changes to your branch subdomain, you must remove the automatic deploy subdomain first. If you want to compare using branch subdomains with automatic deploy subdomains, check out our comparison docs for applying a custom domain to a branch deploy. Use a new custom domain for your automatic deploy subdomainSection titled “Use a new custom domain for your automatic deploy subdomain” By default, you can choose primary site domains that are also managed by Netlify DNS as your automatic deploy subdomain. You can also add additional subdomains to these domains, such as early-access or qa. If you want to use a custom domain that is not listed in the Netlify UI, you must first delegate this domain to Netlify DNS. Want to use a subdomain without bringing the apex domain to Netlify DNS? You can bring a subdomain to Netlify DNS without the apex domain. For example, you can delegate docs.company.com to Netlify DNS without also delegating company.com. Learn more about stand-alone subdomain support. To delegate a new domain to Netlify DNS, check out the steps in our docs on Configuring an automatic subdomain for deploys. Use the Netlify API to set automatic deploy subdomainsSection titled “Use the Netlify API to set automatic deploy subdomains” You can set automatic deploy subdomains when you create a site using the Netlify API. In your createSite request, use the following query parameters to pass the values to use for the branch_deploy_custom_domain Note that when you create or update a site with an automatic deploy subdomain, the build environment variable DEPLOY_PRIME_URL will update for all relevant deploys. Learn more about DEPLOY_PRIME_URL. Custom certificate requirementsSection titled “Custom certificate requirements” If you use a custom certificate for your site’s domains, that certificate must explicitly include any new subdomains used for automatic deploy subdomains. The standard wildcard syntax, such as *.company.com, does not cover this new subdomain. For example, your custom certificate will not work as expected in this have early-access.company.com as your automatic deploy subdomain, where early-access is the optional new subdomain you added in the Netlify UI you have a custom certificate with *.company.com as your wildcard domain but not *.early-access.company.com In this scenario, you must update your certificate to include the domains *.company.com, *.early-access.company.com so that early-access.company.com will work as expected. Remove an automatic deploy subdomainSection titled “Remove an automatic deploy subdomain” To remove an automatic deploy subdomain from your Deploy Previews or branch to Domain management > Automatic deploy subdomains. Select Edit custom domains. Next to Branch deploys or Deploy Previews, clear the Add custom domain checkbox. To confirm, select Save. Last 19, 2026 PreviousManage DNS recordsNextManage domains for a site app Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.467Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":4056}}277{"id":"doc-monitor_builds_netlify_docs-b0dc43db","source":"documentation","title":"Monitor builds | Netlify Docs","url":"https://docs.netlify.com/manage/monitoring/monitor-builds","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Monitoring & Insights Monitoring & Insights Overview Observability Overview Reference Content type Cache status Block reason Functions Edge functions HTTP method Status codes Status group User agent category Web analytics Overview How web analytics works Real user monitoring Lighthouse Log drains Logs Split testing Function metrics Monitor builds Status badges Notifications On this page Overview Current status Prioritize a build Historical insights Account usage insights Team usage summary More resources On this page Overview Current status Prioritize a build Historical insights Account usage insights Team usage summary More resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Monitoring / Monitor builds Copy page View as Markdown Copy as Markdown View as Markdown You can check your team’s current builds status and get insights into historical builds usage by visiting your team’s Builds tab. Current statusSection titled “Current status” On the main Builds page, you’ll find a list of all of your team’s builds and their current state such as completed, building, or capacity. Select any build to visit its detail page where you can examine the deploy log, cancel the deploy, and more. The Concurrent builds numbers show how much of your build capacity you’re currently using. If you have any builds that are enqueued awaiting capacity, there will be an alert message with details on how many builds are waiting for capacity. Prioritize a buildSection titled “Prioritize a build” This feature is available on Enterprise plans. If you have a build waiting in your team build queue that you would like to build sooner, team-wide Developers and Owners can prioritize the build so that it runs as soon as the next space opens in your team build capacity. To prioritize a build, go to your team Builds page and select the build you want to prioritize, then select Build next. After confirming your choice, the build will be marked , along with the name of the team member who prioritized it, and the time it was prioritized. The action is also tracked in the team audit log. Your prioritized build will begin when the next active build completes. If you would like the build to start immediately, you can cancel an active build to make room in your team build capacity. Only one build can be prioritized at a time. If any team member selects a new build to prioritize, it will replace the currently prioritized build. Historical insightsSection titled “Historical insights” Switch to the Usage & insights page for more information about your team’s builds usage. Here you’ll find data on how your build minutes have been used including the sites that have accrued the most build time. This data updates hourly. You will need to refresh your browser to load the updates. You can examine the Build minutes used per day and Number of builds per day charts to explore day-level details. In the Top sites chart, you can select the name of any site to visit the site’s dashboard. Account usage insightsSection titled “Account usage insights” You can find additional data about your team’s builds under Billing > Account usage insights. Learn more about usage and insights. Team usage summarySection titled “Team usage summary” For a quick summary of your team’s usage, go to your team’s Projects page and check out the usage metrics above your sites list. Select a metric widget to expand its details. On the Builds card, you can find a condensed list of the latest team builds and their current state. More resourcesSection titled “More resources” Learn more about concurrent builds and build minutes in our Billing doc. Visit our Forums for a verified Support Guide on optimizing what and how you build to reduce build queueing and make the most of your build minutes. You can even temporarily stop builds for a site if needed. Focusing these efforts on the Top sites revealed on the Usage & insights page is likely to have the most impact since those sites are accruing the most build time. Last 4, 2025 PreviousFunction metricsNextStatus badges Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.472Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1401}}278{"id":"doc-manage_dns_records_netlify_docs-b1d359a6","source":"documentation","title":"Manage DNS records | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/manage-dns-records","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Access your DNS records Add a DNS record Edit a DNS record Delete a DNS record Manage DNS records with the API Related resources On this page Overview Access your DNS records Add a DNS record Edit a DNS record Delete a DNS record Manage DNS records with the API Related resources For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Manage DNS records Copy page View as Markdown Copy as Markdown View as Markdown Manage the DNS records for domains using Netlify DNS. You can add records to connect external services like email providers, verify domain ownership, and configure subdomains. For domains using external DNS, manage your records through your DNS provider. Access your DNS recordsSection titled “Access your DNS records” To view and manage DNS records for a to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. Select the domain you want to manage DNS records for. This opens the domain's DNS panel. To expand details and view additional information, select the DNS record row. You can also download a CSV file of your DNS records by selecting Download records. Add a DNS recordSection titled “Add a DNS record” To add a new DNS your domain's DNS panel, scroll to the DNS records section. Select Add new record. Choose the record type from the dropdown menu. Fill in the required fields based on the record type you selected. Select Save to create the record. Propagation time DNS changes can take up to 48 hours to propagate across the internet, though most changes take effect within a few hours. Edit a DNS recordSection titled “Edit a DNS record” DNS records cannot be directly edited. To change a a new record with the updated values. Delete the old record. This approach prevents downtime by allowing both records to exist during the transition. Delete a DNS recordSection titled “Delete a DNS record” To delete a DNS your domain's DNS panel, find the record you want to delete in the DNS records section. Select the DNS record row to expand its details. Select Delete. Review the confirmation message and select Delete to confirm. Deleting NETLIFY records Do not delete NETLIFY or NETLIFYv6 records unless you want to disconnect your site from that domain. These records are automatically created when you assign a domain to a Netlify site. Manage DNS records with the APISection titled “Manage DNS records with the API” You can programmatically manage DNS records using the Netlify DNS records - List all records for a DNS zone Create DNS record - Add a new record Delete DNS record - Remove an existing record Related resourcesSection titled “Related resources” DNS records - Learn about supported DNS record types Set up Netlify DNS - Enable Netlify DNS for your domain Check DNS propagation - Verify your DNS changes have propagated Last 19, 2026 PreviousAssign a domain to your site appNextAutomatic deploy subdomains Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.473Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1329}}279{"id":"doc-manage_domains_for_deploy_previews_netlify_docs-ebcbddb2","source":"documentation","title":"Manage domains for Deploy Previews | Netlify Docs","url":"https://docs.netlify.com/manage/domains/manage-domains/manage-domains-for-deploy-previews","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview Understand your domain options Default URL for Deploy Previews Custom domain for Deploy Previews Why customize? Set up custom domain for Deploy Previews On this page Overview Understand your domain options Default URL for Deploy Previews Custom domain for Deploy Previews Why customize? Set up custom domain for Deploy Previews For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Manage Domains / Manage domains for Deploy Previews Copy page View as Markdown Copy as Markdown View as Markdown By default, Deploy Previews use the Netlify subdomain netlify.app with your site name but you can customize your Deploy Preview URL with an automatic deploy subdomain. Understand your domain optionsSection titled “Understand your domain options” You have a few options for the domain of your Deploy Preview if you use Netlify DNS. Default URL for Deploy PreviewsSection titled “Default URL for Deploy Previews” For example, Deploy Previews use a default Netlify subdomain, such as deploy-preview-#--mysitename.netlify.app, where # represents your pull or merge request. Custom domain for Deploy PreviewsSection titled “Custom domain for Deploy Previews” You can customize your Deploy Preview URL by setting up an automatic deploy subdomain, which is available with Netlify DNS. Netlify can generate a custom domain for all of your Deploy Previews and/or branch deploys when you set up an automatic deploy subdomain. Automatic deploy subdomains include a custom domain or subdomain that must be managed by Netlify DNS and an optional additional subdomain. Why customize?Section titled “Why customize?” Standardizing a custom subdomain for your Deploy Previews can unlock new ways of integrating deploys with your branding, review workflows, or security needs. We recommend automatic deploy subdomains for Core Pro plans and above with these want a custom domain for a Deploy Preview you want maximum flexibility with your custom domain to use certain tools that require a shared subdomain with your product site domain Set up custom domain for Deploy PreviewsSection titled “Set up custom domain for Deploy Previews” To set up a custom domain for your Deploy Previews, check out Automatic Deploy Subdomains. Last 1, 2025 PreviousManage domains for branch deploysNextManage multiple domains Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.473Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":1159}}280{"id":"doc-enable_ipv6_netlify_docs-aa88de52","source":"documentation","title":"Enable IPv6 | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/enable-ipv6","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / Enable IPv6 Copy page View as Markdown Copy as Markdown View as Markdown Enable IPv6 for your site or app to use the newer IP protocol, which has a range of benefits over the older IPv4 protocol. IPv6 is a newer protocol for how devices communicate over the internet. Among other differences, it uses a 128-bit address instead of the IPv4’s 32-bit address, supports more IP addresses, and is the process of replacing IPv4. By default, IPv6 is not enabled on all Netlify sites and apps. If you use Netlify DNS, you can enable it explicitly in your Domains dashboard. To enable IPv6 for your site or to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. Select the domain you want to enable IPv6 for and select Enable IPv6. Last 15, 2025 PreviousDNS recordsNextNetlify name servers Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.474Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":833}}281{"id":"doc-customize_project_name_and_cover_image_netlify_d-038aeba3","source":"documentation","title":"Customize project name and cover image | Netlify Docs","url":"https://docs.netlify.com/manage/projects/customize-project-name-and-cover-image","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Projects Projects How projects work Customize project name & image Find a project Organize projects Add new project Update project with Agent Runners Connect project to repo Monitor project activity Transfer a project Disable project Resume paused projects On this page Overview Customize project name Customize a cover image for your project On this page Overview Customize project name Customize a cover image for your project For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Projects / Customize project name and cover image Copy page View as Markdown Copy as Markdown View as Markdown Netlify autogenerates a name for your project when you first deploy. You can customize the project name and cover image on the Netlify dashboard to ease your project management and help you find your project. Customize project nameSection titled “Customize project name” To customize a project to your Project Overview dashboard, and select Customize, then choose Manage project name and cover image. Choose a meaningful name for your project. The project name determines the default URL for your project. For example, if your project name is pear-product-docs, then your Netlify default URL for your project will be https://pear-product-docs.netlify.app unless your team has customized subdomains enabled. Customize a cover image for your projectSection titled “Customize a cover image for your project” When you customize a cover image for your project, you're choosing how others will find your project in the Netlify dashboard. You can upload a custom image or Netlify can take a snapshot of your project and use it as a cover image. To customize a default image for your to your Project Overview dashboard, and select Customize, then choose Manage project name and cover image. Choose whether to upload an image or let Netlify upload an automatic snapshot of your project for you. Last 9, 2026 PreviousHow projects workNextFind a project Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.474Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":870}}282{"id":"doc-stripe_projects_netlify_docs-c56e593f","source":"documentation","title":"Stripe Projects | Netlify Docs","url":"https://docs.netlify.com/extend/install-and-use/setup-guides/stripe-projects","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Install & use Install & use Overview Extensions and integrations Build plugins Setup guides Netlify App for Slack Netlify Email integration Auth0 Contentful integration GPT action LaunchDarkly integration Optimizely Edge Delivery PlanetScale integration Supabase integration Stripe Projects On this page Overview Use cases Get started Authentication with Stripe Projects Learn more On this page Overview Use cases Get started Authentication with Stripe Projects Learn more For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Extend / Install And Use / Setup Guides / Stripe Projects Copy page View as Markdown Copy as Markdown View as Markdown Deploy your Stripe Project to Netlify and streamline your development workflow by provisioning and managing all your site's services from a single command line interface. OverviewSection titled “Overview” Stripe Projects simplifies provisioning and managing services for your app or site directly from the command line with the Stripe Projects CLI. This enables you or your AI agent to quickly set up and manage your project without leaving the command line. You or your agent can deploy your project to Netlify and keep it synced with other services your project needs. Use casesSection titled “Use cases” Provisioning and managing services for your app or site directly from the command line Keeping services up to date as your app evolves Connecting supported third-party services to your project without manually copying credentials between dashboards Easily adding payment processing capabilities to your application Learn more about the use cases that Stripe Projects helps with at Stripe Projects use cases recap. Get startedSection titled “Get started” These docs assume you are setting up a new Stripe Project and deploying it to Netlify. For the most up-to-date setup steps, supported services, and configuration options, check out Stripe’s Projects overview Create a Stripe account and install the Stripe CLI. Install or update the Netlify CLI. From your local project’s directory, create and initialize your app/site with Stripe projects init YOUR_PROJECT_NAME Link your existing Netlify account or create a new one, and create a new Netlify projects add netlify/project At this point, Stripe Projects has created a Netlify project linked to your account, but no content has been deployed to it yet. To deploy, prompt your AI agent to build your application and deploy it to Netlify. Once it does, your site will be live with the Stripe API key (and any other credentials Stripe Projects set up) already wired into your Netlify project’s environment variables — no manual configuration needed. Authentication with Stripe ProjectsSection titled “Authentication with Stripe Projects” While the Stripe CLI design allows for authentication using the email address of the Stripe account owner or the current user making API calls, Netlify only authenticates users using the user email address that is performing the CLI actions and not the Stripe Account owner. This ensures the 's integration with Stripe Projects does not authenticate on behalf of the Stripe account owner Stripe users creating accounts with Netlify do not create accounts that authenticate with a different user's email After you connect Stripe Projects to your Netlify project, credentials for any services Stripe Projects helps to set up are written to a .env file at the root of your project. If any of these credentials are used by your project, you will need to use the Netlify CLI or UI to manage these environment variables. Learn moreSection titled “Learn more” Stripe Projects documentation Extensions and integrations on Netlify Last 30, 2026 PreviousSupabase integrationNextOverview Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\nstripe projects init YOUR_PROJECT_NAME\n```\n\nExample:\n```text\nstripe projects add netlify/project\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.475Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":2,"totalLines":13,"estimatedTokens":1342}}283{"id":"doc-dns_https_troubleshooting_tips_netlify_docs-18dad69d","source":"documentation","title":"DNS & HTTPS troubleshooting tips | Netlify Docs","url":"https://docs.netlify.com/domains-https/troubleshooting-tips/","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview DNS configuration Inactive Netlify DNS zone Custom certificate not working for automatic deploy subdomain Certificates and HTTPS HTTPS error messages On this page Overview DNS configuration Inactive Netlify DNS zone Custom certificate not working for automatic deploy subdomain Certificates and HTTPS HTTPS error messages For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / DNS & HTTPS troubleshooting tips Copy page View as Markdown Copy as Markdown View as Markdown If you’re having trouble accessing your site at your custom domain or branch subdomain, there is likely a problem with your DNS or HTTPS setup. This page includes tips and information to help get things working properly. DNS configurationSection titled “DNS configuration” The dig command line tool is a great tool for quickly diagnosing and understanding DNS responses. It is built into Linux and Mac, but can also be installed on Windows. Alternatively, you can use an online tool to run dig in the browser. NS1, the DNS provider backing Netlify DNS, has a great series of articles on using DIG to test and troubleshoot your DNS configuration. Inactive Netlify DNS zoneSection titled “Inactive Netlify DNS zone” A common DNS configuration issue is an inactive Netlify DNS zone. This prevents our service from creating or updating the automatic Let’s Encrypt SSL certificates for your custom domain. This can cause problems for branch subdomains. For more information, visit our Forums for a verified Support Guide on how to detect and fix inactive Netlify DNS zones. Custom certificate not working for automatic deploy subdomainSection titled “Custom certificate not working for automatic deploy subdomain” If a custom certificate is not working for your automatic deploy subdomain, ensure your certificate includes any new subdomains used for automatic deploy subdomains. For example, for the automatic deploy subdomain early-access.company.com , your custom certificate should include the domains *.company.com, *.early-access.company.com and not just *.company.com. Learn more about custom certificates and automatic deploys subdomains. Certificates and HTTPSSection titled “Certificates and HTTPS” There are many reasons why adding a Netlify certificate or uploading a custom certificate might not work. The common causes are listed below, but if they don’t seem to apply to you or you have additional questions, our Support team will be happy to help out! Most importantly, you’ll need to configure the DNS for the custom domain before Netlify can issue a certificate for you. Netlify must validate the domain in order to provision the certificate, and this step cannot be completed until the DNS records for your custom domain are pointing to our servers. All previous DNS settings must have their cache timeouts expired. The TTL setting on a DNS record determines how long the record may be cached. This cache must expire before your new DNS settings can be validated for certificate provisioning. If your site is configured to go through another service (for example, using Cloudflare “accelerate and protect”, or similar), you need to disable that routing before we can provision the certificate. Netlify must handle TLS termination to be able to provision a certificate. It is possible that the name servers we use have some old cached values for your domain name. You can attempt to accelerate cache expiration for your domains using the Flush Cache tool provided by Google Public DNS. It is possible that we will get a certificate for one name (for example, petsofnetlify.com) and not for another (for example, www.petsofnetlify.com or some domain alias). In this case selecting Renew certificate should resolve the issue. If it doesn’t, please post in the Netlify Support Forums so our support engineers can repair the certificate. HTTPS error messagesSection titled “HTTPS error messages” You can check the status of your certificate in Domain management > HTTPS. If there is a problem with the certificate, you may find one of the error messages below. (We’re using petsofnetlify.com as an example.) “petsofnetlify.com doesn’t appear to be served by Netlify”Section titled ““petsofnetlify.com doesn’t appear to be served by Netlify”” In order to make sure that the site is served by Netlify, check the HTTP response headers. Examine the HTTP response headers in your browser’s dev tools, using an online checker, or with the following terminal -s -v http://your-newly-configured-hostname.com 2>&1 | grep -i server Check for a line that says Repeat this for each domain connected to your site. If your custom domain is the apex domain or www subdomain (for example, petsofnetlify.com or www.petsofnetlify.com), we automatically serve your site and provision a certificate for both domains, so be sure they both have records pointing to Netlify. The next steps depend on what you find in the HTTP response headers. If you do find in all response headers, but still receive this error, it may be caused by incorrect A records. For information on setting a proper A record with Netlify, refer to our documentation on external DNS configuration. If you don’t find in all response headers, and you’ve eliminated the common problem sources listed above, please contact support. “petsofnetlify.com is not resolvable with a resolver that validates DNSSEC”Section titled ““petsofnetlify.com is not resolvable with a resolver that validates DNSSEC”” Netlify DNS doesn’t support DNSSEC. To use Netlify DNS, disable DNSSEC with your domain registrar or previous DNS host. You can use tools like DNSViz to figure out where DNSSEC is currently enabled. To keep DNSSEC enabled, you can stop using Netlify DNS and use external DNS instead. Last 14, 2025 PreviousWhy Netlify DNSNextLock your domain Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\nExample:\n```text\ncurl -s -v http://your-newly-configured-hostname.com 2>&1 | grep -i server\n```\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.476Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":1,"totalLines":8,"estimatedTokens":2055}}284{"id":"doc-netlify_name_servers_netlify_docs-52052cc0","source":"documentation","title":"Netlify name servers | Netlify Docs","url":"https://docs.netlify.com/manage/domains/configure-domains/netlify-name-servers","text":"Netlify Docs Start Build Fundamentals Build with AI Configure builds Git workflows Environment variables Frameworks Post-processing User-Agent categories Primitives AI Gateway Serverless Functions Edge Functions Image CDN Blobs Database Caching Async Workloads Deploy Manage Accounts & Billing Projects Domains Data & Storage Security & access Monitoring & Insights Preview Servers Forms Visual Editor Routing & Redirects Extend Install & use Develop & share Netlify SDK for extensions Building code agents Framework adapter API Reference Error reference Netlify skills Request processing order CLI reference Netlify SDK for extensions Visual Editor reference APIs Netlify API Database API Frameworks API Cache API Blobs API Serverless Functions API Edge Functions API Dev Tool Guides API and CLI guides Terraform provider Command Palette Resources Troubleshooting Changelog Examples Migrate Support Checklists Release phases Enterprise credits AI Domains Domains Get started with domains Set up Netlify DNS Why Netlify DNS Troubleshooting tips Lock your domain Configure domains Add a domain alias Bring a domain to Netlify Configure an automatic subdomain for deploys Configure external DNS Delegate a standalone subdomain DNS records Enable IPv6 Netlify name servers Register and buy a domain Domains fundamentals Domains glossary Understand domains Manage domains Overview Add domain redirect Assign a domain to your site app Manage DNS records Automatic deploy subdomains Manage domains for a site app Manage domains for branch deploys Manage domains for Deploy Previews Manage multiple domains Transfer a domain Secure domains with HTTPS HTTPS SSL Troubleshooting Overview Check DNS propagation Troubleshoot SSL and HTTPS On this page Overview On this page Overview For the complete Netlify documentation index, see llms.txt. Markdown versions of any documentation page are available by appending .md to its URL. More flexibility and credits now available for Pro plans 🎉 Manage / Domains / Configure Domains / Netlify name servers Copy page View as Markdown Copy as Markdown View as Markdown Netlify’s name servers will vary depending on your domain. Learn how to find your name servers. To get a list of available name servers for your domain, you must first add a domain to your site or team. Next you can find Netlify’s available name servers for that domain in the Netlify domains dashboard. Go to your Netlify Team dashboard. From your project dashboard, in the top left, choose Projects next to your project name. Select DNS from the left sidebar. Select the specific domain you want to set up name servers for. From your domain dashboard, under Name servers, you’ll find a list of available name servers for your domain in a format simliar to dns1.p01.nsone.net. Last 15, 2025 PreviousEnable IPv6NextRegister and buy a domain Did you find this doc useful? Your feedback helps us improve our docs. Do not fill in this field Email (optional) What else would you like to tell us about this doc? I consent to being contacted regarding my feedback Send Netlify Careers Blog Terms Privacy Reading these docs with an AI agent? Append .md to any docs URL for its Markdown source, or start from the full llms.txt index. © 2026 Netlify Ask Netlify Help\n\n<|endofdoc|>","metadata":{"transformedAt":"2026-08-18T15:17:18.477Z","totalSectionsIncluded":1,"totalCodeBlocksIncluded":0,"totalLines":3,"estimatedTokens":818}}285