Cookie Consent

Pixelmover · 2018-05-25 23:26:21

New data protection regulations have been introduced in the european union and germany since today.
For this reason, I would like to include a note on the use of cookies on my homepage.
For this I found a website at: https://cookieconsent.insites.com/download/, which provides a script.

<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.js"></script>
<script>
window.addEventListener("load", function(){
window.cookieconsent.initialise({
  "palette": {
    "popup": {
      "background": "#efefef",
      "text": "#404040"
    },
    "button": {
      "background": "#8ec760",
      "text": "#ffffff"
    }
  },
  "content": {
    "message": "Diese Website verwendet Cookies, um Ihnen eine optimale Nutzung der Website zu ermöglichen.",
    "dismiss": "OK",
    "link": "Datenschutzerklärung",
    "href": "https://www.rainerhassmann.de/DS-GVO/"
  }
})});
</script>

A note indicates:
"Add the code in the header of your website, just before the </ head> tag"

Who can tell me where to put this script in backlight.

Thanks

rod barbee · 2018-05-26 00:57:13

You’ll need to use phplugins to insert this. Use the ttg_head hook if you need it in the head tag.
http://backlight.theturninggate.net/doc … _phplugins

Daniel Leu · 2018-05-26 01:33:21

I use exactly the same code on my site as well. Just add it using the ttg_head phplugins' API function:

function ttg_head( $style, $path ) {
echo '
.... this is where the code belongs
';
}

I made two changes: I added the cookieconsent specific CSS to my custom.css file and copied the javascript code to my own site at backlight/custom/js/cookieconsent.min.js. This way my site does not depend on external code.

Pixelmover · 2018-05-27 06:29:15

Hi Daniel.
Thank you for your answer. Unfortunately, my computer skills are not very good and I need more help.
Can you please explain step by step how to integrate the script into backlight?
How do I use the code from your post?

I would be glad if you could give me more help. Thank you

rod barbee · 2018-05-27 07:01:24

you need to use phplugins: http://backlight.theturninggate.net/doc … _phplugins
It will basically be just a copy and paste.

In your Backlight download go to backlight/custom/phplugins. You'll see a bunch of sample phplugins files. Open one of them (for simplicity, use the phplugins-pangolin-sample.php file)
I'd suggest immediately saving it under a different name in a folder on your computer specifically for customizations for your site.
Name it something that make sense (no spaces or special characters: letters, numbers, underscores, hyphens only).

Scroll down the file to line 212 : //SET USER FUNCTIONS BELOW

below this you'll see some sample functions, the first thing being the basic structure for a function.

Copy the sample Daniel gave you above and paste it in just above this bit

/* DELETE THIS LINE
// Basic structure for a PHPlugins function
function _HOOK_( $style, $path ) { 
	echo '

	';
	return false;
} // END /**/

Or simply replace this function with the one Daniel showed you (and delete the indicated line above the function).

Then place your code where Daniel indicated.

Save the file and upload it to your site under /backlight/custom/phplugins/.

Go to your page template (or templates) and under Advanced Customization, enable phplugins and choose your file. Save the template.

That should be it. If you don't see the change, try clearing template and browser cache.

Pixelmover · 2018-05-28 06:15:38

Hi Rod.
sorry, I understood the principle and also the use of the phpplugin. But:

Daniel Leu wrote:

I made two changes: I added the cookieconsent specific CSS to my custom.css file and copied the javascript code to my own site at backlight/custom/js/cookieconsent.min.js. This way my site does not depend on external code.

I also do not want to make my site dependent on an external code.
However, I'm not clear how the code (syntax) for the "custom.css" and the js code "cookieconsent.min.js" must be written.

rod barbee · 2018-05-28 07:15:40

on implementing custom css: http://backlight.theturninggate.net/doc … tylesheets
cookieconsent has its own css that it uses. Add this to your custom css file.

/backlight/custom/js/: the js folder is something Daniel created to hold custom javascript. He placed the cookieconsent.min.js file here and modified the cookie consent code to reference the script at that location rather than the location the script calls out.

So my guess is that instead of this:

<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.js"></script>
.....rest of code....

