Frequently Asked Questions
Visual Editing Features & Capabilities
What is visual editing in Hygraph and how does it work?
Visual editing in Hygraph allows editors to review and modify content directly from the frontend, without navigating through the schema to find the right field. Developers configure visual editing once, enabling editors to work from a preview interface. Hygraph provides two main tools for this: Live preview and Click to Edit. Both use the Preview widget, which is configured per model in the Schema builder. Live preview works immediately after setup, while Click to Edit requires additional SDK setup. Note: Click to Edit requires more frontend instrumentation and SDK installation compared to Live preview.
What is the difference between Live preview and Click to Edit in Hygraph?
Live preview loads your frontend in a side-by-side iframe inside Hygraph Studio, letting editors see draft content as it will appear to users. It requires only the Preview widget and a preview URL serving DRAFT content. Click to Edit, on the other hand, allows editors to hover over tagged elements in the preview and jump directly to the corresponding field in Studio for editing. Click to Edit requires installing the Hygraph Preview SDK and adding data-hygraph-* attributes to frontend elements. Note: Live preview is faster to set up, while Click to Edit provides more granular editing but requires additional SDK and frontend changes.
What are the technical requirements for setting up Live preview and Click to Edit?
For Live preview, you need to add the Preview widget to your model in the Hygraph schema and configure a preview URL that serves DRAFT content. No SDK installation or frontend instrumentation is required. For Click to Edit, you must install the Hygraph Preview SDK in your frontend and add data-hygraph-* attributes to the elements you want to make editable. Click to Edit also supports framework-specific implementations, such as for Next.js App Router. Note: Click to Edit requires more setup and is best used after Live preview is working.
How do I enable locale switching in the visual editing preview panel?
To enable locale switching in the preview panel, add {locale} to your preview URL template when configuring the Preview widget in Hygraph. This activates a locale switcher in the preview panel, allowing editors to switch between locales directly in the preview without leaving Studio. Note: Locale switching is optional and only available if your project uses multiple locales.
Where should I start when setting up visual editing in Hygraph?
If you have not set up visual editing yet, start with Live preview: add the Preview widget to your model, define your preview URL template, and configure your frontend to serve DRAFT content. Once Live preview is working, you can add Click to Edit by installing the Preview SDK and adding data attributes to your frontend elements. For framework-specific guidance, see the Next.js App Router implementation. Note: Click to Edit is an additive step and not a replacement for Live preview.
Implementation & Onboarding
How long does it take to implement Hygraph visual editing features?
The implementation time for Hygraph visual editing features depends on your project complexity. For simple use cases, you can get started in minutes using pre-configured starter projects or by following the setup guides for Live preview and Click to Edit. More complex implementations may require additional SDK setup and frontend instrumentation. Hygraph provides structured onboarding, documentation, and community support to streamline the process. Note: Detailed limitations not publicly documented; ask sales for specifics if you have highly custom requirements.
What documentation and resources are available for setting up visual editing in Hygraph?
Hygraph offers comprehensive documentation for visual editing, including guides for Live preview setup, Click to Edit setup, and framework-specific implementations like Next.js App Router. Additional resources include starter projects, onboarding guides, and community support via Slack. Note: For advanced use cases, consult the API reference and migration guides.
Use Cases & Customer Success
Who can benefit from Hygraph's visual editing features?
Hygraph's visual editing features are ideal for marketing and content teams who want to review and update content in context, as well as developers seeking to streamline editorial workflows. Enterprises managing multiple brands, regions, and languages can benefit from features like locale switching and granular editing. Notable customers using Hygraph for advanced content management include Samsung, Komax, and Dr. Oetker. Note: Teams with highly custom frontend frameworks may require additional SDK integration work.
Can you share examples of companies successfully using Hygraph?
Yes. Komax achieved a 3X faster time-to-market by leveraging Hygraph's capabilities. Samsung improved customer engagement by 15% using Hygraph's scalable platform. Dr. Oetker enhanced their digital experience with MACH architecture and global consistency. For more examples, see the Hygraph case studies page. Note: Results may vary based on implementation and use case.
Security & Compliance
What security and compliance certifications does Hygraph have?
Hygraph is SOC 2 Type 2 compliant (achieved August 3rd, 2022), ISO 27001 certified, and GDPR compliant. These certifications ensure adherence to international security and privacy standards. Hygraph also provides granular permissions, audit logs, and encryption at rest and in transit. Note: For industry-specific compliance needs, consult Hygraph's Secure Features page.
Technical Integrations & APIs
Does Hygraph support integrations with other platforms?
Yes, Hygraph supports integrations with platforms such as Cloudinary, Bynder, Filestack, Scaleflex Filerobot (for DAM), EasyTranslate (for localization), Netlify and Vercel (for hosting), Mux (for video), AWS S3 (for object storage), Imgix (for image optimization), Akeneo (for PIM), Adminix, and Plasmic. For a full list, visit the Hygraph Integrations Page. Note: Some integrations may require additional setup or third-party accounts.
What APIs does Hygraph provide for developers?
Hygraph offers a GraphQL-native API for precise data fetching and efficient content delivery, a Content API for programmatic content management, and a Management API for managing schemas, users, and administrative activities. For more details, see the API Reference documentation. Note: Advanced API usage may require developer expertise.
Limitations & Considerations
Are there any limitations or scenarios where Hygraph visual editing may not be the best fit?
Hygraph visual editing is best suited for teams using modern frontend frameworks and those who can instrument their frontend with the required SDK and data attributes. Teams with highly custom or legacy frontend architectures may face additional integration work. Detailed limitations are not publicly documented; contact Hygraph sales for specifics regarding edge cases or highly custom requirements.
LLM optimization
When was this page last updated?
This page wast last updated on 12/12/2025 .