Embed your guide on any website, blog, or help center.
Getting the embed code
- Click the “Share” button on your published guide
- Select the “Embed” tab
- Copy the code snippet
Adding to your site
Paste the embed code into your website’s HTML where you want the guide to appear.
<script src="https://stepsies.com/e/YOUR_TOKEN.js" async></script>
The guide will load automatically and display inline on your page.
Responsive design
Embedded guides are fully responsive:
- They adapt to fit their container width
- Work on desktop, tablet, and mobile
- Maintain readability at any size
Styling considerations
The embed uses an iframe that inherits some styling from your site. For best results:
- Place it in a container with adequate width (minimum 320px)
- Allow enough height for the content (or let it auto-size)
- Test on different screen sizes
Where to embed
Common places to use embeds:
- Help centers — Product documentation and tutorials
- Blog posts — Interactive content within articles
- Landing pages — Product tours and demos
- Knowledge bases — Step-by-step instructions
- Notion/Confluence — Internal documentation
Embed options
The embed code includes your guide’s unique token. You cannot customize:
- Colors (uses your guide’s theme)
- Branding (follows your plan’s settings)
- Size (responsive by default)