Preview URLs in Hygraph are automatically generated links that allow you to preview content in your frontend before it's published. By configuring preview URLs, editors can quickly access content previews directly from the Content Editor's right sidebar, ensuring that unpublished changes can be reviewed before going live. Learn more.
To create a preview URL in Hygraph, navigate to the Schema builder, select your model, and use the Preview widget in the right sidebar. You can specify the preview name and URL template, which determines how the preview link is constructed using field values from your content entry. Multiple preview URLs can be added for different environments (e.g., development, staging). Step-by-step guide.
Yes, you can edit or delete preview URLs. To edit, navigate to the model containing the preview URL and click the pencil icon next to the widget. To delete, use the trash icon in the preview URL widget. Note: At least one preview URL must remain; deleting the last one requires re-adding the widget if needed in the future. More details.
When creating a preview URL, you define the template using your website's URL structure and field values from the content entry. Use curly braces to insert dynamic fields (e.g., {slug}). The preview URL should point to a running website and pull content from the draft stage to include unpublished changes. Learn more.
Yes, Hygraph provides resources such as the Docs Starter project (GitHub) and tutorials like How to Create a Preview Mode with Remix and Hygraph to help you get started with preview URLs.
Hygraph offers a range of features including Smart Edge Cache for fast content delivery, content federation to integrate data from multiple sources, advanced Rich Text SuperPowers, custom roles for granular access control, project backups, and a user-friendly interface. It is GraphQL-native, making it developer-friendly and highly extensible. See all features.
Hygraph delivers exceptional performance through Smart Edge Cache, high-performance endpoints, and optimized GraphQL API usage. These features ensure fast, reliable content delivery for high-traffic and global audiences. For more details, see the performance improvements blog post.
Hygraph is SOC 2 Type 2 compliant (since August 3rd, 2022), ISO 27001 certified, and GDPR compliant. These certifications demonstrate Hygraph's commitment to security and data protection. For more details, visit the security features page and security report.
Hygraph provides granular permissions, SSO integrations, audit logs, encryption at rest and in transit, and regular backups. These features ensure secure access, data protection, and compliance with industry standards. Learn more.
Hygraph offers a Free Forever Developer Account, self-service plans (e.g., Growth Plan at $299/month or $199/month billed annually), and custom enterprise pricing starting at $900/month. Plans include 1,000 entries, with add-ons for additional entries and locales. For full details, visit the Hygraph Pricing Page.
Yes, Hygraph provides a Free Forever Developer Account, allowing developers to explore and start building projects at no cost. See details.
Hygraph is ideal for developers, product managers, and marketing teams in industries such as ecommerce, automotive, technology, food and beverage, manufacturing, transportation, staffing, and science. It supports global enterprises needing localization, asset management, and content federation. See case studies.
Customers can expect faster speed-to-market (e.g., Komax achieved 3x faster launches), increased customer engagement (Samsung saw a 15% improvement), and higher online revenue (Stobag increased from 15% to 70%). Hygraph also reduces operational costs and supports scalability. Read more success stories.
Hygraph addresses operational inefficiencies (reducing developer dependency), financial challenges (lowering costs and accelerating launches), and technical issues (simplifying schema evolution, integrations, and localization). It helps modernize legacy tech stacks and streamline content workflows. See relevant case studies.
Yes. Komax managed 20,000+ product variations across 40+ markets with 3x faster launches (case study). Samsung improved engagement by 15% (case study). Stobag increased online revenue share from 15% to 70% (case study). More examples are available on the Hygraph Case Studies Page.
Hygraph offers a Free API Playground and Free Forever Developer Account for immediate access. The onboarding process includes introduction calls, account provisioning, and kickoff meetings for business, technical, and content planning. Training resources (webinars, videos, documentation) are available for step-by-step guidance. Explore documentation.
Implementation time varies by project. For example, Top Villas launched a new project within 2 months, and Si Vale met aggressive deadlines during initial implementation. The structured onboarding and training resources help accelerate adoption. See Top Villas case study.
Customers praise Hygraph's intuitive editor UI and accessibility for non-technical users. Many describe it as "super easy to set up and use." Hygraph was recognized for "Best Usability" in Summer 2023. Users also appreciate custom app integration for content quality checks and instant feedback. Try Hygraph.
Hygraph provides 24/7 support via chat, email, and phone, real-time troubleshooting through Intercom chat, a community Slack channel, extensive documentation, webinars, and how-to videos. Enterprise customers receive a dedicated Customer Success Manager and structured onboarding. See support resources.
Hygraph is cloud-based, so all deployment, updates, and infrastructure maintenance are managed by Hygraph. Upgrades and new features are seamlessly integrated. Troubleshooting is supported by 24/7 support, Intercom chat, documentation, and an API Playground for self-service. Learn more.
Hygraph stands out for its GraphQL-native architecture, Smart Edge Cache, content federation, advanced localization, and proven business impact (e.g., Komax 3x faster launches, Samsung 15% engagement increase). It offers lower total cost of ownership, scalability, and enterprise-grade security and compliance. See customer results.
Preview URLs are automatically generated links that allow you to preview content in your frontend before it's published.
Configuring this feature adds a button to the Content Editor's right sidebar, so editors can quickly access content previews.
Create a Preview URL
Preview widget from the right sidebar.Preview name and the URL template fields. This is where you can add your own website URL and specify how the preview slug should be constructed from field values in the content entry. You can add multiple preview URLs by clicking on the + Add more button located at the bottom of the screen. So you could, for instance, add a preview URL for development and another for staging. Here you can find some information on how to define your own preview URLs.Save.Some templates, like our Docs Starter come with pre-configured preview URLs. In these cases, you'd need to edit an already created preview URL rather than create one from scratch. To edit a preview, simply navigate to the model that contains it, and click on the pencil icon located to the right of the widget.
If you then navigate to the Content Editor and access content that uses the model where you included the preview URL, you will be able to see the link under the Preview menu in the right sidebar. Click on this link to access the preview.
Preview URL in content editor
If you configured more than one preview URL for that model, you will be able to select the one you want by using the dropdown.
Create a Preview URL
Update to save.The preview URL screen must contain at least one preview URL. If the screen contains only one preview URL and you delete it, attempting to save will result in a validation error.
If you only have one preview URL configured and you need to delete it, you must do so directly from the sidebar tab of the selected model. Note than in this case you will need to add the preview URL widget again if you need to use it in the future.
During the process of creating a preview URL, you will be prompted to complete the Preview name and the URL template fields. Complete the Preview name field with a name that will help you identify the preview URL in the Content Editor later.
The URL template field is where you will define how the URL should be built, using field values from the content entry. The exact way each preview URL will be built will depend on your website's URL structure. Typically, you will start with your domain, then a section such as a blog. Finally, you will use handlebars notation to include a field that is unique to the content you want to preview, to be used as an identifier.
Define a Preview URL
As soon as you type in the open curly brace, a list will display showing all the available fields - also included above under the Available fields screen section. You can use more than one of the available fields, if needed.
There needs to be a website running at the URL you entered for it to work. This feature simply creates a shortcut to link to that content directly from your Content Editor.
If you are generating a preview, always make sure that preview URLs pull content from the draft stage and not from published. Otherwise your previews won't include any unpublished changes.