Page Actions (4 min)
Completion requirements
01 Getting Started
This tutorial covers page actions, including:
- An overview of pages
- Every time and first-time actions
02 Overview of Pages
You can add more pages to your project by using the pages drop-down.
![pages drop-down > add new page](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/529574866/1_AddPage.png)
You can choose to insert:
![pages drop-down > add new page](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/529574866/1_AddPage.png)
You can choose to insert:
- Blank pages
- Template pages
- Pages from other projects or your current project
03 Configuring a Page Redirect
For this demonstration, we have added titles to two blank pages and inserted buttons.
![page example](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/566234571/3_Page2.png)
To configure an action:
1. Click the Interactivity icon in the button menu. The On Click Action screen opens.
![button menu](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/566234571/4_ButtonMenu.png)
2. Click the Start + icon. The Add Node screen opens.
3. Select Redirect/Go to Page and click Next.
![on click action](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/566234571/5_OnClick.png)
4. Click the internal tab and use the drop-downs to configure the page that will open when the user clicks the button. Click Next.
![add node > redirect/go to page > configuration](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/566234571/6_Gotopage.png)
5. Add a tag and click Insert.
The node is added to the screen.
6. Click Apply.
Repeat the same process on page 1.
![page example](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/566234571/3_Page2.png)
To configure an action:
1. Click the Interactivity icon in the button menu. The On Click Action screen opens.
![button menu](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/566234571/4_ButtonMenu.png)
2. Click the Start + icon. The Add Node screen opens.
3. Select Redirect/Go to Page and click Next.
![on click action](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/566234571/5_OnClick.png)
4. Click the internal tab and use the drop-downs to configure the page that will open when the user clicks the button. Click Next.
![add node > redirect/go to page > configuration](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/566234571/6_Gotopage.png)
5. Add a tag and click Insert.
The node is added to the screen.
6. Click Apply.
Repeat the same process on page 1.
04 Page Load Actions - First Time and Every Time Actions
You can configure actions to trigger on every page. To access the page actions:
1. Expand the pages dropdown, select the page kebab menu, and click Configure Actions.
![pages drop down > page kebab menu > configure actions](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/121087548/7_PageAction.png)
The Configure Actions screen opens.
![configure actions screen](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/121087548/8_ConfigureActions.png)
1. Click on the Start + icon. The Add Node screen opens.
2. Select Show Toast and click Next.
![on click action > show toast](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/121087548/9_ShowToast.png)
3. Configure the toast message and click Next.
![configure toast message](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/121087548/10_Message.png)
4. Add a tag and click insert. Repeat the same steps for the every time action tab.
1. Expand the pages dropdown, select the page kebab menu, and click Configure Actions.
![pages drop down > page kebab menu > configure actions](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/121087548/7_PageAction.png)
The Configure Actions screen opens.
![configure actions screen](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/121087548/8_ConfigureActions.png)
- First-time actions occur the first time the user opens the page in their current browsing session.
- Every time actions occur every time the user loads the page.
1. Click on the Start + icon. The Add Node screen opens.
2. Select Show Toast and click Next.
![on click action > show toast](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/121087548/9_ShowToast.png)
3. Configure the toast message and click Next.
![configure toast message](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/121087548/10_Message.png)
4. Add a tag and click insert. Repeat the same steps for the every time action tab.
05 Save and Preview
Save and preview your project.
Both toasts are displayed:
![both toasts displayed](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/964738761/11_Toasts.png)
When clicking on the button, page 2 is automatically opened.
![page navigation](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/964738761/12_Pages.png)
When navigating back to page 1, only the every time toast is displayed:
![every time toast is displayed](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/964738761/13_Everytimetoast.png)
Both toasts are displayed:
![both toasts displayed](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/964738761/11_Toasts.png)
When clicking on the button, page 2 is automatically opened.
![page navigation](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/964738761/12_Pages.png)
When navigating back to page 1, only the every time toast is displayed:
![every time toast is displayed](https://academy.titandxp.com/pluginfile.php/1001/mod_custompage/topics/964738761/13_Everytimetoast.png)