Jednoduchý návod, jak vkládat javascripty a styly do WordPressu jsme si už ukázali. V tomto článku se dozvíte, jak do javascriptu vkládat proměnné. K čemu je to vůbec dobré? Primárně to slouží pro použití překladů ve frontent části. My si nicméně dnes ukážeme, jak to využít při pokročilém kódu pro Google Analytics.

Velmi jednoduché nastavení proměnné vypadá takto:

wp_enqueue_script('my-script', get_template_directory_uri() . '/js/my_js.js');
wp_localize_script('my-script', 'myScriptData', array('item' => 'A'));

První je třeba provést enqueue scriptu, ke kterému chcete proměnnou přiřadit. Přiřazení proběhne před zvoláním zdroje /js/my_js.js, takže v jeho scriptech už bude k dispozici. Mezi parametry funkce wp_localize_script() patří:

• Název scriptu před který se má proměnná vložit, v našem případě my-script
• Název proměnné v javascriptu
• Pole proměnných. Můžete vnořit i další pole. Veškeré integery se převedou na stringy. U nás bychom si zavolali myScriptData.item a dostali bychom string `A`

Pokročilé měření v Google Analytics

Pro příklad jsem si ještě připravil malou ukázku jak javascriptové proměnné využít v praxi. Ukážeme si, jak pro svoje články sledovat custom dimenze. V Google Analytics si díky tomu budeme moci zobrazit, z kterého roku jsou nejčtenější články nebo který autor je nejvíce čtený (případně rubrika, custom fieldy, cokoliv chcete).

Základ v PHP souboru:

function myAnalytics()
{
    $data = array();

    if (is_single()) {
        $post = get_post();
        $data['year'] = get_the_date('Y');
        $data['author'] = get_the_author_meta('user_email', $post->post_author);
    }

    wp_enqueue_script('my-script', get_template_directory_uri() . '/js/analytics.js');
    wp_localize_script('my-script', 'analyticsData', $data);
}

add_action('wp_enqueue_scripts', 'myAnalytics');

Do proměnné data budeme vkládat analytické informace. A pouze v případě, že je zobrazován detail příspěvku. V takovém případě ji naplníme rokem a emailem autora. Lepší by bylo vložit jeho ID, které se nemění, ale na druhou stranu budou data přehlednější, protože nebudou obsahovat nicneříkající čísla.

Nesmí chybět javascriptový soubor, kde budeme nastavovat dimenze:

ga('create', 'XYZ', 'auto');

if (analyticsData.year) {
    ga('set', 'dimension1', analyticsData.year);
}

if (analyticsData.author) {
    ga('set', 'dimension2', analyticsData.author);
}

Určitě se ptáte co znamená dimension1 a dimension2. Doporučuji projít si manuál k vlastním dimenzím od Googlu a www.primakurzy.cz. Zde také naleznete návod, jak si pro tyto proměnné vytvořit v analytikách vlastní přehled.