To launch the editor mode, open a new tab in your browser and enter your application's URL. When your application is loaded, click on the Edit button in the extension popup.
You should see the content selector:
The editor allows you to edit:
Select the item you want to edit or click on the New button and create it from scratch. We will be using a tour as an example in this article.
When you select or create something to edit, the editor will load the bottom panel. In our case, we created a new tour:
This panel shows:
For an empty tour, click on the Add first step button. If you already have steps, a plus button will appear between steps to allow you to add more. The card/hint type selector will appear as shown below:
You can start from scratch by clicking one of the top buttons. If you select Highlight element (or a Hint), the next step is to choose a target element by clicking on it in your application.
We have also prepared a few useful card templates for you.
Custom events have no visual representation, so when adding a new event, you will go directly into the Highlight element mode.
In the bottom panel, you can:
When you click on the card name, the card and the item editor panel will appear:
The card is editable, allowing you to put your content directly into the card. The main panel holds plenty of options you can adjust.
For example, you can change the backdrop of your card, adjust the position or size, or use any of the advanced settings, such as Advance when the element is not found.
The top of the editor has the following actions:
When you are done with your content changes, click on the green Save button in the bottom panel. If you want to publish or push changes to your end users, click on the Publish/Push changes button.
For more actions, switch to the Product Fruits administration.