Will Blogger Show The notice on Custom Domains also?
Of course it will!
Note that all blogspot blogs which are using the default .blogspot.com Domains ( country-code Top Level Domain or ccTLD) or custom domains (such as .com, .net, .org etc.) will automatically show the following sticky Notice at the top of the page when a user visits that blog from a browser in a European Country:
This site uses cookies from Google to deliver its services, to personalise ads and to analyse traffic. Information about your use of this site is shared with Google. By using this site, you agree to its use of cookies.Learn More Got it
The message will disappear when the user clicks Got it.
Is it shown on all Country Specific URLs ccTLD?
It will be shown only to visitors from European Union associated countries like Italy, France, UK, Denmark, Sweden, Greece, Germany etc.
You won't see the notice outside of the EU.
How to see the Notice if you are Outside European Union?
To see the notice if you’re outside of the EU, view your blog and change the country code, for example blogspot.it, blogspot.fr or blogspot.co.uk.
If you use a custom domain, you can use a EU IP Proxy address to browser your site. A Simple trick is to add the following string parameter just after your custom domain:
.prx.gb.teleport.to
Like in our case to visit www.mirakkel.in in united kingdom we will type the following URL in address bar:
http://www.mirakkel.in.prx.gb.teleport.to
Clicked the 'Got it' button and now you can not see the notice bar again?
Use the Netherlands proxy and it will appear again! Make sure you don't click got it this time else you will have to delete your browser cookies to make it appear again :)
.prx.us.teleport.to
Can We Hide or Disable the EU Cookies Notice?
Yes you can but only if you are already displaying a custom message using custom script on Top of your blog which informs users about the use of cookies on your site. If you are not using any such script to inform readers about cookies then you are obliged to display the Blogger Default notice instead. You must not choose to avoid informing readers about the use of Cookies on your blog. Doing such may cause your blog to get banned.
If you are already using a custom script to inform readers about Cookies used by 3rd part services on your blog and the message clearly links to your Privacy Statement page then you can surely choose to disable the default notice by add the following script just above </head> tag inside your template
<script type="text/javascript">
cookieChoices = {};
</script>
How Do the Notice Look Like?
You must not try to hide this notice bar like we normally hide the Blogger navbar. If in case you have not hidden the blogger navbar then the message will look like this:
If you have chosen to hide the navbar then the message will display like this:
Lets Customize the EU Cookies Notice Bar!
Before: A Long Textual string with dull colors.
After: A Neat and cleaner message with custom colors.
The default Notice is a long lengthy text with dull colors, in order to make sure to display a custom Short message to your readers that may also match your Template color theme then follow the steps below:
1 Go To blogger > Template > Backup your template
2 Click Edit HTML
3 Paste the following code just below ]]></b:skin> tag
<!--Custom EU Cookies Notice by STCnetwork.org-->
<script type="text/javascript">
cookieOptions = {
msg: "This site uses cookies to help deliver services. By using this site, you agree to the use of cookies.",
link: "https://www.blogger.com/go/blogspot-cookies",
close: "Got it!",
learn: "Learn More" };
</script>
<style>.cookie-choices-info {z-index:999999!important;background-color:#333333!important;border-bottom: 1px solid #6FC415;
box-shadow: 1px 2px 2px #000!important; padding:3px 0px!important;}.cookie-choices-info .cookie-choices-text{font-size:14px !important; color:#dddddd!important;}.cookie-choices-info .cookie-choices-button{ background-color: #6FC415!important;border-radius: 1px!important;box-shadow: 2px 3px 2px #000!important; padding:6px!important;text-transform: none!important;}</style>
You can make the following customization if you want:
- Replace the black bolded text with any message you may like.
- If you want you can replace the yellow highlighted link with your Custom Privacy Statement page else you can leave it as it is because the default link points to Blogger's Privacy page for Cookies info.
- To change Notice Bar background color edit #333333
- To change the green border that appears at the bottom of the bar edit #6FC415
- To change the background color of Buttons edit #6FC415
- To change the font color edit #dddddd
4 Save your template and you are all done!
Related topic : How to Use Cookies in Javascript?
Hi Mustafa sir, Glad you came up with this. When that notification appeared I promptly closed it and missed reading it. Then I read about it on the forum. That custom cookie notification looks really cool because it agrees to your blog theme.
Thanks for sharing. :)
Done, but now I wanted to test and have to delete cookies because the message is not showing thanks to cookies... lol
Brother i am not seeing any notice bar on my blog. I tried to view using UK proxy address but still not seeing. I am still confused.
Do i have to add it manually on by blog?
Helpful post. It cleared all my confusions.
Thanks
Thank you so much for this tip. Its working like a charm.
It must display even if you have not added the script above.
Add the code I shared above and then test again. If it did not work then share your URL here
lol that is surely funny in this case but it has a solution too. Try different IP address like instead of using the UK proxy, use that of sweden or italy! =d
It works this way
A Custom control of elements on any webpage is the best way to make sure you control everything as per your preferences. So glad you found it interesting and useful =)
All pleasure is ours. Thank you for trying it out :)
I am so glad it helped you better understand EU cookies Policy :)
Hello, I followed your directions and I haven't noticed that a notice bar comes up when I tested it. Could you please help me?
What if we redirect them to our own blog page where we define how Google uses cookies instant of Google Privacy and term Page.
Thank you Mohammad Bhai again
When it start displaying on my blogger control panel of my site http://munnartourguide.com/, I was little bit confused and worried. And really about to mentioned in MBT forum..
You guys as always on time in this case as well.. Thank you for clearing the doubts of bloggers like me
Keep educate us and keep going.. All the best for entire team
Thnak you Mohammad!
I live in Bulgaria, EU and this EU requirement made such blogs really ugly. I used your method and it is better, but still problematic. Half of the name of my site of the home page is not visible. Could this bar be more narrow? And could it be even a little transparent?
Thanky you in advance.
Veselin Kisiov,
Your faithful reader. :)
Well thanks for this awesome post. And also for helping me out and publishing this detailed post.
Is there a way this bar to be put on the downside, not on the top?
This is a great help for me. There is small mistake.... add a comma between this classes .cookie-choices-info, .cookie-choices-button so that the code works and one more thing no need of style tag as we are ding this in css section otherwise a comment like symbol is appearing. thanks once again.
I just checked them but its not showing any-kind of message on my blog .. Please help me .. I just done like what you said
http://www.howi.in.prx.gb.teleport.to/
but i can't see any message .
I also on the Nav bar ... But no message
Thank You for the tip! My question is I have privacy policy page which is generated using online tool and have cookies statement! so, what should I do? should I also do the same thing.
ok Thank You so much! Got it! I have fully customized it! Mustafa! You are real helper buddy! I was confused with the message and you solved the great problem!
That is not a mistake buddy but the way to declare a sub css class inside a parent class.
Style tags are important because I have mentioned in the tutorial to paste the code outside b:skin tag and not inside it.
I checked your blog and it is working just fine. I guess you fixed it :)
Kindly share your URL so that we could help.
First kindly add the script that we shared above
Replace this code:
.cookie-choices-info {z-index:999999!important;background-color:#333333!important;border-bottom: 1px solid #6FC415; color:#ffffff!important;
box-shadow: 1px 2px 2px #000;}
with this:
.cookie-choices-info {z-index:999999!important;background-color:#333333!important;border-bottom: 1px solid #6FC415; color:#ffffff!important;
box-shadow: 1px 2px 2px #000;bottom:0!important; top: inherit!important;}
That simple! :)
sure you can do that! Just replace the link inside the script above :)
Thank you for your kind feedback. I am glad you found it useful :)
To make it thinner add this css code :
.cookie-choices-info .cookie-choices-inner { padding: 5px 8px!important;}
We can make it transparent but then it wont be supported in IE browsers properly.
Thank you for being a great reader always :)
Always welcomed dear hassan :)
I am so glad your confusion is removed now. A sticky bar is important and inside it you can link to your privacy statment page if you want.
I am glad you installed the above script which is a better option for most of us :)
Thank you very much, Mohammad! It is much better now. I couldn't do it without you :)
Thank You! I have customized my EU Cookies Notification Bar.
Mohammad sir
i do this in my blog but
message box not appear http://www.supportgujarat.com
Hi! How I can change the text size for message and for button? Thank you!
Add our script and then delete your browser cookies. Recheck it will appear again
Thanks for posting this! It works like a charm.
I see automatically changed the font size and color. What can be the same as before?
Mohammad, do you think I could remove the standard "cookies bar" and add the Sticky Bar with the same information?
I see many pages displaying the cookies message on the footer, and it looks less intrusive :)
Best it showed on my site but when i click on learn more then there was 404 page in front of me. is it remain like this or there is solution to it
Mohammad I stripped out the .blogerspot portion from my blog name PennyPimnghersPal dot com and used your suggestion of the IP proxy to test and I get a popup notification similar to the one that Google uses, but it does not look the same. I was wondering if you could explain why it looks different? Thank you for the tutorial as it relieved me of some anxiety I was feeling when I thought that my site would not be in compliance with the new EU law.
after how much time the notification will be remove because i do that all but cookies EU bar not removed from mine blog dashboard :(
Click the cross button on the notification in your dashboard. It may not appear again. If it does, see that you have installed the script I provided above.
If it appears again, then just ignore it and the blogger team will remove it once they see the script installed on your blog
Install my custom script and CSS styles to make sure it looks like the one shown in demo buddy :)
Install my custom script and make sure the link has been added to https://www.blogger.com/go/blogspot-cookies
You can surely do that but the advantage of using the above script is that. This notice bar will be shown only to EU visitors and not to everyone.
It looks quite annoying if all your visitors are shown this notice.
Plus once the user clicks "Got it" the notice bar is not shown again.
You can show the script in blog footer as well by simply making this change:
Replace this code:
.cookie-choices-info {z-index:999999!important;background-color:#333333!important;border-bottom: 1px solid #6FC415; color:#ffffff!important;
box-shadow: 1px 2px 2px #000;}
with this:
.cookie-choices-info {z-index:999999!important;background-color:#333333!important;border-bottom: 1px solid #6FC415; color:#ffffff!important;
box-shadow: 1px 2px 2px #000;bottom:0!important; top: inherit!important;}
That simple! :)
I have updated the code. Please use the updated styles.
Update
Blogger has rewrite the stylesheet for notice bar so I have updated the CSS styles accordingly. If you have noticed the font colors and size changing, then you may kindly install the updated code shared above in the tutorial.
Works perfectly. Thank you very much Mohammed!