Capture a Querystring from URL and place into site cookies using Javascript/JQuery in Wordpress

Question

Hoping someone can help :) I have a Wordpress site, which we are sending refer links to, like this... http://website.com/?ref=hotelname&loc=townname. We need to take these queries in the URL and place them into the cookies of the site using javascript. The cookies are then used to populate booking buttons, which then link to an external custom booking engine, and we need to pass the queries using js because php not working properly with our caching. I was recommended this post, but it doesn't seem to work unfortunately How can I get query string values in JavaScript?.

Answer 1

You can do this by javascripts. first you have to get query string from URL and then have to save in cookie using this document.cookie = name + "=" + (value || "") + expires + "; path=/";

<script type="text/javascript">
    // self executing function here
    (function() {
       
        function getParameterByName(name, url = window.location.href) {
            name = name.replace(/[\[\]]/g, '\\$&');
            var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
                results = regex.exec(url);
            if (!results) return null;
            if (!results[2]) return '';
            return decodeURIComponent(results[2].replace(/\+/g, ' '));
        }

        function setCookie(name,value,days) {
        
            var expires = "";
            if (days) {
                var date = new Date();
                date.setTime(date.getTime() + (days*24*60*60*1000));
                expires = "; expires=" + date.toUTCString();
            }
            document.cookie = name + "=" + (value || "")  + expires + "; path=/";
        }

        function getCookie(name) {
            var nameEQ = name + "=";
            var ca = document.cookie.split(';');
            for(var i=0;i < ca.length;i++) {
                var c = ca[i];
                while (c.charAt(0)==' ') c = c.substring(1,c.length);
                if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
            }
            return null;
        }

        function eraseCookie(name) {   
            document.cookie = name +'=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
        }

        // query string: ?ref=hotelname&loc=townname
        var ref = getParameterByName('ref'); 
        var loc = getParameterByName('loc'); 
        
        if( ref !== null ){
            setCookie( 'ref', ref, 365 );
        }
        if( loc !== null ){
            setCookie( 'loc', loc, 365 );
        }

    })();
</script>

For Save, cookie credit goes to Set cookie and get cookie with JavaScript

For getting query string credit goes to How can I get query string values in JavaScript?

Tested and works.