Skip to content

Руководство по интеграции виджетов

Узнайте, как эффективно интегрировать рекламные виджеты на ваш сайт.

Базовая интеграция

Добавьте этот скрипт в ваш HTML:

html
<script type="text/javascript" src="https://cdn.tgads.space/assets/js/tg-ads-co-widget.min.js"></script>
<script type="text/javascript">
    document.addEventListener('DOMContentLoaded', () => {
        const tgAds = new TGAdsWidget({
            wid: 'YOUR_WIDGET_ID',
            adFormat: 'push-like', //adFormat только такие: push-like/interstitial/reward-redirect
            firstAdImpressionIntervalInSeconds: 5, // по умолчанию если параметр не задан, реклама покажется через 20 секунд после загрузки приложения
            adImpressionIntervalInSeconds: 100, // по умолчанию если параметр не задан, реклама будет показываться с периодичностью 200 сек
            debug: true // можно передать debug параметр для дебага, он всегда будет возвращать !тестовую! рекламу. На продакшене не использовать :) 
        });
        tgAds.init(); // этот метод необходимо вызывать если хотите чтоб реклама показывалась автоматически в зависимости от заданных параметров
    });
</script>

Если вы собираетесь интегрировать скрипт не в автоматическом режиме а в ручном, например rewarded / tasks mode: Существует несколько методов и событий которые нужно использовать для этого Метод запроса рекламы:

js
tgAds.requestAd('interstitial'); // request an Ad interstitial/push-like

Подписаться на события когда реклама найдена:

javascript
 tgAds.on('adReceived', (adList) => {
    tgAds.displayAd(adList); //отобразить рекламу в формате в котором она была запрошена
    tgAds.redirectToAd(adList); // или отправить пользователя сразу на рекламную ссылку без показа
    // убедитесь что используете только один из этих двух методов
});

Привет ответа и содержание переменной adList:

json
[{
    "creativeUrl": "https://cdn.tgads.space/creatives/images/cf5e1ddb279099500910042f4c897ea2.webp",
    "notificationUrl": "https://postback.tgads.live/impression?imp_id=64c286d8-04a2-4f4b-ac80-e455d8cbe020",
    "clickUrl": "https://postback.tgads.live/click?click_id=64c286d8-04a2-4f4b-ac80-e455d8cbe020",
    "buttonText": "Go!",
    "title": "Ready for action, User? Play now!",
    "adFormat": "push-like",
    "description": "Blast Cannon: Aim, fire, win\u2014just for you! "
}]

Подписка на событие когда реклама не найдена:

javascript
tgAds.on('noAdFound', () => {
    console.log('no ad found');
});

Подписка на событие когда реклама найдена и пользователь принудительно был отправлен на рекламную ссылку, то есть вызван метод redirectToAd

javascript
tgAds.on('adRedirected', () => {
    alert('clicked and redirected');
});

Реклама показана

javascript
tgAds.on('adDisplayed', () => {
    alert('Ad Displayed');
});

Реклама полностью показана и таймер истек

javascript
tgAds.on('adPlaybackCompleted', () => {
    alert('adPlaybackCompleted');
});

Как выглядит реклама?

Это Interstitial/Pushlike форматы. Можно посмотреть в нашем примере в TG mini apps @TGAdsExampleBot