Adding Games Widget to Your Tilda Site

PreviousAdding Games Widget to Your WordPress Site NextAdding Games Widget to Your Framer Site

Last updated 1 day ago

Adding Games Widget to Your Tilda Site

Want to embed a Playgama games on your Tilda site? Whether you're showcasing a portfolio or boosting engagement, adding the Playgama games widget is quick and easy. This guide will walk you through each step — no coding skills required!

⚡️ 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 .
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: Load the Playgama Script

First, you’ll add the Playgama script to your page’s <head> section so the widget can function correctly.

Open your Tilda project
Navigate to the page where you want the widget
Click the Page Settings (⚙️ icon)
Scroll to “Additional → HTML code for the HEAD section”
Paste this code:

<script async src="https://widgets.playgama.com/index.js"></script>

Save your changes

Now it’s time to embed the actual widget using a custom HTML block.

Return to the page editor
Click “+ Add Block”
Select the “Other” category
Choose block T123 – HTML Code
Paste the following code into the block:

<div id="widget-playgama" style="width: 510px; height: 180px; margin: 10px auto; padding: 0 20px;">
  <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>
</div>

<script nonce="widget-playgama">
  window.playgama_widgets = window.playgama_widgets || { clbs: [] };
  window.playgama_widgets.clbs.push(() => {
    window.playgama_widgets.defineWidget({
      widget_id: "ADD_YOUR_WIDGET_ID_HERE", // Don't miss this part
      element_id: "widget-playgama",
    });
    window.playgama_widgets.showWidget("widget-playgama");
  });
</script>

You can change the width and height values in the style attribute to adjust the widget size.
The widget is fully responsive, but for the basic version with 3 games, we recommend a size of 510×180 pixels to ensure a clean, balanced look on both desktop and mobile.
Max game height is 320 px.

Step 3: Publish Your Page

Once the widget is added, simply click “Publish” to make it live on your site. Your embedded game should now appear exactly where you placed the block.

Pro Tips & Notes

Double-check your widget ID to ensure the game loads correctly
The widget will display directly on the page at the defined size

PreviousAdding Games Widget to Your WordPress Site NextAdding Games Widget to Your Framer Site

Last updated 1 day ago

⚡️ 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 .
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: Load the Playgama Script

First, you’ll add the Playgama script to your page’s <head> section so the widget can function correctly.

Open your Tilda project
Navigate to the page where you want the widget
Click the Page Settings (⚙️ icon)
Scroll to “Additional → HTML code for the HEAD section”
Paste this code:

<script async src="https://widgets.playgama.com/index.js"></script>

Save your changes

Now it’s time to embed the actual widget using a custom HTML block.

Return to the page editor
Click “+ Add Block”
Select the “Other” category
Choose block T123 – HTML Code
Paste the following code into the block:

<div id="widget-playgama" style="width: 510px; height: 180px; margin: 10px auto; padding: 0 20px;">
  <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>
</div>

<script nonce="widget-playgama">
  window.playgama_widgets = window.playgama_widgets || { clbs: [] };
  window.playgama_widgets.clbs.push(() => {
    window.playgama_widgets.defineWidget({
      widget_id: "ADD_YOUR_WIDGET_ID_HERE", // Don't miss this part
      element_id: "widget-playgama",
    });
    window.playgama_widgets.showWidget("widget-playgama");
  });
</script>

You can change the width and height values in the style attribute to adjust the widget size.
The widget is fully responsive, but for the basic version with 3 games, we recommend a size of 510×180 pixels to ensure a clean, balanced look on both desktop and mobile.
Max game height is 320 px.

Step 3: Publish Your Page

Once the widget is added, simply click “Publish” to make it live on your site. Your embedded game should now appear exactly where you placed the block.

Pro Tips & Notes

Double-check your widget ID to ensure the game loads correctly
The widget will display directly on the page at the defined size

Adding Games Widget to Your Tilda Site

Adding Games Widget to Your Tilda Site

How to Add a Playgama Games Widget to Your Tilda Website (Step-by-Step Guide)

⚡️ Before You Begin

Step 1: Load the Playgama Script

Step 2: Add the Playgama Games Widget with Custom Size

Step 3: Publish Your Page

Pro Tips & Notes

How to Add a Playgama Games Widget to Your Tilda Website (Step-by-Step Guide)

⚡️ Before You Begin

Step 1: Load the Playgama Script

Step 2: Add the Playgama Games Widget with Custom Size

Step 3: Publish Your Page

Pro Tips & Notes