# Integrating a Game Widget via Google Ad Manager (GAM)

This method dynamically loads the widget into the ad slot, ensuring seamless integration.

**⚡️ Before You Begin**

You'll need your **Playgama Widget ID** (e.g. `WA0000000000000`) to set things up.

Here’s how to find it:

* Log in to your[ Playgama account](https://widgets.playgama.com/account/login).
* If you haven’t created a widget yet, do it from the dashboard.
* After creating it, you'll see **an embed code** — your personal widget\_id is inside.
* Already have a widget? Just open its page and click the \</> icon to access the embed code again.

#### Step 1: Create a New Creative in GAM

1. Navigate to your Google Ad Manager account.
2. Go to **Delivery > Creatives**.
3. Click **New creative**.
4. Select the advertiser for this creative.
5. Choose **Custom** as the creative type. Click **Continue**.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXdmO_Xonx3rIPOJH8jQE-iyCiINs3e14wPwvX0WgS5lR3Zgta1NUjDBVbey00vIoOcPWcFLPxR8twb5yfQ7BxihZAfufzvLUjN5J_EpdGtfpIIeBo8MKwggWC70dpsRKgOZ1EGB?key=yO0qnw6Xp0toxjGXx1gxBQ" alt=""><figcaption></figcaption></figure>

#### Step 2: Configure the Creative

1. Give your creative a descriptive **Name** (e.g., "Playgama Widget Loader").
2. In the "Code snippet" section, paste the following code:

```
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,minimum-scale=1">
</head>
<body>
  <script>
    try {
      const iFrame = window?.frameElement;
      const widgetParent = iFrame?.parentNode;
      const { width: embedWidgetWidth = '', height: embedWidgetHeight = '' } = iFrame;
      widgetParent.style.height = embedWidgetHeight + 'px' || '300px';
      widgetParent.style.width = embedWidgetWidth + 'px' || '300px';

      const widgetID = "widget-playgama" + "-" + new Date().getTime();
      iFrame.style.display = 'none';

      const amIAliveScript = top.document.querySelectorAll("[src='https://widgets.playgama.com/index.js']")?.length === 0;
      if (amIAliveScript) {
        const widgetScript = document.createElement("script");
        widgetScript.setAttribute("src", "https://widgets.playgama.com/index.js");
        widgetScript.setAttribute("async", "true");
        widgetScript.setAttribute("id", "playgama-widget-script");

        top.document.head.appendChild(widgetScript);
      }

      top.playgama_widgets = top.playgama_widgets || { clbs: [] };
      top.playgama_widgets.clbs.push(() => {
        const playgamaOutDiv = document.createElement("div");
        playgamaOutDiv.setAttribute("id", widgetID);
        playgamaOutDiv.insertAdjacentHTML('beforeend', `<div style="opacity: 0.2;font-family: sans-serif;font-size: 10px">
  Powered by <a href="https://playgama.com/" target="_blank" rel="noopener">Playgama</a></div>`);
        widgetParent.appendChild(playgamaOutDiv);
      });
      top.playgama_widgets.clbs.push(() => {
        top.playgama_widgets.defineWidget({
          widget_id: "ADD_YOUR_WIDGET_ID_HERE", // Replace with your actual widget ID
          element_id: widgetID,
        });
        top.playgama_widgets.showWidget(widgetID);
      });
    } catch {}
  </script>
</body>
</html>

```

**🚨 Don't forget to insert your actual `widget_id` from the embed code.**<br>

1. Ensure the **Target ad unit size** matches the size of the line item where this creative will be used.
2. Click **Save**.

#### Step 3: Assign Creative to a Line Item

1. Open an existing Line Item or create a new one that targets the ad inventory where you want the widget to appear.
2. Associate the new creative you just created with this line item.
3. Save the line item.

Once the line item is active, the Playgama widget will begin to serve on your website in the targeted ad units.

<br>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://wiki.playgama.com/playgama/for-partners/embed-the-widget/integrating-a-game-widget-via-google-ad-manager-gam.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
