How do I control the display of tabs in Journeys?

Title and music.

If you've used Journeys, you've probably noticed the tabs at the bottom of the page. Your business requirements might be to hide, show, or rearrange these tabs. In this video you'll learn how to use Visual Builder Studio in Express mode, also known as simply Express mode, to do this.

I start signed in to the application as an administrator who has access to Visual Builder Studio; for example, a user with the Application Administrator role. First, navigate to the page you want to modify; in this case, I’ll navigate to My Journeys.

On the Home page, click Me.

Click Journeys.

Notice that at the moment, six tabs are shown in the order Explore, My Journeys, My Tasks, Team Journeys, Organization Journeys, and Activity. You've been asked to hide Team Journeys and Organization Journeys and switch the order of My Journeys and My Tasks. Pay attention to the tab names and their corresponding icons, because if you don't have a wide enough screen you may only see the icons when you're working in Express mode, as you’ll see during this demo.

Use the Settings and Actions menu to start Visual Builder Studio. If it's your first time using it, you may be asked to create a project. For this demonstration, I already have one prepared.

Click the Settings and Actions menu.

Click Edit Page in Visual Builder Studio.

Now that you've started VB Studio, verify that you’re in Express mode.

Notice the six icons at the bottom representing the six tabs. You'll see in a few moments that you can expand the window to see the names if you need them.

The panel on the right includes all modifications using Express mode, such as showing or hiding buttons or personalizing the look and feel using page properties. You’ll be modifying a page property to adjust the look and feel of the page. By default, the name of the page property is listOfTab. However, this may vary on a page-by-page basis. For example, for the Journeys page, this page property is listOfTabsV2. It doesn't hurt to try changing a page property to test settings, because there's a convenient Undo button if you don't see a change. If you look at the help for the page property, you see a detailed description of what tabs are available and how you enter them. Notice that the tabs listed in the description are Explore, My Journeys, My Tasks, Team Journeys, Org Journeys, and Activity, exactly as you saw in your original application. To prepare for editing, I like to copy-and-paste the tab descriptions into Notepad and edit them there. I also like to fix the formatting so that copy-and-pasting is easy. Notice that the second column in the Notepad file has your tab names.

In the Page Properties section, hover to the right of listOfTabsV2.

Click the Help icon.

In the pop-up window, highlight and copy the descriptions.

Paste in Notepad.

Copy the Explore code.

Notice that by default there are no values listed; this means that the page is currently displaying the default tab order. You can add values and copy-and-paste from your Notepad file to put the tabs in the order you want them.

First, I'll add the Explore tab. Notice that as you add the tabs, they appear at the bottom of the page, and, since you're overriding the default, any tabs you haven't added yet are hidden.

In Visual Builder Studio, for the listOfTabsV2 page property, click the Add Item icon.

Paste the Explore code.

Click off the field to commit it.

I'll quickly populate the rest of the values.

Repeat the steps to copy from Notepad, add item to listOfTabsV2, and paste in VB Studio Express to add My Journeys, My Tasks, Team Journeys, and Activities.

Once you think you're done, you can adjust the page width as necessary to see the tab names. Notice that I accidentally added Team Journeys and forgot to switch My Tabs with My Journeys. In Express mode, this is easy to fix. Just delete the tab you didn't mean to add, and use the drag bars to rearrange the remaining tabs into the correct order.

Widen the page so all tabs are visible.

Narrow the page so you can edit the Value section

In the listOfTabsV2 page property, delete Team Journeys.

In the listOfTabsV2 page property, drag to switch the order of My Journeys and My Tasks.

Once you’re done, you can click Preview to verify your results in a new browser tab. If they meet your requirements, you can publish your changes so end users can see them. You’ve successfully managed your tabs using Express mode in VB Studio.

Click the Preview icon.

For more information on this topic, you can view the courses on Oracle University or reference the available help on Oracle Help Center.

Thanks for watching!