# Установка в веб-приложение (на сайт)

Выполнив все необходимые настройки в Топ-100, можно добавить соответствующий счетчик в веб-приложение. Для этого в HTML-код сайта следует вставить сгенерированный код.

Для корректного подсчёта статистики необходимо установить код на все страницы сайта.

{% hint style="warning" %}
**ВНИМАНИЕ!** Для корректного подсчета событий для single-page application следует использовать метод [`trackPageview`](https://github.com/top-100-writer/documentation/blob/master/nachalo-raboty-s-top-100/ustanovka-schyotchika-top-100/broken-reference/README.md).
{% endhint %}

Код можно встроить в любое место HTML-кода. Рекомендуется вставлять его в начало страницы, чтобы счётчик успел загрузиться при коротком визите.

**Пример кода счетчика для асинхронной загрузки:**

```
<!-- Top100 (Kraken) Counter -->
<script>
(function (w, d, c) {
    (w[c] = w[c] || []).push(function() {
        var options = {
            project: 'PROJECT_ID'
        };
        try {
            w.top100Counter = new top100(options);
        } catch(e) { }
    });
    var n = d.getElementsByTagName("script")[0],
    s = d.createElement("script"),
    f = function () { n.parentNode.insertBefore(s, n); };
    s.type = "text/javascript";
    s.async = true;
    s.src =
        (d.location.protocol == "https:" ? "https:" : "http:") +
        "//st.top100.ru/top100/top100.js”;
    if (w.opera == "[object Opera]") {
        d.addEventListener("DOMContentLoaded", f, false);
    } else { f(); }
})(window, document, "_top100q");
</script>
<noscript><img src="//counter.rambler.ru/top100.cnt?pid=PROJECT_ID"></noscript>
<!-- END Top100 (Kraken) Counter -->
```

**PROJECT\_ID** (обязательный) - id проекта, полученный при регистрации счётчика

> ***Примечание:** Можно добавить на страницу сайта код счетчика для синхронной загрузки. Но следует иметь в виду, что при синхронной загрузке, пока счётчик не инициализируется полностью, все остальные скрипты не будут загружены.*

**Пример кода счетчика для синхронной загрузки:**

```
<script src="//st.top100.ru/top100/top100.js"></script>
<script>
    var options = {
        project: 'PROJECT_ID'`
    };
    try {
        window.top100Counter = new top100(options);
    } catch(e) { }
</script>
<noscript><img src="//counter.rambler.ru/top100.cnt?pid=PROJECT_ID"></noscript>
<!-- END Top100 (Kraken) Counter -->
```

{% hint style="warning" %}
**ВНИМАНИЕ!** Статистика перестанет собираться, если на вашем сайте не будет ни одного посещения в течение девяти календарных дней. При этом в случае участия в рейтинге сайт оттуда пропадёт, и соответствующая настройка счетчика будет сброшена. Если в дальнейшем будет зафиксировано посещение, то сбор статистики возобновится. Участие в рейтинге автоматически восстановится, и сайт будет возвращен в рейтинг.
{% endhint %}


---

# 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://top-100-writer.gitbook.io/top100-documentation/nachalo-raboty-s-top-100/ustanovka-schyotchika-top-100/ustanovka-v-veb-prilozhenie-na-sait.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.