For advanced scenarios, you can use HTML in your tour steps. Please contact us if you wish to have access to HTML editing.
Would you like to make some words <strong>bold</strong> and other words <em>italic</em>.<br> This will also be <strong>bold</strong> and this will be <em>italic</em>.<br> <em>You <strong>can</strong> combine them</em> or <del>strike things out</del>.<br> You can even <a href="https://google.com">link to Google!</a>
Would you like to make some words bold and other words italic.
This will also be bold and this will be italic.
You can combine them or strike things out.
You can even link to Google!
Personalize your tours to display content based on the current user. Any user properties that you pass to HelpHero can be displayed in your tours. For example when passing name as a user property means you can refer to that using {name} inside your tours.
Hello {name}! Want to take a quick tour?
Hello James! Want to take a quick tour?
<p>If you want to embed images, this is how you do it:</p> <img src="https://helphero.co/images/[email protected]" alt="logo" width="170px" height="40px">
If you want to embed images, this is how you do it:
You can use YouTube embed codes or vimeo embed codes to display and play your videos inline.
<iframe src="https://player.vimeo.com/video/15069551" width="100%" height="360" frameborder="0" allowfullscreen></iframe>
Heres an example with a 16:9 aspect ratio <div style="position:relative;padding-bottom:56.25%;"> <iframe src="//fast.wistia.net/embed/iframe/j38ihh83m5" style="width:100%;height:100%;position:absolute;left:0px;top:0px;" frameborder="0" width="100%" height="100%" allowfullscreen allow="autoplay"> </iframe> </div>
Heres an example with a 16:9 aspect ratio
Aspect ratio | Padding-bottom |
1:1 | 100% |
16:9 | 56.25% |
4:3 | 75% |
3:2 | 66.66% |
8:5 | 62.5% |
<p>By default links open in the same window eg:<br> <a href="https://helphero.co">link to HelpHero</a> <p>If you want your link to open in a new window/tab you can use the target attribute:<br> <a href="https://helphero.co" target="_blank">link to HelpHero</a>
By default links open in the same window eg:
link to HelpHero
If you want your link to open in a new window/tab you can use the target attribute:
link to HelpHero
<p>Sometimes you want numbered lists:</p> <ol> <li>One</li> <li>Two</li> <li>Three</li> </ol> <p>Sometimes you want bullet points:</p> <ul> <li>Start a line with a star</li> <li>Profit!</li> </ul>
Sometimes you want numbered lists:
Sometimes you want bullet points: