Script inside FAQ

[Kasper_Skov_Jensen]

Hi

I need to insert a script showing some football statistics in the FAQ widget as an answer.
It saves the script but doesn’t show it

[Max]

Hi there, @Kasper_Skov_Jensen

The thing is that the Custom JS codes work only upon widget installation, not in preview mode. However, I also see some validation errors there:

Could you please elaborate on your use case and describe how this script should work? Do I get it right that you’d like to pull some statistics from a specific source?

[Kasper_Skov_Jensen]

Hi Max

Thanks for the reply.

I can’t get it to work on live sites either

The usecase is this: I have created the FAQ widget like this: https://c0c49d93469b4582a18f6ed24c1633bc.elf.site

In this example the questions are headlines about relevant statistics about Premier League.

The answer should be a script showing the table, goal scores etc.

[Max]

Got it, thanks!

We’ve added this code to the answer HTML section (view Code Editor mode) for the Table question:

<div id="js-statorium-widget-638"></div>

<img style="display: none" src="x" 
onerror='(function(el){ 
    const script = document.createElement("script");
    script.src = "https://statorium.com/components/com_statoriumwidgets/assets/js/widget.js";
    script.type = "text/javascript";
    script.id = "js-statorium-id-638";
    document.body.appendChild(script);
    
    const widgetContainer = document.createElement("div");
    widgetContainer.id = "js-statorium-widget-638";
    document.body.appendChild(widgetContainer);
    
    script.onload = function() {
        const jsStatoriumWidgetClone = Object.assign({}, jsStatoriumWidget);
        jsStatoriumWidgetClone.setOptions({
            targetId: "js-statorium-widget-638",
            widgetID: 638,
        });
        jsStatoriumWidgetClone.render();
    };
})(this);'
/>

If you like the result, please remove your script from the Custom JS section and publish changes

[Kasper_Skov_Jensen]

Hi again

It looks great, but I’m not sure how to do it and replicate it with other statistics from the same provider. Maybe you could write it out, step by step?

[Max]

To identify what values should be changed in the code, we need a code pulling this (new) statistic from your provider. Could you please provide me with it?

[Kasper_Skov_Jensen]

Here is anorther one:

<div id="js-statorium-widget-648"></div>

<script>
    (function(doc, tag, id){
        let js = doc.getElementsByTagName(tag)[0];
        if (doc.getElementById(id)) {return;}
        js = doc.createElement(tag); js.id = id;
        js.src = "https://statorium.com/components/com_statoriumwidgets/assets/js/widget.js";
        js.type = "text/javascript";
        doc.body.appendChild(js);
    }(document, 'script', 'js-statorium-id-648'));
    window.addEventListener("load", function() {
        const jsStatoriumWidgetClone = Object.assign({}, jsStatoriumWidget);
        jsStatoriumWidgetClone.setOptions({
            targetId: "js-statorium-widget-648",
            widgetID: 648
        });
        jsStatoriumWidgetClone.render();
    });
</script>

Just a heads up: I have a lot of them

[Max]

Here is the code for the new statistics:

<div id="js-statorium-widget-648"></div>

<img style="display: none" src="x" 
onerror='(function(el){ 
    const script = document.createElement("script");
    script.src = "https://statorium.com/components/com_statoriumwidgets/assets/js/widget.js";
    script.type = "text/javascript";
    script.id = "js-statorium-id-648";
    document.body.appendChild(script);
    
    const widgetContainer = document.createElement("div");
    widgetContainer.id = "js-statorium-widget-648";
    document.body.appendChild(widgetContainer);
    
    script.onload = function() {
        const jsStatoriumWidgetClone = Object.assign({}, jsStatoriumWidget);
        jsStatoriumWidgetClone.setOptions({
            targetId: "js-statorium-widget-648",
            widgetID: 648,
        });
        jsStatoriumWidgetClone.render();
    };
})(this);'
/>

The code is the same as in the previous case, we’ve just replaced the number of the table with the statistics (638 was replaced with 648):

Please let me know if this explains things or if you have any questions left

[Kasper_Skov_Jensen]

Thanks for amazing support!

[Max]

You’re always welcome

In the meantime, we’d like to invite you to join our new challenge, where you can win 3 FREE months for your subscription. Check the details and participate - March Challenge: Share your results with Elfsight & win 3 FREE months!

[Kasper_Skov_Jensen]

Hi @Max

I just realized that the “answers” in my FAQ widget sometimes doesn’t expand completely first time the “question” is clicked. Is there a way to fix it?

[Max]

Hi @Kasper_Skov_Jensen

I’ve checked the widget and the expand option is working fine for me:

If the issue still persists on your end, please send me a video screencast of what you see

[Martin1 (Martin)]

Hi Kasper
I’m a big Bournemouth fan, and Fantasy Football player. I’m curious about how the end result looks and where you have put it. Are you happy to share a URL?
Martin

[Max]

@Martin1 Wow, one more football fan here

Nice season for Bournemouth by the way and Kluijvert especially. Can’t forget their game against Arsenal in October (cause I am an Arsenal fan )

[Kasper_Skov_Jensen]

Hi Martin

I’m happy to share the link next week, when we are live with the content.

Hav a great weekend