he's eliminated the first line having to do with the stylesheet (because he's including their styling in his custom css) and modified the second line with the new location of the javascript:

<script src="/backlight/custom/js/cookieconsent.min.js"></script>
.....rest of code....

I'm unfamiliar with cookie consent but they may have the cookieconsent.min.js file available for you to download. If not, then to get the js code, follow the link: https://cdnjs.cloudflare.com/ajax/libs/ … ent.min.js
copy and paste it into a text editor and save it as cookieconsent.min.js. Upload it to your site at /backlight/custom/js/ (create the js/ folder via FTP)

To get their styling, do the same thing: just follow the link they provide to it: https://cdnjs.cloudflare.com/ajax/libs/ … nt.min.css
copy and paste the code into your own custom css file.

Daniel Leu · 2018-05-30 02:18:05

Had now internet for a few days.... I copied the content of cookieconsent.min.css into my custom.css file and as Rod guessed, added cookieconsent.min.js to /backlight/custom/js.

Pixelmover · 2018-05-31 07:01:51

First of all thank you for your help.
Unfortunately, what I did had no success. The cookie consent banner does not appear.

1. I inserted the following code at the end into my "photoart.css":

/*Cookie Consent
================*/

<script src="/backlight/custom/js/cookieconsent.min.js"></script>

then the file cookieconsent.min.css:

.cc-window{opacity:1;transition:opacity 1s ease}.cc-window.cc-invisible{opacity:0}.cc-animate.cc-revoke{transition:transform 1s ease}.cc-animate.cc-revoke.cc-top{transform:translateY(-2em)}.cc-animate.cc-revoke.cc-bottom{transform:translateY(2em)}.cc-animate.cc-revoke.cc-active.cc-bottom,.........cc-btn+.cc-btn{margin-left:0}

then

<script>
window.addEventListener("load", function(){
window.cookieconsent.initialise({
  "palette": {
    "popup": {
      "background": "#efefef",
      "text": "#404040"
    },
    "button": {
      "background": "#8ec760",
      "text": "#ffffff"
    }
  },
  "theme": "classic",
  "content": {
    "message": "Um die Webseite für Sie optimal zu gestalten und fortlaufend verbessern zu können, verwenden wir Cookies. Durch die weitere Nutzung der Webseite stimmen Sie der Verwendung von Cookies zu.",
    "dismiss": "OK",
    "link": "Datenschutzerklärung",
    "href": "https//:www.rainerhassmann.de/DS-GVO/"
  }
})});
</script>

2. I have inserted the following code (from Daniel) into my "photoart.php":

// SET USER FUNCTIONS BELOW
// Some example functions are included below. Feel free to delete or modify unwanted functions.
// ****************************************************************************************************

function ttg_head( $style, $path ) {
echo '

';
}


/* DELETE THIS LINE
// Basic structure for a PHPlugins function
function _HOOK_( $style, $path ) { 
	echo '

	';
	return false;
} // END /**/

3. I have saved in my folder / backlight / custom / js the javascript "cookieconsent.min.js".

In Backlight, I have activated under Advanced Customization, phplugins and custom stylesheet and selected the appropriate files.
I saved the template and clear template cache.
Where did I make a mistake?

Last edited by Pixelmover (2018-05-31 07:21:33)

rod barbee · 2018-05-31 07:28:36

script does not go in your css file.

this bit of code:

<script src="/backlight/custom/js/cookieconsent.min.js"></script>

should be inserted via phplugins using the ttg_head hook.

Since you've saved that file in your backlight/custom/js/ folder, the script should be called in the page.

the code you need to insert should go inside this function:

function ttg_head( $style, $path ) {
echo '

';
}

in between echo '
and ';

try this in your phplugins file:

