It is possible to implement Native Google Ads on web/React?

Question

I am struggling with implement google native ads on web, i tired to find some documentation on google site, but all refers to mobile app. Has anyone perhaps implemented this?

Already what i do:

1. I dig through the google documentation
2. Ask chat GPT :) , give me few useless info
3. Some tests with google ads events etc.

Answer 1

Of course, you can implement Native Google Ads on Web using React.

You can use react-gpt for this function. GPT stands for Google Publisher Tag, which is an ad tagging library for Google Ad Manager.

For example:

import React from "react";
import { Bling as GPT } from "react-gpt";

export default function App() {
  return (
    <div className="App">
      <GPT
        adUnitPath="/4595/nfl.test.open"
        sizeMapping={[
            { viewport: [0, 0], slot: [320, 50] },
            { viewport: [750, 0], slot: [728, 90] },
            { viewport: [1050, 0], slot: [1024, 120] },
        ]}
        nativeTemplateId="10101010"
      />
    </div>
  );
}

This will create a native ad component that uses the native ad template with the ID of 10101010. The native ad template should contain placeholders for the ad assets that you want to display.

To learn more, see react-gpt doc in npmjs and github.