Getting the Embed Code

The Embed feature in Changeloger Pro allows you to display your changelogs, feedback submission boards, or public roadmaps on any external website using an iframe. This is a highly efficient way to share product updates and engage with your community across multiple platforms without duplicating content.

• How to Get the Embed Code
• Configuration Options
• Using the Embed Code

How to Get the Embed Code

To generate the necessary code for embedding, follow these precise steps within your WordPress dashboard:

• Navigate to Changeloger > Releases.
• Select the specific product you wish to embed from the sidebar menu.
• Locate and click the Embed button, identified by the </> icon.
• Choose the content type you want to share: Releases, Feedback, or Roadmap.
• Configure your desired display options, such as the Theme (Light or Dark).
• Copy the generated HTML snippet for use on your target website.

Configuration Options

The embed generator provides basic configuration settings to ensure the widget aligns with your external site’s design. You can toggle between Light and Dark themes directly within the generator modal. Once selected, the iframe source URL is automatically updated to reflect these parameters.

Using the Embed Code

You can integrate the copied HTML code into any website that supports iframe elements. Simply paste the code block into your page editor. For better responsiveness on varying screen sizes, you can wrap the iframe in a container with relative positioning:

<div style="position: relative; padding-bottom: 75%; height: 0; overflow: hidden;">
 <iframe
 src="https://yoursite.com/?cha_embed=1&product=5&type=roadmap"
 style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
 frameborder="0">
 </iframe>
</div>

Please note that for the embed functionality to work correctly, your external site must be able to load the content from your WordPress domain. The plugin automatically sets the headers X-Frame-Options: ALLOWALL and Content-Security-Policy: frame-ancestors * to facilitate cross-origin access.