Skip to content

Creating a New Ad Unit using AdSense

To integrate ads into the StoryExploreWidget, follow the steps below to create a new ad unit on Google AdSense and send us the data-ad-client and data-ad-slot.

Step 1: Sign In to Google AdSense

  1. Go to Google AdSense.
  2. Sign in with your Google account.

Step 2: Create a New Ad Unit

  1. In the left-hand menu, click on Ads.
  2. Select By ad unit.
  3. Click on + Display Ads.

Step 3: Configure the Ad Unit

  1. Name your ad unit: Choose a name that helps you identify this ad unit later.
  2. Ad size: Select the size for your ad as responsive.
  3. Ad Shape: Choose the shape of your ad as Square

Configure AdSense Ad Unit

Step 4: Get the Ad Unit Code

  1. After configuring the ad, click Create.
  2. You will see a code snippet. From this code, you need to extract two pieces of information:
    • data-ad-client: This is your Ad Client ID.
    • data-ad-slot: This is your Ad Slot ID.

AdSense Ad Unit Code

Step 5: Adding the <direqt-story-explore> Component to Your HTML

You can now add the custom element directly to your HTML where you want the StoryExploreWidget to appear.

<body>
  <div>
    <direqt-story-explore
      ad-sense-client-id="data-ad-client"
      ad-sense-slot-id="data-ad-slot" >
    </direqt-story-explore>
  </div>
</body>

After you've added the component open your website in a browser and verify that the component is correctly rendered and the ads are displayed as expected.