All Collections
Content Personalization
Change Website with Visual Editor
Change Website with Visual Editor

How to use Change Website action to change texts, visual aspects and content on your website with a Visual editor

Nir avatar
Written by Nir
Updated over a week ago

Change Website Action

Change website is a onsite personalization action which allows editing and changing elements of your web page. It allows you to easily change call for actions, images, edit styles, hide elements and more. The editing is done directly on your web pages with a visual editor.
โ€‹

To start Launch a 'Change Website' action

Click the Launch button to launch your website in a browser tab. Use the select box if you want to open the store resized to its mobile version. It will open on a separate browser window with smaller size.

Visual Editor

Your website will launch in a new browser tab with the floating visual editor.

If you want to change a different page, you may navigate to the page you want to change.

Step 1 - Selecting the element

Click the Select Element button. you will then be able to mark a section on the page with a mouse click

Step 2 - Editing the selected element


Once selected you will have a list of options such as:

You can select any of the options and manipulate the page. For example - changing the text:

Or changing color, font, text size and shifting to upper case:

You can change visibility, layout, borders, backgrounds, margins and more.


Step 3- After the edit

Once you're happy with the editing 'Click back to find mode' You will then see the list of elements which this rule edits. You can click an item on the list to find it on the page and continue editing it.

When you're done editing elements click 'Done Editing' button. The browser tab will close and you will be returned to the rule.


โ€‹

In the rule you can do one of the following:
* You can save and launch the rule to get the changes live.
* Launch the website again to continue editing.
* Undo part of the changes which you see in the changes list.

Mobile vs Desktop

In order to edit the mobile version of your store. you need to launch the store in mobile size browser to see the mobile version of the pages. You can do that with the select box near the launch button

Did this answer your question?