There are 4 Action Badges to choose from - Circle, Diamond, Mini Bar & Ribbon.
An Action Badge can be placed in 4 interchangeable desktop screen positions - top left, top right, bottom left & bottom right. They are mobile friendly inline with Google's guidelines.
Action Badges can be found under Modules > Data Sets > Action Badges.
Choose the Action Badge you wish to edit.
You then need to fill out the required fields. If you are editing the Diamond Action Badge, complete the Diamond fields. If you are editing the Circle Action Badge, complete the Circle fields etc.
The below example is for the Diamond Action Badge (displayed above).
- Title: The title of the action badge - internal only, does not appear on front end.
- URL: Can be left this blank, it will self-populate when saved from the Title.
- Meta Title & Meta Description: Not required for the Action Badge
- Category: Select the category of action badge you wish to add this to.
- Type: Choose the type for action badge i.e circle, diamond, ribbon, mini bar.
- Desktop Position: Choose where to display the action badge on the screen.
- Hide on Mobile: Choose whether to display the action badge on mobile or not.
- Link: Add the URL you wish to link to.
- New Tab: Choose whether to open the link in a new tab or on the same page.
- Diamond Primary Color*: Colour for the main diamond.
- Diamond Secondary Color*: Colour for the diamond outline.
- Diamond Line One: Text in Box.
- Diamond Line Two: Text within Diamond.
*How to Select Colours:
- Use https://coolors.co to pick a colour that is complementary but contrasting to your brand colours. Select the Hex Code Colour for your selected colour e.g. #FF0000
- If you don’t have the codes for your brand colours, you can use a tool like Colourzilla (Chrome) to give you the codes from your website.
Don't forget to save your changes!
The next step is to add your action badge to your page.
- Go to Pages and select the page you wish to add the action badgeto.
- Scroll down to the ACTIONBADGE data set
- Select your desired category
- Save changes
- View on Front End & make any required changes to colour, text etc.
- View on Mobile to ensure you’re happy with how it looks here also.
- Email Net Affinity to let them know that new Action Badge is live, to make a note of date to record impact on bookings.