Using HTML in Editor
Using the power of HTML to customize your widgets
Jamie Gutierrez avatar
Written by Jamie Gutierrez
Updated over a week ago

Using HTML in Editor

Version 11.1.1 and higher

With the introduction of the 'Insert HTML' feature in Editor, it opens up a whole array of very powerful formatting flexibility. The Insert HTML feature is available using the container/section widget. 

Once you drop your widget on the page in Editor, select 'Format' tab > 'Settings'.
Scroll down to 'Section Settings' > Insert HTML field.

There is also a 'Video' widget available in Basic Widgets 2.6 & higher (search for 'Video').

Drag/drop this widget into your project's screen. Take a look at the corresponding HTML in the 'Insert HTML' box. You can edit this to include your own URL, size, etc.

Examples

The following are just a few ideas for what you can do with HTML. Feel free to try simple or advanced HTML in your project. Learn more about HTML here.

  • Embed another web page

<iframe frameborder="0" height="600px" id="embedFrame" src="https://trial.dc.irise.com/iRise/player/render?_project_key_=620ded448fbf41e3947a67cbb87749ab&amp;amp;_target_key_=64684a1ba45a4428980c675d68b32cec&amp;amp;inDocumentView=SIMULATION&amp;amp;windowReference=__window__0&amp;amp;_toolBarState=excludeToolbars&amp;amp;_embedMode=true" width="715px"></iframe> 

  • Add a video to a page

<iframe allowfullscreen="" frameborder="0" height="100%" src="https://www.youtube.com/embed/LjCzPp-MK48?rel=0&amp;amp;showinfo=0" width="100%”></iframe> 

  • Maybe try something more advanced, like autocomplete drop down

<datalist id="browsers">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

You can also combine the use of another new feature, Using CSS, to get even more flexible and dynamic with your projects.

Here's a short video to show you the basics of adding HTML to your prototypes in Editor.

Did this answer your question?