How do your embeds work? How should it be implemented?
Tagboard Embeds rely on the placement of a block of HTML, and a Script tag into the HTML of a given website that will automatically generate an HTML iframe that displays Tagboard content.
An example of the block of HTML and Script:
<div class="tagboard-embed" tgb-embed-id="12345"></div>
<script src="https://static.tagboard.com/embed/assets/js/embed.js"></script>
There are two parts to the above embed code: the Embed HTML Block, and the Embed Script. When a given website loads and the Embed Script is executed, the Embed Script automatically looks for the Embed HTML Block as an anchor point to generate an iFrame to display Tagboard content. For Tagboard Embeds to work properly, both the Embed HTML Block, and the Embed Script must be present.
What is the expected behavior of the script?
When the Embed Script loads (typically immediately after a website loads), it begins to look within the HTML of the given page of the website for the Embed HTML Block. Once the script finds the Embed HTML Block, it uses the tgb-embed-id property of the Embed HTML Block to determine what Tagboard Content should appear within the generated iFrame.
If the script cannot find the Embed HTML Block, the script will fail to create an iFrame.
Why is my embed getting cut off?
HTML iFrames do not resize to fit their content automatically. This is not a limitation of Tagboard Embeds, but rather how browsers as a whole handle HTML iframes. When a website renders an HTML iframe, it applies a default size of 300px wide, by 150px tall. If the Tagboard content within the generated iframe is getting cut off, you will need to apply styling to the HTML Embed Block directly to size it appropriately.
How do I change the size of my embed?
To change the size of the generated iframe, you will need to apply CSS styling to the provided Embed HTML Block, or the generated iframe within. This can be done by targeting the .tagboard-embed CSS class, or the other classes that appear as child nodes of the Embed HTML Block, after the Embed Script has generated an iframe within it.
I put your embed code into an iFrame - why isn't it working?
Javascript and or scripting is disabled from running on the given website
The given website is not using HTTPS
I put your embed code in my website and now my load times are slow, what can I do?
If you notice your load times have slowed down with the inclusion of a Tagboard Embed. Try placing the Embed Script between the <body /> tags of the HTML of the given website. Placing scripts at the bottom of the <body /> element can improve page load, because script compilation can slow down the display of a given website.
Ready to get started building a digital experience for your website or mobile app?