Question:
I am trying to wrap a 3rd party widget in a custom element. And this works, but only once. So if I code the widget as shown at the end, and load the page 1st time (or reload with Ctrl-F5), the widget is build. But any refresh or normal F5 does not.
I suspect the needed java code is loaded only once, and not activated again upon F5. But I cannot figure out why not.
Product:
Wix Editor
What are you trying to achieve:
Rebuilding old native website to Wix website, specifically,
Trying to load 3rd party widget as custom element in Wix
What have you already tried:
Tried to add the relevant JS as another custom element.
Tried to add as settings->custom-code (both head and body)
Tried making scrips as discussed in javascript - How to force a script reload and re-execute? - Stack Overflow
Note: loading in a embed-html (meaning iframe) does work, but the iframe is too closed, too bordered of, does not allow interactive drop down elements, etc.
Additional information:
Reference of 3rd party vendor instruction, that indeed works when coding html natively:
<tommy-widget
data-widget="mini"
data-api-token="xxxx:yyyyyyyyyyyy"
data-language='se'
data-min-date='2025-4-1'
data-period='week'
</tommy-widget>
<script src="https://api.tommybookingsupport.com/widgets/zoekenboek/js/init.js"></script>
Additional information:
Code in the VELO file
class TommyMiniWite extends HTMLElement {
connectedCallback() {
this.innerHTML = '<tommy-widget data-widget="mini" data-api-token="xxxx:yyyyyyy" data-language="se" data-min-date="2024-4-1" data-period="week" >Booking mini widget refused to load</tommy-widget>';
}
}
customElements.define('tommy-mini-ce', TommyMiniWite);
Additional information:
Code in the settings->custom-code (body)
<script src="https://api.tommybookingsupport.com/widgets/zoekenboek/js/init.js"></script>```