Black Lives Matter. Please consider donating to Black Girls Code today.
Learn how to use COVID-19 data in open source Dash apps. Register for the Sept 23rd webinar with IQT!

How to add javascript code from Adsense into Dash app?

Hi!
Which is the correct way to add this javasript code from Adsense into a Dash app?

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Homepage Leaderboard -->
<ins class="adsbygoogle"
style="display:inline-block;width:728px;height:90px"
data-ad-client="ca-pub-1234567890123456"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

I was testing html.Script() without exit. :confounded:

Thank you

:sweat: …you can try

app.scripts.append_script({
“external_url”: my_js_url
})

or … create your own dash core conponent

1 Like

app.scripts.append_script is the right approach here. I’ve used this with google analytics before and it works. See https://plot.ly/dash/external-resources for more.

1 Like

app.scripts.append_script seems that works fine for scripts that runs just at the beginning, but I can’t get running just the adsense one.
Will html.Script work sometime? I think with that component I will be able to place it on the app layout easily and will be visible.

Thanks for the help

1 Like

Hi, I’m interested, how would it be an example for google analytics tracking code, I tried using

app.scripts.append_script({
“external_url”: my_js_url
})

Without any luck, thanks!

By using this service and app.scripts.append_script I think it will do the job

3 Likes

Sorry, you are right, I needed to use rawgit.com instead, thanks! sorry about the silly question!

1 Like

Hello @pabjusae,
I’m also trying to add an Adsense to my dash app.

my_js_url = 'http://www.mysite.com/static/adsense.js'
app.scripts.append_script({
    "external_url": my_js_url
}) 

But that did work :confused:
Did you make something else ?

Thanks

I have not managed to make it work yet. :frowning_face:

For whoever is having issues, could you paste a screenshot of the network tab of your browser displaying the request?

My guess is that the server that is serving the adsense.js code isn’t setting the correct content-type (it should be text/javascript) and so the script isn’t getting executed. This is why @Sherm4nLC’s solution of using rawgit.com to serve the file (f it is hosted on gist or github) worked.

Hello @chriddyp
Thank you for you answer.
Here can you find the screenshot where the AdSense script is executed.

Thanks

I’m having problems in adding the analytics.js
The following code is working, referring to an external url provided by rawgit.com:

app.scripts.append_script({
    "external_url": my_js_url
}) 

Maybe the problem is that script is being appended to the footer of the page, not the Head.
Is there a way to append_script to the head?

Tks

2 Likes