Single-page application (SPA) support in the web editor
Learn how to author single-page applications (SPA) in the Journey Optimizer web editor.
This video explains how to:
- Discover SPA views using Browse mode
- Perform authoring on the current view
- Apply website modifications to multiple views or to all views that were discovered
- Do bulk actions on modifications"
For more information, please visit the Get started with web channel documentation.
Transcript
Hello, my name is Robert Caranchou and today I’m going to do a demo of single page application support in the AGO web editor. For this, I’m going to create a web campaign and I’ve already did that and loaded my web page in the web visual editor. The first thing you will notice is that near the surface, we now have the view name. And these views need to be declared in the AAB web SDK implementation so that they can be discoverable in the web visual editor. The first thing that I will do, I’ll switch to browse mode and navigate to different sections of the website in order to discover different views. So as you can see while I navigate, the view is changing. And I can navigate to multiple sections of the website so I discover the views that I need. Once I discover the views, I can switch back to the design mode and I can start the authoring. And I’ll do some modifications. For example, I want to change this text. And I want to change the color of this text. And then here I want to personalize this message. And then I want to change this text and say something like, And now I can go to the modifications panel and I can see all my changes. So here I see that all the changes are applied for the home view. But some of them I would like to apply for different views. For example, the heading color, I want to apply it for all the views that were discovered. And I can do that, I’ll hit apply, and then you’ll see an entry with all the views. For this one, I would like to apply it only for home, men and women views, and I’ll hit apply. And if you want to do like bulk changes, you can delete all modifications. Or if you hit select, you can select multiple modifications. And then you can apply them across multiple views. So after applying the changes to multiple views, in order to validate, you can either review to activate or go to simulate. Or you can quickly see the changes by switching to the browse mode and going through the website. So you can see that I’m on the men view and the color is here. I have this one, but I don’t have this change text, because I haven’t applied that for this view. The same for the women for equipment. As you can see that this is red, but this is not personalized because I personalized it only for home, men and women, and so on. So this is how the changes are applied across different views. Thank you.
recommendation-more-help
7e382214-bd30-4de2-bc8b-f6f6e7182305