Once you've opened a new Shortcut in the dashboard, you will be redirected to the site page and can begin creating your Shortcut through the builder.
The "builder" is the bar on the bottom of your screen used to create and edit shortcuts.
Creating Shortcuts is easy, and it all starts by clicking on the "+" button in the bottom left of the webpage.
- Once you click on the "+", you will be given the power to start selecting 'elements' on your application.
- In order to select an 'element', hover your mouse over the area you want, click on the area, and this will automatically create a Shortcut Step.
- Repeat this 'point and click' process in order to capture the appropriate steps for your Shortcut.
- Once you have completed the Shortcut, please be sure to UPDATE CHANGES prior to exiting out of the builder.
Editing Individual Shortcut Steps
Now that you've created your first Shortcut, you see the steps listed down at the button of the page.
Once you have created those steps, you can start editing them by hovering over the step you want to start editing, and you will be given two options:
- You can click on the "Gear" icon to start editing
- You can click on the "Trash" icon to erase that step
When you click on the "Gear" icon you will see the editing tool (see below) where you are then able to take several actions:
- Re-Select: This will allow you to re-select the exact element you are looking to grab on the application
- Limit to current page: If you choose this option, it will limit the Shortcut step to the current page
- Ignore Text: If you choose this option, it will tell the Shortcut that you would like to ignore the text associated with the element you selected
If you click on the Advanced tab, you will be presented with further tools for editing the specific Shortcut step:
- Click: This is a normal click and will move the user to the next Shortcut step
- Highlight: This will only highlight the element and not "click" for the user
- Right Click: This is a normal 'right click' and will open the context menu
- Custom Selector: This allows you to put in the exact HTML / CSS you would like to grab for the Shortcut step
Once you have completed all of your edits, please be sure to SAVE all of your changes.