Knowledgebase: General
How Can I Set EU Cookie Law Compliance on my 3dcart Store?

If your business is in Europe, you may be required by your local laws to display cookie consent on your store. If so, there are many javascript and jquery scripts that can be used for this purpose.

For the most part, these scripts are easy to implement and will display a disclaimer to visitors announcing that your site uses cookies for its functionality. The visitor can then click on an "accept" dialog to hide the disclaimer.

As mentioned, there are many free scripts available online that can help you implement this. 3dcart works best with javascript or jquery scripts, so a simple search on Google for the phrases "EU Cookie Directive" and "jquery" should point you in the right direction.

To help you along the way, we've prepared the following article which will help you install a very basic script called jquery.cookiebar which offers this basic cookie law compliance functionality.

Important:
The following article is being offered strictly as a courtesy to help you implement basic EU Cookie Law compliance on your cart.

The steps outlined here will require knowledge in FTP and some basic HTML coding which is not within the scope of 3dcart's technical support services. Wherever possible, we will outline the necessary steps here in this KB Article, but please be aware that 3dcart's support team is neither qualified nor allowed to implement any coding changes for you.

Also note that the script described and used in this article is not developed nor managed by 3dcart. It is a free script readily available by clicking this link.

As such, we are unable to provide direct support or troubleshooting services for the script, and we assume no responsibility in its use. For documentation on using and customizing the script, please refer to the link above.

Ok, we're done with the disclaimer. The rest of this process will be fun. Let's get to it!

Before You Begin

Please be sure to have the following ready before you proceed.

  • An FTP client such as Filezilla or CuteFTP
  • Your store's FTP login information
  • The jquery.cookiebar files (see file attachment at the bottom of this article)
  • A devil may care attitude about editing your store's frame.html file (required)
  • A cavalier, "if at first you don't succeed..." predisposition for trial and error. (optional but highly recommended)

Step 1 - Download the attached Zip File

  1. Scroll down to the bottom of this article and download the attached Zip File. (See jquery.cookiebar.zip)
  2. Unzip the file to retrieve the files from it.

You should have 2 files in the zip archive.

  • jquery.cookiebar.css
    the style sheet used for the jquery cookie disclaimer
  • jquery.cookiebar.js
    the javascript that controls the function.

To continue:

  1. Create a new folder on your computer and call it "eu_cookiebar"
  2. Place the files you unzipped earlier into this new folder.

Now that you have the files needed, our next step will be to upload it to your site via FTP. But first, you need to know which theme folder to upload it to, so let's find that out first.

Finding your Theme

  1. Log into your 3dcart Online Store Manager
  2. Go to Settings ->Design ->Themes & Styles
  3. Make note of the theme your site is using

Armed with the theme folder information, proceed to the next step.

Step 2 - FTP to your Store

  1. Connect to your store's FTP access.

Tip:
If you're unfamiliar with FTP, click here to brush up on it a bit.

We promise that it's really easy once you get the hang of it!

  1. Once you're logged in via FTP, go to web/assets/templates/[themefolder]

Be sure to replace "[themefolder]" with your theme's folder name.

  1. Upload your eu_cookiebar folder (created earlier) to the theme folder in FTP

Alright. That was the hard part. We're halfway there. Onto the next step!

Step 3 - Editing your frame.html file

Next, we need to reference the javascript on your site's frame.html file.

Although this step might be a little scary, we'll do our best to make it as painless and easy as possible.

From your 3dcart Online Store Manager:

  1. Go to Settings ->Design ->Themes & Styles
  2. Click on the "Edit HTML" button
  3. Click on the "edit" button for your frame.html as shown here.
  4. Look for the closing head tag within the HTML coding.

Hint: 
The closing head tag looks like this:

</head>

Add the following code right before the closing head tag.

<!--START: EU Cookie Bar -->
<link rel="stylesheet" type="text/css" href="/assets/templates/[template]/eu_cookiebar/jquery.cookiebar.css">
<script src="/assets/templates/[template]/eu_cookiebar/jquery.cookiebar.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery.cookieBar();
});
</script>
<!--END: EU Cookie Bar -->

Save your changes and let's go test your store!

Now, when you first visit your store, you will see the following banner located at the top.

Clicking on the "I Understand" button will hide the banner and the disclaimer won't appear anymore until the session cookie is reset or expires - which it is set to do after a year has passed.

Note: 
If you are unable to see the banner, try clearing your browser's cache or using an alternate browser since you likely have a session cookie already on your browser.

Tip:
The look and feel of the cookiebar script is pretty customizable since it is handled by the jquery.cookiebar.css file you uploaded in the above steps.

The settings of the actual script are pretty easy to configure as well.

Again, please refer to the scripts original documentation for specifics on what each setting does.



Attachments 
 
 jquery.cookiebar.zip (2.73 KB)

Help Desk Software by Kayako fusion