MultiLipi’s Visual Editor is designed to help you fine-tune the appearance and wording of your translated pages—without writing a single line of code. It offers real-time, WYSIWYG-style editing with options to change font, style, CSS, and screen-specific layouts like desktop, tablet, and mobile.

Steps to Use the Visual Editor

 

1. Open Your Project Dashboard

Navigate to your MultiLipi dashboard and select the project you want to customize.

Screenshot of MultiLipi dashboard showing navigation menu with “URLs” highlighted under “Translations”.

2. Go to "URLs" under "Translations"

Click on the URLs tab under the Translations section. This opens a list of translated paths associated with your domain.Screenshot section with the list of domain paths and the visual editor icon highlighted.

 

3. Click the Visual Editor Icon

On the right-hand side of each URL row, click the visual editor icon (the brush inside a square) to launch the real-time editor for that page.Screenshot where multilipi virtual editor opens its editing tool and publishing panel.

What You Can Customize

Once the editor loads, you’ll have access to a wide range of customization tools at the top of the screen.

 

4. Switch Between Devices

Easily preview and adjust how your translations appear across Desktop, Tablet, and Mobile using the device dropdown.Dropdown menu in the visual editor showing device selection options: Desktop, Tablet, and Mobile.

5. Edit CSS for Styling

Click the “Edit CSS” button to write custom CSS that modifies the style of your translated content without changing your original layout.Edit CSS button highlighted in the MultiLipi visual editor toolbar.

6. Add Google Fonts CSS

Want a different font for translated content? Paste your Google Fonts link into the “Add Font CSS” option.

Popup box in MultiLipi visual editor prompting the user to paste a Google Fonts CSS link.

7. Publish Your Changes

Once you're satisfied with the edits, click the Publish button on the top right to instantly update the live translated page.

Visual editor showing toolbar with the Publish button on the right and active editing on a translated blog post.
Why Use the Visual Editor?

 

  • No coding required – Intuitive interface for non-technical users

  • Real-time preview – See how translations appear live
  • Full control – Customize fonts, layouts, and styles by language or device
  • Seamless publishing – Apply edits instantly

Have questions or feedback about the Visual Editor? Contact our support team, we're here to help!