function ttg_head( $style, $path ) {
	echo '
		<script src="/backlight/custom/js/cookieconsent.min.js"></script>

		<script>
			window.addEventListener("load", function(){
			window.cookieconsent.initialise({
			  "palette": {
				"popup": {
				  "background": "#efefef",
				  "text": "#404040"
				},
				"button": {
				  "background": "#8ec760",
				  "text": "#ffffff"
				}
			  },
			  "theme": "classic",
			  "content": {
				"message": "Um die Webseite für Sie optimal zu gestalten und fortlaufend verbessern zu können, verwenden wir Cookies. Durch die weitere Nutzung der Webseite stimmen Sie der Verwendung von Cookies zu.",
				"dismiss": "OK",
				"link": "Datenschutzerklärung",
				"href": "https//:www.rainerhassmann.de/DS-GVO/"
			  }
			})});
		</script>

	';
}

and only insert the copied css (from cookieconsent.min.css) into your custom css file

Pixelmover · 2018-06-02 07:44:33

Hi Rod, Your last post was just what I did not know about. Many Thanks. Also thanks to daniel.
So my problem is solved and everything works as desired.

rod barbee · 2018-06-02 08:40:05

great!

markh · 2018-06-03 00:14:28

Have been following this post with keen interest. I've manged to get the cookie consent warning to appear very nicely. But there's just one thing bugging me, well...vexing me, actually. Pixelmover has his warning link to a cookie-consent page that opens in a new window. Daniel has his warning link to a cookie-consent page that opens in the same window. I'm assuming this is an "a href target="_blank" thing or an "a href target="_self" thing but I'll be an expletive deleted if I can figure out where that's hiding. Thought I had it tracked down the center of that big block of code in cookieconsent.min.js but I was wrong. My cookie_consent warning links to a page that open in a new window and I'd dearly love to have it open in the same window. What's the secret?
Mark

Daniel Leu · 2018-06-03 01:17:50

markh wrote:

Have been following this post with keen interest. I've manged to get the cookie consent warning to appear very nicely. But there's just one thing bugging me, well...vexing me, actually. Pixelmover has his warning link to a cookie-consent page that opens in a new window. Daniel has his warning link to a cookie-consent page that opens in the same window. I'm assuming this is an "a href target="_blank" thing or an "a href target="_self" thing but I'll be an expletive deleted if I can figure out where that's hiding. Thought I had it tracked down the center of that big block of code in cookieconsent.min.js but I was wrong. My cookie_consent warning links to a page that open in a new window and I'd dearly love to have it open in the same window. What's the secret?
Mark

A link to a page where the problem is shown is always helpful. But if you want to open a link in the same window, just don't use target.

markh · 2018-06-03 01:58:07

Apologies for forgetting to include links but it's moot now.
Hmmm... Stranger still... The page that was opening in a new window is now opening in the same window without my having done anything to change it. Must be proof that quantum physics as it relates to the behavior of electrons is a real "thing".

BerndBerlin · 2018-06-10 00:18:51

Hello, like so many based in the EU I am interested in this topic as well. As interesting as this solution seems - does it affect Google Analytics?

dussel · 2018-06-10 00:40:55

BerndBerlin wrote:

does it affect Google Analytics?

Hej Bernd,
afaik not and i see no reason for that? Did you see something in that Code above, so that you are thoughtful?

HG
Rolf

Community @ The Turning Gate

#1 2018-05-25 23:26:21

Cookie Consent

#2 2018-05-26 00:57:13

Re: Cookie Consent

#3 2018-05-26 01:33:21

Re: Cookie Consent

#4 2018-05-27 06:29:15

Re: Cookie Consent

#5 2018-05-27 07:01:24

Re: Cookie Consent

#6 2018-05-28 06:15:38

Re: Cookie Consent

#7 2018-05-28 07:15:40

Re: Cookie Consent

#8 2018-05-30 02:18:05

Re: Cookie Consent

#9 2018-05-31 07:01:51

Re: Cookie Consent

#10 2018-05-31 07:28:36

Re: Cookie Consent

#11 2018-06-02 07:44:33

Re: Cookie Consent

#12 2018-06-02 08:40:05

Re: Cookie Consent

#13 2018-06-03 00:14:28

Re: Cookie Consent

#14 2018-06-03 01:17:50

Re: Cookie Consent

#15 2018-06-03 01:58:07

Re: Cookie Consent

#16 2018-06-10 00:18:51

Re: Cookie Consent

#17 2018-06-10 00:40:55

Re: Cookie Consent

Board footer