This tutorial provides the steps to add a Cookie Consent bar in Genesis based child themes.
Works with other WordPress themes too.
STEP 1
Go to https://cookieconsent.insites.com/download/ and configure the cookie consent design and compliance type.
You can see the live Preview or see Cookie Consent demos. https://cookieconsent.insites.com/demos/
STEP 2
Open functions.php of your child theme and add the following:
add_action( 'wp_head', 'custom_cookie_consent' ); /** * Add Cookie Consent bar in WordPress. * * @link https://cookieconsent.insites.com/download/ */ function custom_cookie_consent() { ?> <!-- Cookie Consent --> <?php }
Copy the code from the Cookie Consent site and paste it after the line
<!-- Cookie Consent -->
Example:
add_action( 'wp_head', 'custom_cookie_consent' ); /** * Add Cookie Consent bar in WordPress. * * @link https://cookieconsent.insites.com/download/ */ function custom_cookie_consent() { ?> <!-- Cookie Consent --> <link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.css" /> <script src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.js"></script> <script> window.addEventListener("load", function(){ window.cookieconsent.initialise({ "palette": { "popup": { "background": "#000" }, "button": { "background": "#f1d600" } }, "theme": "classic", "position": "bottom-left" })}); </script> <?php }
It would be better to split Osano code into two parts and load CSS in head, but JavaScript in the end of the body. This could be achieved by adding
add_action( 'wp_footer', 'custom_cookie_consent_body' );
Yes, Correct. However, it seems like Cookie Notice need to show first so i just used wp_head.