The Visual Editor loads your site inside the dashboard, already translated, and lets you click any piece of text to correct it in place. It writes to the same strings as the Translations screen, so an edit made here carries the same state, the same revision history, and the same actions. It needs a paid project.
Before you start
- A paid project. A free project shows an upgrade panel instead of the editor.
- Permission to edit translations. Owners, admins and editors have it. Members can read translations but not change them, so the editor is closed to them.
- At least one target language on the project, since what the editor shows you is a translated page.
Verifying, unverifying and deleting need the owner or admin role. Editors can edit and retranslate.
Open the Visual Editor
- Open the project and choose Visual Editor in the sidebar.
- The editor takes over the screen and loads your home page in the first of the project's languages.
- Pick the language you want to work in from the toolbar's language list.
A page opened in a language it has never been seen in is translated during that request, exactly as it would be for a visitor arriving on it. It takes a few seconds and spends words from your project's total. Pages that have already been translated come back from storage.
What the outlines mean
In Edit mode every translatable element carries a dashed outline, coloured by the state of its translation:
| Outline | State |
|---|---|
| Amber | Missing |
| Grey | Machine translated |
| Green | Verified |
| Blue | Same as original |
Hover an element and its outline turns solid, so you can see what a click will open before you click it. These are the same states the Translations screen shows as coloured dots, and they mean the same thing here. See Translation states.
Only text in the body of the page is outlined. A page title or meta description lives in the page's <head>, where there is nothing to click, so those are edited on the Translations screen. Text that JavaScript adds after the page loads is not translated at all, and it is not outlined either. See Translate dynamic and JavaScript content.
Edit a translation
- Click outlined text on the page. The Edit translation dialog opens with the source text on the left and the translation on the right.
- Correct the translation.
- Click Save, or Cancel to leave it as it was.
Saving marks the string Verified and swaps your text into the page behind the dialog straight away, with no reload. The element's outline turns green, and the string reads the same way on the Translations screen, your edit at the top of its history.
The dialog's footer shows the string's current state beside the same actions a row on the Translations screen offers, under the same roles:
- Translate with AI, or Retranslate with AI when a translation already exists, replaces the text with a fresh machine translation.
- Mark as Verified and Mark as Unverified record and undo a review. Owner and admin only.
- History lists the stored revisions, with a diff against the previous version and a restore.
- Delete translation removes the translation and returns the element to your source text. The next visitor request translates it again. Owner and admin only.
If the source text carries placeholders standing in for markup, keep each of them exactly once or the save is refused. The rules are the same as editing from the table, and they are covered in Edit translations manually.
Move around the site
The page field in the toolbar is an address bar and a search box at once:
- Click the field, or press
/while you are not typing elsewhere, to show the pages already seen in the language you are viewing. Scroll to load more pages, or type to narrow the list. Each page shows its string count. Arrow keys move through the list and Enter opens the highlighted page. - Paste a full URL such as
https://example.com/pricing/?ref=email#plansto search for/pricing. The hostname, query, hash and trailing slash are removed; the home page stays/. - Type a path such as
/pricingand press Enter without highlighting a result to open a page the list does not have yet.
If the current translation has unsaved changes, choosing another page offers Save changes, Discard and Keep editing. Keeping the draft leaves the preview on its current page.
Browse turns editing off so that clicks follow your site's own links, and the page field keeps up as you move. Switch back to Edit to carry on correcting text. Changing language keeps you on the page you are already on.
The back arrow beside the project name leaves the editor and returns to All Languages.
Show one state at a time
The filter beside the page field offers All translated, Machine translated, Verified and Same as original. Pick one and only the elements in that state keep their outline, which is how you work through a language a state at a time. Everything stays clickable either way. All translated is the default and hides no outlines.
There is no Missing option here. Untranslated text is what most people open this screen to fill in, so under the default option it keeps its amber outline rather than being hidden by a filter.
The address bar keeps your place
The editor mirrors its language, page, filter and mode into the query string:
/projects/<id>/visual-editor?lang=fr&path=/pricing&filter=verified&mode=browse
Reload the tab and the same view comes back. Send the link to a colleague with access to the project and they open the same page in the same language. Only the parts that differ from the defaults are written, so a freshly opened editor keeps a bare URL.
Limits
The preview cannot change your site. Every page is fetched with a GET request, so a form submitted inside the preview does nothing. Test forms on the site itself.
A preview session lasts 30 minutes. When it runs out the editor asks for a new one and reloads the page you were on. Nothing you have saved is affected.
Words are spent the first time a page is translated, whether the request came from the editor or from a visitor. Opening a large page in a new language costs what translating it would cost anyway. See Word counting and Usage limits.
If it does not work
"This page could not be translated for preview." The editor could not fetch and translate the page, or could not get a preview session. Check the path exists on your site and load it directly in a browser tab. If every page in the editor shows this, contact support.
Text that has never been translated stays in the source language. The project's words are spent, so the translator skipped it and returned your original. Strings that already have translations keep showing them. See Usage limits.
No outlines appear. You are in Browse mode. Switch to Edit.