What You’ll Learn
- How to use HTML tags for links
- How to customize link appearance
- How to use merge tags for dynamic links
Digioh supports adding links within text elements, form fields, checkboxes, and help text. A common use case is for adding Terms of Service and Privacy Policy links within disclosure text blocks.
Adding Links to Digioh Elements
You can use the basic HTML/CSS <a> tag to achieve this for any text in the editor. Here is a sample tag you can use:
<a href=’#‘ style=’color:inherit;’ target=’_blank’ > Your Text </a>
Replace the ‘#‘ with the URL you would like to direct to.
Because Digioh campaigns are located within iFrames on your site, the Target value in the HTML link needs to be set in order for the link to work correctly. The two options you can use are:
- target=’_blank’ – This will open your link in a new tab or window. This is the recommended default value we suggest, as this will allow the user to come back to the page with the campaign experience on it. This is useful for things like Privacy Policy pages.
- target=’_parent’ – This will open the link in the users current browser window. This is useful for redirecting a user to a page that they should stay on, such as a “Shop All Deals” call to action.
Adding Styling to your Links
You can use basic CSS to customize the look of the link. We recommend using ‘Color:inherit;’ as it will keep the text color the same as the rest of your text element. If your brand uses specific colors for links, you can also change by replacing inherit with the hex color you need.
Another common CSS styling is to use is ‘text-decoration: none;’. By default, links will have an underline on them. If you do not want this you can add that code into the Style section. Additional CSS values are separated by a semicolon (;) within the single quotes.
Example: style=’color:#FF0000; text-decoration: none;’
Styling Examples
Here are some examples of a valid code setup:
- <a href=’https://www.digioh.com/privacy-policy‘ style=’color:inherit;’ target=’_blank’ > Privacy Policy </a>
- <a href=’https://www.digioh.com/customer-stories‘ style=’color:#2cc088; text-decoration:none;’ target=’_parent’ > Explore our customer success stories </a>
