<iframe> tag specifies an inline frame and is used to embed another document within the current HTML document.
iframes can be embedded into a Hugo Markdown document by wrapping it in a shortcode that allows raw HTML to be included.
(A Flask or Dash app can also be embedded as an iframe.)
Iframes include the following attributes:
allowfullscreen: set to true to activate fullscreen mode.
loadingto specify whether a browser should load an iframe immediately or to defer loading until some conditions are met. Options include
srcto specify the address of the document to embed in the iframe.
widthin pixels, but can also be specified as a percentage.
titleto include a title
styleattribute to set CSS styling
By default an iframe has a border around it which can be removed by using the
style attribute and setting the CSS
border property to none.
An iframe can be used as the target frame for a link.
Click the link to see a sample Dash app in the iframe above. My sample dash app
<iframe height='300' scrolling='yes' src="https://www.angela1c.com/projects" frameborder='no' allowtransparency='true' allowfullscreen='true' style='width: 100%'></iframe>
A plotly map: