Click to Edit allows users to click any element in the live preview to jump directly to that field in the entry form. This streamlines the editing process by reducing navigation time and making content updates more intuitive. Note: Click to Edit requires developer configuration and may not be available for all fields unless specifically set up.
In Hygraph Studio, the preview loads side-by-side with the entry form. Users can hover over elements in the preview, and an Edit button appears on fields configured as editable. Clicking Edit scrolls to and focuses the corresponding field in the entry form, allowing changes to be made and previewed. The preview updates after saving, not while typing, unless live field updates are enabled. Note: Live field updates require additional developer configuration.
Yes, if your developer has configured standalone mode, Edit buttons appear directly on your preview site in a regular browser tab. Clicking Edit navigates you to the correct field in Studio without affecting other entries or content. Note: Standalone mode setup is required and may not be available by default.
When previewing a locale, clicking Edit opens the correct field in Studio in the default locale. Users must manually select the target locale field after the field opens. The locale switcher in the preview panel helps open previews for specific locales. Note: Editing localized fields requires manual selection and may not be fully automated.
Click to Edit requires your developer to install the Hygraph Preview SDK, add the necessary markup to your frontend, and configure a Preview widget and preview URL for your content model. If Edit buttons do not appear, the SDK setup may be incomplete. Note: Developer involvement is necessary for initial setup and ongoing configuration.
If Edit buttons do not appear, verify that the Preview SDK is installed and wrapping your page content correctly. If the Edit button appears but nothing happens, check that your browser allows new tabs (required for standalone mode). If the preview does not refresh after saving, confirm you used Save & Preview and check the save callback configuration. If the preview panel is blank or shows a security error, ensure your site allows iframe embedding by checking X-Frame-Options and Content-Security-Policy headers. Note: Some issues may require developer intervention.
Developers must install the Hygraph Preview SDK, add markup to the frontend, and configure a Preview widget and preview URL for the content model. Editable fields must be explicitly configured; not all fields are editable by default. Note: Ongoing developer support may be needed for changes or troubleshooting.
By default, the preview updates after saving changes, not while typing. If your team has enabled live field updates, changes appear in the preview immediately as you type. Ask your developer if live field updates are configured. Note: Live updates require additional setup and may not be available in all environments.
Click to Edit is designed for content editors, marketers, and product teams who need to quickly update content in a live preview environment. It reduces navigation time and streamlines workflows, especially for teams managing frequent content updates. Note: Teams with limited developer resources may face setup challenges.
Click to Edit can accelerate content updates, reduce time-to-market for campaigns, and improve operational efficiency by enabling editors to make changes directly from the preview. This feature is particularly valuable for teams managing multi-locale content or frequent updates. Note: The impact depends on proper developer setup and ongoing maintenance.
Implementation depends on developer involvement. For simple use cases, setup can be completed quickly using Hygraph's documentation and starter projects. For more complex scenarios, structured onboarding and technical support are available. Note: Teams without developer resources may require additional assistance.
Comprehensive guides are available at Click to Edit documentation, including prerequisites, troubleshooting, and advanced usage. Additional resources include guides on Live Preview, Edit Content, and Content Stages. Note: Documentation is regularly updated; check for the latest information.
Click to Edit only works for fields that developers have configured as editable. If a field is missing an Edit button, it must be added by a developer. The content entry form is always available as a fallback. Some features, such as live field updates and localization, require additional setup and may not be fully automated. Detailed limitations not publicly documented; ask sales or support for specifics.
This page wast last updated on 12/12/2025 .
Click to Edit lets you click any element in the live preview to jump directly to that field in the entry form.
Click to Edit requires your developer to have installed the Hygraph Preview SDK and added the necessary markup to your frontend and configured a Preview widget and preview URL for your content model.
If you open a live preview and no Edit buttons appear anywhere in the preview, the SDK setup is incomplete. Ask your developer to verify the setup.
Edit buttons do not appear on every field. Developers choose which elements to configure as editable, such as titles, descriptions, hero images, and the blocks editors touch most. If a field you frequently update is missing a button, ask your developer to add it; the content entry form is always there as a fallback.
Studio loads the preview in a side-by-side panel alongside the entry form.
The preview holds your scroll position when it refreshes, so you stay oriented in the page as you edit.
The preview refreshes after you save, not while you are typing. If your team has enabled live field updates, changes appear in the preview immediately as you type. Ask your developer if you are unsure which is configured.
If your developer has configured standalone mode, the Edit buttons appear directly on your preview site in a regular browser tab, outside Studio. Clicking Edit navigates you to the correct field in Studio without any risk of affecting other entries or content.
Clicking Edit while previewing a locale opens the correct field in Studio in the default locale. Select your target locale field manually after the field opens.
After you open live preview, follow these steps to edit the field for the target locale:
The Preview SDK is not installed or is not wrapping your page content correctly. Ask your developer to verify the setup.
Check that your browser is not blocking new tabs. In standalone mode, Studio opens in a separate tab. Confirm your browser allows this from your preview site.
Confirm you used Save & Preview instead of Save. If the preview still does not update, ask your developer to check the save callback configuration.
Your site is blocking iframe embedding. This is a server configuration issue, not a content issue. Ask your developer to check the X-Frame-Options and Content-Security-Policy headers on your frontend.
Click to Edit lets you click any element in the live preview to jump directly to that field in the entry form.
Click to Edit requires your developer to have installed the Hygraph Preview SDK and added the necessary markup to your frontend and configured a Preview widget and preview URL for your content model.
If you open a live preview and no Edit buttons appear anywhere in the preview, the SDK setup is incomplete. Ask your developer to verify the setup.
Edit buttons do not appear on every field. Developers choose which elements to configure as editable, such as titles, descriptions, hero images, and the blocks editors touch most. If a field you frequently update is missing a button, ask your developer to add it; the content entry form is always there as a fallback.
Studio loads the preview in a side-by-side panel alongside the entry form.
The preview holds your scroll position when it refreshes, so you stay oriented in the page as you edit.
The preview refreshes after you save, not while you are typing. If your team has enabled live field updates, changes appear in the preview immediately as you type. Ask your developer if you are unsure which is configured.
If your developer has configured standalone mode, the Edit buttons appear directly on your preview site in a regular browser tab, outside Studio. Clicking Edit navigates you to the correct field in Studio without any risk of affecting other entries or content.
Clicking Edit while previewing a locale opens the correct field in Studio in the default locale. Select your target locale field manually after the field opens.
After you open live preview, follow these steps to edit the field for the target locale:
The Preview SDK is not installed or is not wrapping your page content correctly. Ask your developer to verify the setup.
Check that your browser is not blocking new tabs. In standalone mode, Studio opens in a separate tab. Confirm your browser allows this from your preview site.
Confirm you used Save & Preview instead of Save. If the preview still does not update, ask your developer to check the save callback configuration.
Your site is blocking iframe embedding. This is a server configuration issue, not a content issue. Ask your developer to check the X-Frame-Options and Content-Security-Policy headers on your frontend.