How can I enable Google Adsense inside streamlit

Hello,
Thanks for the newest version of Streamlit 0.63 with the new feature of components, now I can insert javascript by components.html. However, After I insert the Google Adsense code using components.html, it only shows the blank at the position without loading any ads.

I tried just adding the code directly to the streamlit static page (index.html inside the package), and the ads showed up. So I think there should be a way to insert by component.
Any ideas?

Thanks,
Vincent

I would guess you’re running into this issue:

https://searchengineland.com/google-bans-iframes-for-adsense-though-says-it-will-grant-exceptions-81174#:~:text=Google%20has%20tweaked%20its%20policies,granted%20an%20exception%20by%20Google.

Streamlit Components each run in their own iframe, to keep them sandboxed from other components. Taking a step back, this is effectively this feature request, which I hope we can find a solution for in the near future

1 Like

Got it! thanks for your quick reply!!!
I think maybe I can just insert the code directly to the streamlit static index.html. But it will result in a mess (the ads will overlap the streamlit content. Is there a way to do some layout within index.html? For example, make the ads at the footer or header but not overlap with the streamlit content?

You can override some of the layout with a trick we refer to unofficially as the “CSS hack”

Figure out the selector of the content that is overlapping, and move it elsewhere with CSS