Install embed widget

‚Äč

To install our beautiful widget on your website, the first step is to choose the element that you will use as selector, it can be a button, width, div or even a span. This selector will be used to open or close the widget, as in the example below:

<div class="changelogfy-widget"></div>

The next step is to insert our javascript code, it must be inserted inside the tag or before closing the </body> tag.

<script>
var CLF_config = {
selector: ".changelogfy-widget",
app_id: "APP_ID"
};
</script>
<script async src="https://widget.changelogfy.com/index.js"></script>

The "selector": ".changelogfy-widget" ensures that this code will find the element with changelogfy-widget class and insert the badge into that element.

Single page application

Some applications that dynamically reload content (Angular, React, Vue, Ember, etc) mean you'll probably want to initialize the widget within your JavaScript code.

To do this, you need to instantiate and call the init method, as in the example below:

```

var config = { selector: &quot;.changelogfy-widget&quot;, app_id: &quot;APP_ID&quot;, }; var widget = changelogfy(config); widget.init(); ```

This will create a new widget instance.

Observation

  • Running the widget.init() method will destroy the previous widget and replace it with a new instance.

  • In Angular, React, Vue, Ember, you should initialize the widget whenever the badge element container is rendered again.