Skip to main content

HTML / Vanilla JS Integration

Integration guide for static sites or traditional CMS.

Basic Integration​

Add this line before the </body> tag:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>My Site</title>
</head>
<body>
  <!-- Your content -->
  <header>
    <nav>...</nav>
  </header>
  
  <main>
    <article>
      <h1>My Article</h1>
      <p>Article content...</p>
    </article>
  </main>
  
  <footer>...</footer>

  <!-- Ad Sentinelle SDK (place just before </body>) -->
  <script src="https://adwall-backend-xxxxx.run.app/v1/loader/YOUR_SITE_ID.js" async></script>
</body>
</html>

Integration with Configuration​

For advanced configuration:

<script>
  // Optional configuration
  window.ADWALL_CONFIG = {
    debug: true,  // Enable logs (dev only)
  };
</script>
<script src="https://adwall-backend-xxxxx.run.app/v1/loader/YOUR_SITE_ID.js" async></script>

WordPress​

Option 1: Plugin​

Use a plugin like "Insert Headers and Footers":

  1. Install the plugin
  2. Go to Settings → Insert Headers and Footers
  3. Paste Ad Sentinelle code in "Scripts in Footer" section

Option 2: Theme File​

Edit your theme's footer.php file:

<?php
// footer.php in your WordPress theme
?>
    <footer>
      <!-- Your footer -->
    </footer>

    <!-- Ad Sentinelle SDK -->
    <script src="https://adwall-backend-xxxxx.run.app/v1/loader/YOUR_SITE_ID.js" async></script>

    <?php wp_footer(); ?>
  </body>
</html>

Option 3: functions.php​

// functions.php
function add_adwall_script() {
  wp_enqueue_script(
    'adwall-sdk',
    'https://adwall-backend-xxxxx.run.app/v1/loader/YOUR_SITE_ID.js',
    array(),
    null,
    true // Load in footer
  );
}
add_action('wp_enqueue_scripts', 'add_adwall_script');

Shopify​

In Themes → Edit Code → theme.liquid, add before </body>:

<!-- Ad Sentinelle SDK -->
<script src="https://adwall-backend-xxxxx.run.app/v1/loader/YOUR_SITE_ID.js" async></script>
</body>

Wix​

  1. Go to Site Settings → Tracking and Analytics
  2. Click + New Tool → Custom
  3. Paste Ad Sentinelle code
  4. Position it "Body - End"

Squarespace​

  1. Go to Settings → Advanced → Code Injection
  2. In "Footer" section, paste the code

Integration with Google Tag Manager​

<!-- In GTM, create a custom HTML tag -->
<script src="https://adwall-backend-xxxxx.run.app/v1/loader/YOUR_SITE_ID.js" async></script>

Trigger Configuration: "Page View" on all pages.

Listen to Events​

<script>
  // Wait for SDK to load
  window.addEventListener('adwall:init', function() {
    console.log('Ad Sentinelle is ready!');
  });
  
  // Listen for conversion
  window.addEventListener('adwall:converted', function(e) {
    console.log('User converted!');
    // Send to your analytics
    gtag('event', 'adwall_conversion', {
      'event_category': 'adwall',
      'event_label': 'conversion'
    });
  });
</script>
<script src="https://adwall-backend.../v1/loader/YOUR_SITE_ID.js" async></script>

Exclude Certain Pages​

To disable Ad Sentinelle on certain pages:

<script>
  // Don't load Ad Sentinelle on admin pages
  if (!window.location.pathname.startsWith('/admin')) {
    var script = document.createElement('script');
    script.src = 'https://adwall-backend-xxxxx.run.app/v1/loader/YOUR_SITE_ID.js';
    script.async = true;
    document.body.appendChild(script);
  }
</script>

Verification​

After integration, verify in the browser console:

✅ Ad Sentinelle SDK initialized
✅ Session ID: abc123-def456-...
✅ Config loaded from server
Debug

Enable debug: true in configuration to see all SDK logs.