Getting your embed code
Each prototyping tool will contain an option to get an embed code, usually under sharing options. The code should look something like this:
<iframe width="494" height="1010" src="prototype-url-here" frameborder="0" allowfullscreen></iframe>
Placing the embed code
On the page where you want to render your prototype, place a Code module (not to be confused with an oEmbed module, which is for embedding media) onto the page. In the Code module options, paste in the iFrame code.
Your prototype will now render on the page. You can of course adjust the width or height of your prototype in the iFrame code.
Prototype is not showing
- Ensure you are using a Code module and not an oEmbed module
- In some cases, your hosting server may be blocking the connection from your prototyping service. You will need to contact your host to ensure the connection is being allowed.
- Ensure the prototype project is live and not private
Prototype is too large or small, or isn't responsive
Sadly, a lot of the iFrame's display properties cannot be modified since they are set by the prototyping service and not editable by Semplice.
You can, however, resize the prototype by adding a transform property like this:
<iframe style="transform: scale(0.5)" width="494" height="1010" src="prototype-url-here" frameborder="0" allowfullscreen></iframe>
You can also adjust the iFrame's display with custom CSS. Semplice cannot provide support for custom CSS support.