Please be aware that Ceros SDK plugins are non-native tools and are provided "as is". As such, we cannot guarantee that plugin functionality will work as intended across all implementation instances.
About This Plugin
This plugin enables the automated or user-triggered refresh of an iframe to its default state (eg, scrolling to the top of an iframe, or stopping an embedded video player).Â
The plugin will:
• Refresh any iframes within a folder when the folder is hidden.
• Refresh any iframes within the current page when changing to another page in the same experience.
• Stop and reset a video when clicking on a designated hotspot.
Click to import demo experience
Click here to view a recorded webinar that overviews this plugin!
How To Implement
Step 1: Add the Custom HTML
Copy the SDK Script below and paste it into the Custom HTML field within the Settings panel in the Studio. Press OK to finish and close the panel.
<script
src="https://labs.ceros.com/sdk-plugins/iframe-reset/main.js?v=1">
</script>Method 1: Automatic Refresh
The automatic refresh functionality is the most common method of using this plugin and requires no further action to reset an iframe once the custom HTML has been added to the experience (as long as the conditions below are met). Iframes will reset through the interactions of either hiding the folder that houses the embedded iframe or navigating to another page.
The automatic refresh functionality requires the following:
• The iframe is placed within an embedded object
• The embedded object is within a folder (the embedded object can be placed in a group or on its own, but we recommend placing it in a folder for the best results)
If the above conditions are met:
• Any interaction that hides the folder containing the embedded object will also refresh the iframe within the embedded object.Â
• Any interaction that changes the current page to another page in the experience will refresh the iframe in the embedded object.
Note on Embedded Videos:Â
To use this plugin to stop embedded videos, the embedded videos must have autoplay off.
Hide interactions must be used. Show Targets & Hide Others will not trigger an automatic refresh. If you must use Show Targets & Hide Others, include a redundant hide interaction targeting the desired folder to ensure that the refresh will take effect.
Method 2: Manual Refresh
The manual refresh method utilizes the placement of a separate button anywhere in the experience. When interacted with, the button will search through the experience and pause all iframes on the page.
To implement the manual refresh button:
• Create a hotspot.
• With this hotspot selected, open the SDK Panel, and in the second Enter Tag field beneath the SDK ID, add the tag close. Press Enter/Return to finish adding the tag.
