Backup your default sngine games files and games database

files tat will be overwriten are
root/games.php
includes/traits/games.php
content/themes/default/templates/games.tpl
content/themes/default/templates/__feeds_game.tpl

Download the zip file upload according to the file structure

In yout root you must have 

games.php
games.json
games_landing.php
playgama_import.php

install-games.php and follow the guide.
once you finish importing the games it will create a file inside includes/config called playgama_config.php
you will need to add your CLID there 

go to https://playgama.com/partners and create an account
go to https://widgets.playgama.com/ 
look for any game and open
look for you Affilate link all the way to the bottom right of the page
e.g https://playgama.com/game/hidden-object-clues-and-mysteries?clid=p_f7248fac-dbc6-4891-9c0b-b77d6b0abcb6
so in this link you will copy the p_f7248fac-dbc6-4891-9c0b-b77d6b0abcb6 
//now open open includes/config/playgama_config.php
look for define('PLAYGAMA_CLID', 'p_f7248fac-dbc6-4891-9c0b-b77d6b0abcb6'); 
and replace my code p_f7248fac-dbc6-4891-9c0b-b77d6b0abcb6 with your own

Open you sngine .htaccess file and look for the games rules ad replace it all with this new rules

//# Games
RewriteRule ^games/?$ games.php [L,QSA]
RewriteRule ^games/played/?$ games.php?view=played [L,QSA]
RewriteRule ^games/popular/?$ games.php?view=popular [L,QSA]
RewriteRule ^games/favorites/?$ games.php?view=favorites [L,QSA]
RewriteRule ^games/leaderboard/?$ games.php?view=leaderboard [L,QSA]
RewriteRule ^games/report/?$ games.php?view=report [L,QSA]
RewriteRule ^games/genre/([^/]+)/?$ games.php?view=genre&genre_id=$1 [L,QSA]
RewriteRule ^games/genre/([^/]+)/([^/]+)/?$ games.php?view=genre&genre_id=$1&genre_url=$2 [L,QSA]
RewriteRule ^games/genre/([^/]+)/([^/]+)/([^/]+)/?$ games.php?view=genre&genre_id=$1&genre_url=$2&page=$3 [L,QSA]
RewriteRule ^games/([^/]+)/([^/]+)/?$ games.php?view=game&game_id=$1 [L,QSA]
RewriteRule ^games/search/([^/]+)/?$ games.php?search?query=$1 [L,QSA]
RewriteRule ^games/search/?$ games.php?view=search [QSA,L]
RewriteRule ^games/search/([^/]+)/?$ games.php?view=search&query=$1 [QSA,L]

Open root/index.php and look for 

 if ($_GET['view'] != "") {
        user_access();
      }
	  
and after that add
 require('games_landing.php');
 
 Clear you site cache and visit your new game page 
 
 Inside content/themes/default/templates/games you have 3 widgets
 widget_now_playing.tpl
 top_rated_widget.tpl
 most_played_widget.tpl
 
 you can include it anywhere in your site like this 
 <link href="https://sacredatoz.com/content/themes/default/css/games/nowplaying.css" rel="stylesheet">

<div class="card st-gaming-card border-0">
  <div class="st-gaming-header">
    <h6>
      <span class="st-live-dot"></span>
      LIVE NOW
      <span id="stPlayerCount" class="st-online-count"></span>
    </h6>
  </div>
  <div class="card-body p-0">
    <div id="stNowPlayingWrap" class="p-3 text-center text-muted">
      <i class="fas fa-spinner fa-spin"></i> Loading...
    </div>
  </div>
</div>

