LogoLogo
Webstudio Home
  • Basics
    • 👋Welcome
    • 🔥Intro
    • 🎓Building your first site
    • 🤓Courses
    • 🔗Roadmap & Links
    • ❓FAQs
  • NEWS
    • 🆕April Update
    • 🆕December Update
    • 🆕September Update
    • 🆕Webstudio CMS Beta and Experts Network
  • university
    • ⚛️Foundations
      • 🛠️Anatomy of the Webstudio Builder
      • 🧱CSS Variables
      • 🖌️Design Tokens
      • 🔡Data Variables
      • ➕Expression Editor
      • Animations
      • 💾CMS
      • ↔️Copy-Paste
        • ↔️CSS
        • ↔️Markdown
        • ↔️Webflow
      • Commands & Search
      • 🎯SEO Settings
      • Shortcuts
      • ⚙️Project Settings
      • Modes
      • Share Links & Transferring Projects
      • 🌐Publishing & Custom Domains
    • 🧩Core Components
      • 📦Box
      • 🔗Link
      • 🖼️Image
      • 📃List
      • ⌨️HTML Embed
      • Animation Group
      • Text Animation
      • Video Animation
      • Stagger Animation
      • ✍️Webhook Form
      • ✍️Form
      • ⏯️Vimeo
      • ▶️Vimeo Background Video
      • YouTube
      • 💬Blockquote
      • 🔲Slot
      • Head Slot
      • ➖Separator
      • 📄Code Text
      • 🔘Button
      • 💾Collection
      • 🪜Content Embed
      • 🪜Markdown Embed
      • Content Block
      • 📘XML Node
    • ▫️Radix UI Components
      • Accordion
      • Collapsible
      • Dialog
      • Navigation Menu
      • Popover
      • Radio Group
      • Select
      • Sheet
      • Switch
      • Tabs
      • Tooltip
    • Marketplace
    • 🤖Webstudio AI
    • 📤Self-Hosting
      • ▶️CLI
      • ▶️Download
      • ▶️Cloudflare Pages
      • ▶️GitHub Pages
      • ▶️Netlify
      • ▶️Vercel
      • ▶️AWS with Flightcontrol (Docker)
      • ▶️Digital Ocean with Coolify (Docker)
      • ▶️Hetzner with Coolify (Docker)
    • 🧑‍🏫How-Tos
      • ▶️How to add icons
      • ▶️How to create fluid video backgrounds with Vimeo
      • ▶️How to create a countdown
      • ▶️How to crop an image with out cropping the original image
      • 🍀How to add a GSAP animation
      • ▶️Build Your Own Directory Website with Airtable
      • ▶️Using filters to dynamically display content (Airtable example)
    • 🔗Integrations
      • How to build a frontend for Hygraph using Webstudio
      • How to build a frontend for Airtable using Webstudio
      • How to build a WordPress frontend using Webstudio (no-code builder)
      • How to integrate a Notion database with Webstudio
      • How to integrate Webhook Form with Pabbly
      • How to integrate Webhook Form with Zappier
      • How to integrate Webhook Form with N8N
      • How to integrate a Webhook Form with Airtable
      • How to integrate Flotiq with Webstudio
    • Craft
  • Contributing
    • 🧑‍🎨Contributing for Designers
    • 🧑‍💻Contributing for Developers
    • Contributing to the Marketplace
  • ⚠️Errors
    • ▶️Connecting your Hostinger Domain to Webstudio
    • 🔌Worker not found
    • 🌮AppSumo redemption failed
  • Misc
    • 📊Account Limits
    • 🆘Webstudio Support Process
    • Fixing overflow issues
Powered by GitBook
On this page
  • ✅ SEO Features
  • 🌐 Global Site Settings
  • 🔍 Individual Page SEO Settings

Was this helpful?

Edit on GitHub
  1. university
  2. Foundations

SEO Settings

Webstudio provides comprehensive SEO features.

PreviousCommands & SearchNextShortcuts

Last updated 3 months ago

Was this helpful?

✅ SEO Features

  • Meta title

  • Meta description

  • Open graph

  • Semantic tags

  • Image alt text

  • All meta fields

  • Sitemap

  • Custom sitemap

  • No index

  • Default canonical with the ability to

  • Customizable head (global and )

  • Auto exclude no index from sitemap

  • Robots.txt

  • SSL

  • 301 redirects

  • 302 redirects

  • Site

  • WebSite structured data

  • Href lang tag

  • Auto image conversion (performance)

  • Auto image compression (performance)

  • Auto set image width and height (CLS)

  • Image lazy & eager loading options (performance and LCP)

  • Aria labels

  • Link rel

  • Favicon

  • All attributes

🌐 Global Site Settings

  • Site Name: Used to output WebSite structured data to clearly define your website's identity.

  • Favicon: Output your logo in search engines, browser tabs, and more.

These settings ensure uniformity and brand coherence across all pages of your website.

🔍 Individual Page SEO Settings

Fine-tune SEO settings for each page through the 'Pages' tab:

  • Title & Description: Craft unique titles and descriptions for each page, enhancing search engine visibility.

  • SEO Previews: Visualize how your pages will display in search results and on social media.

  • Exclude from Search Results: Opt to hide (no index) specific pages from search engines. No indexing the content will also remove it from the sitemap.

  • Social Sharing: Set engaging images for social media sharing, complete with previews.

The social image you add to your homepage will be used as the cover image for the project on the dashboard.

  • Custom Meta Tags: Add additional Meta Tags your page for further search and social customization.

In '' under the Webstudio menu, you'll find essential settings for your entire project:

Custom Header Code: Global field to output scripts in the head. For modifying the head on a per-page basis, see .

Custom Head: Visually customize the head on a per-page basis with .

⚛️
🎯
Project Settings
Head Slot
Head Slot
customize it
per page