title: How to use taboola in react
body: <p>I developing react app which should have taboola content.
  Of course I have embed code of taboola.</p>
  <pre><code>&lt;script type=&quot;text/javascript&quot;&gt;
      window._taboola = window._taboola || [];
      _taboola.push({ article: 'auto' });
      !function (e, f, u, i) {
        if (!document.getElementById(i)) {
          e.async = 1;
          e.src = u;
          e.id = i;
          f.parentNode.insertBefore(e, f);
        }
      }(document.createElement('script'),
        document.getElementsByTagName('script')[0],
        '//cdn.taboola.com/libtrc/.../loader.js',
        'tb_loader_script');
      if (window.performance &amp;&amp; typeof window.performance.mark == 'function') { window.performance.mark('tbl_ic'); }
    &lt;/script&gt;
  
  &lt;div id=&quot;taboola-below-article-thumbnails&quot;&gt;&lt;/div&gt;
    &lt;script type=&quot;text/javascript&quot;&gt;
      window._taboola = window._taboola || [];
      _taboola.push({
        mode: 'thumbnails-a',
        container: 'taboola-below-article-thumbnails',
        placement: 'Below Article Thumbnails',
        target_type: 'mix'
      });
    &lt;/script&gt;
  
  &lt;script type=&quot;text/javascript&quot;&gt;
      window._taboola = window._taboola || [];
      _taboola.push({ flush: true });
    &lt;/script&gt;
  </code></pre>
  <p>I tested this code in native html script.
  And it worked well.
  But when I try to use it react environment, it doesn't show content sometimes.</p>
  <p>This is my react code</p>
  <pre><code>class TaboolaContainer extends React.Component {
    applyTaboola = () =&gt; {
      if (document.getElementById(&quot;taboola-below-article-thumbnails&quot;).innerHTML.length) return;
      window._taboola = window._taboola || [];
      window._taboola.push({
        mode: &quot;thumbnails-a&quot;,
        container: &quot;taboola-below-article-thumbnails&quot;,
        placement: &quot;Below Article Thumbnails&quot;,
        target_type: 'mix'
  
      });
      window._taboola.push({ flush: true });
    }
  
    componentDidMount = () =&gt; {
      this.applyTaboola();
    }
  
    render() {
      return (
        &lt;div className=&quot;taboola-section&quot;&gt;
          &lt;div id=&quot;taboola-below-article-thumbnails&quot;&gt;&lt;/div&gt;
        &lt;/div&gt;
      )
    }
  }
  </code></pre>
  <p>How can I use taboola in react more efficiently?</p>