<script>
(function () {
  var wrap = document.getElementById('stNowPlayingWrap');
  var countEl = document.getElementById('stPlayerCount');
  
  if (!wrap) return;
  if (typeof $ === 'undefined') {
    wrap.innerHTML = '<div class="p-3 text-danger">jQuery not loaded</div>';
    return;
  }
  
  function esc(s) {
    s = (s === null || s === undefined) ? '' : String(s);
    return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')
            .replace(/"/g, '&quot;').replace(/'/g, '&#39;');
  }
  
  function render(items) {
    if (!items || !items.length) {
      wrap.innerHTML = '<div class="st-empty-state">'
        + '<div class="st-empty-icon">🎮</div>'
        + '<div style="font-size:14px;color:#64748b;">No players online</div>'
        + '</div>';
      if (countEl) countEl.textContent = '0 online';
      return;
    }
    
    if (countEl) countEl.textContent = items.length + ' Plays';
    
    var html = '';
    for (var i = 0; i < items.length; i++) {
      var it = items[i];
      html += '<div class="st-player-card">'
        + '  <img src="' + esc(it.game_thumb) + '" class="st-game-cover" alt="' + esc(it.game_title) + '" '
        + '       onerror="this.src=\'https://sacredatoz.com/content/themes/default/images/blank_game.png\';">'
        + '  <div class="st-player-info">'
        + '    <div class="st-player-meta">'
        + '      <img src="' + esc(it.picture) + '" class="st-avatar" alt="' + esc(it.display_name) + '">'
        + '      <a href="' + esc(it.profile_url) + '">' + esc(it.display_name) + '</a>'
        + '    </div>'
        + '    <div class="st-playing-text">is playing <a href="' + esc(it.game_url) + '" class="st-game-link">' + esc(it.game_title) + '</a></div>'
        + '  </div>'
        + '</div>';
    }
    wrap.innerHTML = html;
  }
  
  function fetchNow() {
    $.ajax({
      url: 'https://sacredatoz.com/apis/now_playing.php?do=list&limit=8&seconds=600',
      method: 'GET',
      dataType: 'json',
      timeout: 5000,
      success: function (res) {
        if (res && (res.success === true || res.status === 'success')) {
          render(res.data || []);
        }
      },
      error: function () {
        wrap.innerHTML = '<div class="p-3 text-danger text-center">Failed to load</div>';
      }
    });
  }
  
  fetchNow();
  setInterval(fetchNow, 10000);
})();
</script> 
 and 
 <style>
/* Keep all your existing styles above */
.st-game-slider-card {
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.st-slider-header {
  background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
  padding: 16px 20px;
  border-bottom: none;
}

.st-slider-header h6 {
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  margin: 0;
  display: flex;
  align-items: center;
  letter-spacing: 0.5px;
}

.st-game-slider-wrapper {
  position: relative;
  overflow: hidden;
  padding: 0 40px;
}

.st-game-slider {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding: 4px 0;
}

.st-game-slider::-webkit-scrollbar {
  display: none;
}

.st-game-item {
  flex: 0 0 140px;
  text-decoration: none;
  transition: transform 0.2s ease;
  display: block;
}

.st-game-item:hover {
  transform: translateY(-4px);
}

.st-game-thumb {
  position: relative;
  width: 140px;
  height: 140px;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  margin-bottom: 8px;
}

.st-game-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.st-play-badge,
.st-rating-badge {
  position: absolute;
  bottom: 8px;
  right: 8px;
  background: rgba(0, 0, 0, 0.75);
  color: #fff;
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 4px;
  backdrop-filter: blur(4px);
}

.st-rating-badge {
  background: rgba(234, 179, 8, 0.9);
}

.st-game-title {
  color: #1e293b;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  width: 140px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.st-game-item:hover .st-game-title {
  color: #3b82f6;
}

.st-slider-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  background: #fff;
  border: none;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  transition: all 0.2s ease;
}

.st-slider-btn:hover {
  background: #f8fafc;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.st-slider-btn.prev {
  left: 0;
}

.st-slider-btn.next {
  right: 0;
}

.st-slider-btn i {
  color: #1e293b;
  font-size: 14px;
}

@media (max-width: 768px) {
  .st-game-slider-wrapper {
    padding: 0 12px;
  }
  
  .st-game-item {
    flex: 0 0 110px;
  }
  
  .st-game-thumb {
    width: 110px;
    height: 110px;
  }
  
  .st-game-title {
    font-size: 12px;
    width: 110px;
  }
  
  .st-slider-btn {
    width: 28px;
    height: 28px;
  }
}
</style>

<script>
function initGameSlider(sliderId, autoSlideInterval = 3000) {
  const wrapper = document.querySelector(`#${sliderId}`);
  if (!wrapper) return;
  
  const slider = wrapper.querySelector('.st-game-slider');
  const prevBtn = wrapper.querySelector('.prev');
  const nextBtn = wrapper.querySelector('.next');
  
  if (!slider || !prevBtn || !nextBtn) return;
  
  const scrollAmount = 300;
  let autoSlideTimer = null;
  let isUserInteracting = false;
  
  // Scroll functions
  function scrollNext() {
    const isAtEnd = slider.scrollLeft >= slider.scrollWidth - slider.clientWidth - 1;
    
    if (isAtEnd) {
      // Loop back to start
      slider.scrollTo({ left: 0, behavior: 'smooth' });
    } else {
      slider.scrollBy({ left: scrollAmount, behavior: 'smooth' });
    }
  }
  
  function scrollPrev() {
    slider.scrollBy({ left: -scrollAmount, behavior: 'smooth' });
  }
  
  // Auto-slide functionality
  function startAutoSlide() {
    if (autoSlideTimer) return; // Already running
    
    autoSlideTimer = setInterval(() => {
      if (!isUserInteracting) {
        scrollNext();
      }
    }, autoSlideInterval);
  }
  
  function stopAutoSlide() {
    if (autoSlideTimer) {
      clearInterval(autoSlideTimer);
      autoSlideTimer = null;
    }
  }
  
  function restartAutoSlide() {
    stopAutoSlide();
    startAutoSlide();
  }
  
  // Button click handlers
  prevBtn.addEventListener('click', () => {
    isUserInteracting = true;
    scrollPrev();
    restartAutoSlide();
    setTimeout(() => { isUserInteracting = false; }, 500);
  });
  
  nextBtn.addEventListener('click', () => {
    isUserInteracting = true;
    scrollNext();
    restartAutoSlide();
    setTimeout(() => { isUserInteracting = false; }, 500);
  });
  
  // Pause on hover
  wrapper.addEventListener('mouseenter', () => {
    isUserInteracting = true;
    stopAutoSlide();
  });
  
  wrapper.addEventListener('mouseleave', () => {
    isUserInteracting = false;
    startAutoSlide();
  });
  
  // Pause on manual scroll
  let scrollTimeout;
  slider.addEventListener('scroll', () => {
    isUserInteracting = true;
    clearTimeout(scrollTimeout);
    scrollTimeout = setTimeout(() => {
      isUserInteracting = false;
    }, 1000);
    updateButtons();
  });
  
  // Update button visibility
  function updateButtons() {
    const isAtStart = slider.scrollLeft <= 0;
    const isAtEnd = slider.scrollLeft >= slider.scrollWidth - slider.clientWidth - 1;
    
    prevBtn.style.opacity = isAtStart ? '0.3' : '1';
    prevBtn.style.pointerEvents = isAtStart ? 'none' : 'auto';
    nextBtn.style.opacity = isAtEnd ? '0.3' : '1';
    nextBtn.style.pointerEvents = isAtEnd ? 'none' : 'auto';
  }
  
  // Initialize
  updateButtons();
  startAutoSlide();
  
  // Cleanup on page unload
  window.addEventListener('beforeunload', () => {
    stopAutoSlide();
  });
}

document.addEventListener('DOMContentLoaded', function() {
  // Initialize sliders with auto-slide every 3 seconds (3000ms)
  initGameSlider('stMostPlayedSlider', 3000);
  initGameSlider('stTopRatedSlider', 3500); // Slightly different timing for variety
});
</script>
 (This is the style and js)