Your projects can be easily embedded on a page in your website. When a project is embedded, it creates an iframe in which the project lives on your page. This iframe is responsive, and scales in size depending on the size of the available area on your page.
Before you begin
- Locate the Project ID for the project you want to embed.
- This is the 24-digit unique string that identifies your Storycrafter project.
- You can find this ID by going to your project editor, and locating it in the URL bar.
The Embed Script
You will use the Project ID as a part of the script that will embed the project on your site.
<script type="text/javascript" src="https://api.storycrafter.net/embed/YourProjectID"></script>
Adding the Script on Your Website
How you insert the script on your website will depend on how you manage your site content. Below are methods for several common platforms.
Squarespace
- Add a Code content block to your page.
- Paste your embed script into the code window and click Apply.
- While in editing mode, the embed code will be disabled. Click Save in order to see your embedded project.
Wix
- Click Add
- Click More
- Under Embeds, select HTML iframe.
- Insert your project's embed code.
- Adjust the size of the view so that you can see the entire project.
- Be sure to review it both in desktop and mobile views, to ensure that both versions are sized appropriately.
Wordpress
- If you are using the default Wordpress editor, you can simply paste the embed code where you would like the project to be inserted.
- If you use a visual builder or certain themes, such as Divi, will need to insert code module first, and then paste your script inside of this module.