Let's learn how to add buttons to enhance your projects and ensure a seamless user experience. Follow these simple steps.
Step 1
Click the "Studio" button in the top right corner.
![](https://cdn.relayto.com/images_originals/GB2RSiETSHi6doLTW2lw_Slide 16_9 - 251 (34).png)
Step 2
Click the "Add Interactivity" icon on the toolbar at the top middle of the screen or in the Interactive Studio side menu.
![](https://cdn.relayto.com/images_originals/Vldi5rMQSOOP2bfsoUT7_Slide 16_9 - 251 (35).png)
Step 3
Select the "Button" option in SHAPES.
![](https://cdn.relayto.com/images_originals/KF6HhFF5T0K9X4tFpqJa_Slide 16_9 - 251 (36).png)
Step 4
With the button selected, click on the "Styles" tab.
![](https://cdn.relayto.com/images_originals/cB7z5fhARki8nnEdSzxS_Slide 16_9 - 251 (37).png)
There, you can modify the text, color, padding, and corner styles and add shadows to the button.
![](https://cdn.relayto.com/images_originals/bVGytVxXS66dkyFiZ7hd_Slide 16_9 - 247 (10).png)
Step 5
After making the desired changes, click "Add Effects."
![](https://cdn.relayto.com/images_originals/Hi7cY6QQToOkrtLkIGl2_Slide 16_9 - 251 (38).png)
Here, you can choose between different effects to be applied to your button, controlling:
- How many times the animation will reload on Loops.
- For how long it's going to happen on Duration(s).
- And when it's going to start moving by using Delay.
![](https://cdn.relayto.com/images_originals/eksoPKkSHqd4NgEKFldR_Slide 16_9 - 247 (9).png)
Step 6
Click "Add Popup on Hover" then click "Add Popup."
To understand How to Add and Edit Popups, click here.
![](https://cdn.relayto.com/images_originals/mTgW1P9OSWaJSxhS0Gac_Slide 16_9 - 251 (40).png)
Step 7
Click "Add Action on Click" and select the action you want to trigger when the button is clicked.
![](https://cdn.relayto.com/images_originals/LJAnWfeLS36sOJoF0Khg_Slide 16_9 - 251 (39).png)
Types of CTAs
Select Open Widget to open other experiences on hubs from RELAYTO. You can also open websites that support iframe using this method.
To understand better how to Embed Widgets, click here.
![](https://cdn.relayto.com/images_originals/KQiJdHD9RLmsZjdG2duw_Slide 16_9 - 248 (6).png)
For media, you can select between Images, Videos, and Audio. You can also select Download File if you want the user to download one of these or other formats.
![](https://cdn.relayto.com/images_originals/AXc5EwhYRUeHYh8LfrSX_Slide 16_9 - 247 (11).png)
Click Go to page to redirect those who click the button to a page inside the experience. You will have to select the page and click confirm.
![](https://cdn.relayto.com/images_originals/XkK0O4drRQWbQH6j6vQk_Slide 16_9 - 247 (12).png)
Contact Me is for emails. You can add the email address to which you'd like any message to be sent.
![](https://cdn.relayto.com/images_originals/Vl0Cgo0SweXSJknzPdzQ_Slide 16_9 - 248 (7).png)
And Post is for text. You can write inside it and the text will be exhibited when the button is clicked.
![](https://cdn.relayto.com/images_originals/UR4CtCmoRIelTK20to1j_Slide 16_9 - 248 (8).png)
Related Articles:
Thank you for joining us in this tutorial! If you have any questions or need help, feel free to email us at [email protected] or book a call here.