URL Referrer cu jQuery sau Javascript - Problemă Cache și URL Referrer

Sper că mă poate ajuta cineva : )

Ceea ce încerc să fac este să obțin referrer-ul primei vizite și să-l trimit către formular. Folosim plugin-ul Contact form 7, așa că am creat un câmp ascuns, obțin URL-ul referrer și atribui acea valoare câmpului ascuns.

Totul a funcționat bine până când am activat cache-ul.

Aceasta este funcția pe care o folosesc (în caz că va avea cineva nevoie de ea)

function getRefererPage( $form_tag ){
    if(!isset($_COOKIE['external_referrer_cookie']))
    {

    }
    if ( $form_tag['name'] == 'referer-page' ) {
        $form_tag['values'][] = $_COOKIE['external_referrer_cookie'];
    }
    return $form_tag;
}
add_filter( 'wpcf7_form_tag', 'getRefererPage' );

Unde "referer-page" este numele și ID-ul câmpului ascuns din formularul Contact Form 7.

Odată ce am activat cache-ul, a trebuit să mă gândesc la o soluție Javascript sau jQuery pentru a seta cookie-ul.

Am adăugat jQuery Cookie Plugin (https://github.com/carhartl/jquery-cookie) și apoi am încercat mai multe variante diferite ale codului de mai jos pentru a crea un cookie și a seta valoarea acestuia.

Obiectivul meu este: Când vizitatorul website-ului vine pentru prima dată, să setez valoarea cookie-ului la URL-ul referrer, dar apoi să păstrez valoarea, de exemplu dacă vizitatorul vine pe website de pe google.com și apoi navighează prin paginile website-ului, când completează formularul, valoarea din câmpul ascuns ar trebui să fie tot URL-ul de google cu parametrii săi.

Acesta este codul JS pe care îl am acum în footer.php al temei.

jQuery(document).ready(function($){  // ÎNCEPUT JQUERY PERSONALIZAT FĂRĂ CONFLICT
    // $.cookie('mysite_referrer', document.referrer);
    // var initreferrer = document.referrer;
    // $.cookie('mysite_referrer', initreferrer);
    //console.log('referrer cookie curent:'+$.cookie('external_referrer_cookie'));
    //console.log('testare');
    $.cookie('external_referrer_cookie');
    if ($.cookie('external_referrer_cookie') == 'undefined' ) { 
        // console.log('setare cookie pentru'+ document.referrer); 
        $.cookie('external_referrer_cookie', document.referrer);
        $('.wpcf7-text.referer-page').val($.cookie('wsg_external_referrer_cookie'));
        console.log('referrer cookie curent:'+$.cookie('wsg_external_referrer_cookie'));
    }
    // $('#referer-page').val($.cookie('external_referrer_cookie'));
    console.log('referrer cookie în afara funcției:'+$.cookie('external_referrer_cookie'));

    /*
    var cookieName = 'cookietest';
    $(function() {
        checkCookie();
    });

    function checkCookie() {
        if (document.cookie.length > 0 && document.cookie.indexOf(cookieName + '=') != -1) {
                // nu face nimic, cookie-ul a fost deja trimis
        } else {
                // gestionează animația jQuery

                // setează cookie-ul pentru a arăta că utilizatorul a vizitat deja
                document.cookie = cookieName + "=1";
        }
    }
    */

}); // SFÂRȘIT JQUERY PERSONALIZAT FĂRĂ CONFLICT

După cum puteți vedea în liniile comentate, am încercat multe abordări pe care le-am găsit în mai multe tutoriale de pe diferite site-uri. M-am chinuit cu asta câteva zile, vă rog să mă ajutați : ))

Mulțumesc