LOADING
ERROR
DONE

Demo: How to implement Generate Image Feature to your websites

Add CDN links to <head> on your pages:

<script type="module" crossorigin src="https://cdn.jsdelivr.net/gh/yournextagency/enervi-cdn@release-test/index.js"></script>

<link rel="stylesheet" crossorigin href="https://cdn.jsdelivr.net/gh/yournextagency/enervi-cdn@release-test/index.css" />

Add tag with id="gen-img-widget" to the header of each page. This is where the main logic is executed. This tag must be present.

<div id="gen-img-widget"></div>

Add tag with id="gen-img-content" to the desired page where you want to show the transformation screen.

<div id="gen-img-content"></div>

Add tag with id="gen-img-status-in-progress". This element will be shown while the image is being processed. Add any content inside element.

<div id="gen-img-status-in-progress"></div>

Add tag with id="gen-img-status-error". This element will be shown once image generation failed.

<div id="gen-img-status-error"></div>

Add tag with id="gen-img-status-done". This element will be shown once image done. It will be hidden automatically after 10 minutes. Add any content inside element.

<div id="gen-img-status-done"></div>

Also you can add tag with id="widget-map". Its map element widget that renders the map from origin app homepage.
Review map

<div id="widget-map"></div>

Also you can add tag with id="widget-articles". Element widget that renders the articles from origin app articles page.
Review articles

<div id="widget-articles"></div>