Dynamic resizing with Embedly
Flourish also supports Embedly’s Provider Height Resizing API.
If you are coding a template that would like to take advantage of this, use the Flourish.setHeight()
method to post the desired height to the embedding page. Then the embedding page can listen for these messages as follows:
window.addEventListener("message", function(event) {
var message = JSON.parse(event.data);
if (message.source == "Flourish" && message.context == "iframe.resize") {
// message.height is the requested height
}
});
If you're making your own listener rather than using Embedly you'll need to add ?auto=1
on the iframe src
so that the template knows there is a resize listener in the page. If you do not do this, the template will assume it is in a fixed_height
context and size its contents based on the available height.