Im busy trying to create a component with Google Adsense and it is not showing anything on the DOM, I've tried finding similar issues but I don't seem to find any answers. At this point it's just rendering an empty div in its place.
I've added this into my index.html head
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxxx"
crossorigin="anonymous"></script>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
And this is my Component for the Adsense
import React, { useEffect } from 'react';
import styles from "./AdSenseContainer.module.scss";
export default class AdSenseContainer extends React.Component {
componentDidMount() {
(window.adsbygoogle = window.adsbygoogle || []).push({});
console.log('Google add showing!');
//Console.log is running
}
render() {
return (
<div className={styles.AdContainer}>
<ins className="adsbygoogle"
style={{ display: 'block' }}
data-ad-client="ca-pub-xxxxxxxxx"
data-ad-slot="xxxxxxxx"
data-adtest="on"
data-ad-format="auto"
data-full-width-responsive="true"/>
</div>
);
}
}
What it's rendering :
