{% extends 'admin.twig' %}

{% block head %}
    {{ parent() }}
    <link rel="stylesheet" href="plugins/CoreAdminHome/stylesheets/jsTrackingGenerator.css" />
{% endblock %}

{% set title %}{{ 'CoreAdminHome_TrackingCode'|translate }}{% endset %}

{% block content %}

    <div class="card">
        <div class="card-content">
            <h2 piwik-enriched-headline
                help-url="https://matomo.org/docs/tracking-api/"
                rate="{{ 'CoreAdminHome_TrackingCode'|translate|e('html_attr') }}">{{ 'CoreAdminHome_TrackingCode'|translate  }}</h2>
            <p style="padding-left: 0;">{{ 'CoreAdminHome_TrackingCodeIntro'|translate }}</p>
        </div>
        <div class="card-action">
            {{ 'General_GoTo2'|translate }}:
            <a href="#/javaScriptTracking">{{ 'CoreAdminHome_JavaScriptTracking'|translate  }}</a>
            <a href="#/imageTracking">{{ 'CoreAdminHome_ImageTracking'|translate }}</a>
            <a href="#/importServerLogs">{{ 'SitesManager_LogAnalytics'|translate }}</a>
            <a href="#/mobileAppsAndSdks">{{ 'SitesManager_MobileAppsAndSDKs'|translate }}</a>
            <a href="#/trackingApi">{{ 'CoreAdminHome_HttpTrackingApi'|translate }}</a>
            <a href="#/singlePageApplication">{{ 'SitesManager_SiteWithoutDataSinglePageApplication'|translate }}</a>
            <a href="#/google-tag-manager">{{ 'SitesManager_SiteWithoutDataGoogleTagManager'|translate }}</a>
            <a href="#/wordpress">Wordpress</a>
            <a href="#/cloudflare">Cloudflare</a>
            <a href="#/vue">Vue.js</a>
            <a href="#/react">React.js</a>
            {{ postEvent('Template.endTrackingCodePageTableOfContents') }}
        </div>
    </div>

    <input type="hidden" name="numMaxCustomVariables"
           value="{{ maxCustomVariables|e('html_attr') }}">

<div
    matomo-js-tracking-code-generator
    default-site="{{ defaultSiteDecoded|json_encode|e('html_attr') }}"
    max-custom-variables="{{ maxCustomVariables|json_encode|e('html_attr') }}"
    server-side-do-not-track-enabled="{{ serverSideDoNotTrackEnabled|json_encode|e('html_attr') }}"
></div>

<div
    matomo-image-tracking-code-generator
    default-site="{{ defaultSiteDecoded|json_encode|e('html_attr') }}"
></div>

<div piwik-content-block content-title="{{ 'SitesManager_LogAnalytics'|translate|e('html_attr') }}"
     anchor="importServerLogs">
    <p>
        {{ 'CoreAdminHome_ImportingServerLogsDesc'|translate('<a href="https://matomo.org/log-analytics/" rel="noreferrer noopener" target="_blank">','</a>')|raw }}
    </p>
</div>

<div piwik-content-block content-title="{{ 'SitesManager_MobileAppsAndSDKs'|translate }}" anchor="mobileAppsAndSdks">
    <p>{{ 'SitesManager_MobileAppsAndSDKsDescription'|translate('<a href="https://matomo.org/integrate/#programming-language-platforms-and-frameworks" rel="noreferrer noopener" target="_blank">','</a>')|raw }}</p>
</div>

<div piwik-content-block content-title="{{ 'CoreAdminHome_HttpTrackingApi'|translate }}" anchor="trackingApi">
    <p>{{ 'CoreAdminHome_HttpTrackingApiDescription'|translate('<a href="https://developer.matomo.org/api-reference/tracking-api" rel="noreferrer noopener" target="_blank">','</a>')|raw }}</p>
</div>

<div piwik-content-block content-title="{{ 'SitesManager_SiteWithoutDataSinglePageApplication'|translate }}" anchor="singlePageApplication">
     <p>{{ 'CoreAdminHome_SinglePageApplicationDescription'|translate('<a href="https://developer.matomo.org/guides/spa-tracking" rel="noreferrer noopener" target="_blank">','</a>')|raw }}</p>
</div>

<div piwik-content-block content-title="{{ 'SitesManager_SiteWithoutDataGoogleTagManager'|translate }}" anchor="google-tag-manager">
    <p>{{ 'CoreAdminHome_GoogleTagManagerDescription'|translate('<a href="https://matomo.org/faq/new-to-piwik/how-do-i-use-matomo-analytics-within-gtm-google-tag-manager/" rel="noreferrer noopener" target="_blank">','</a>')|raw }}</p>
</div>

<div piwik-content-block content-title="Wordpress" anchor="wordpress">
    <p>{{ 'CoreAdminHome_WordpressDescription'|translate('<a href="https://matomo.org/faq/new-to-piwik/how-do-i-install-the-matomo-tracking-code-on-wordpress/" target="_blank">','</a>')|raw }}</p>
</div>

<div piwik-content-block content-title="Cloudflare" anchor="cloudflare">
    <p>{{ 'CoreAdminHome_CloudflareDescription'|translate('<a href="https://matomo.org/faq/new-to-piwik/how-do-i-install-the-matomo-tracking-code-on-my-cloudflare-setup/" rel="noreferrer noopener" target="_blank">','</a>')|raw }}</p>
</div>

<div piwik-content-block content-title="Vue.js" anchor="vue">
    <p>{{ 'CoreAdminHome_VueDescription'|translate('<a href="https://matomo.org/faq/new-to-piwik/how-do-i-install-the-matomo-tracking-code-on-websites-that-use-vue-js/" rel="noreferrer noopener" target="_blank">','</a>')|raw }}</p>
</div>

<div piwik-content-block content-title="React.js" anchor="react">
    <p>{{ 'CoreAdminHome_ReactDescription'|translate('<a href="https://matomo.org/faq/new-to-piwik/how-do-i-start-tracking-data-with-matomo-on-websites-that-use-react/" rel="noreferrer noopener" target="_blank">','</a>')|raw }}</p>
</div>


{{ postEvent('Template.endTrackingCodePage') }}

{% endblock %}
