How to Set and Customise a Cookie Banner?

What You’ll Achieve by the End of This Guide: By following this guide, you will gain a clear understanding of how to manage the cookie banner on your website, enhancing user experience for both you and your clients.


Benefits of Setting the Cookie Banner:

  • Compliance with Data Protection Laws: The General Data Protection Regulation (GDPR) and similar laws require websites to obtain explicit consent from users before storing or accessing their personal data through cookies. Cookie banners provide a clear and transparent way to inform users about the cookies used on a website and obtain their consent.
  • User Privacy and Trust: Cookies can collect and store a significant amount of personal data, including browsing history, preferences, and location information. By displaying a cookie banner, websites demonstrate their commitment to user privacy and transparency, building trust with their visitors.
  • Improved User Experience: Cookie banners allow users to make informed decisions about their online privacy and control the data that is collected about them. This can lead to a more positive user experience and increased engagement.
  • Legal and Financial Risks: Failure to comply with data protection laws can result in hefty fines and legal consequences. Cookie banners help mitigate these risks by ensuring that websites have documented consent from their users.

What is a Cookie Banner?

Cookie Banner is a notification that appears on a website to inform users about the use of cookies and to obtain their consent. Cookies are small text files that are used to track user behaviour, store preferences, and personalise the website experience.


Steps to Set a Cookie Banner

  1. Access Your Website:


2. Locate a Cookie Banner:

  • In the Website Editor click on the All pages button.


  • The sidebar menu with all existing pages will be displayed. Find the Pop-ups section and tap on it.


3. Set a Cookie Banner:

  • In the Pop-ups section click on the Add new pop-up button.


  • The Choose widget type modal window will be shown. Here, locate the Pop-ups section and click on the Cookie banner button.


  • Choose the Cookie banner widget from the Widget type menu

The Cookie banner feature is available only for Premium accounts. 

Now you know how to set a cookie banner on your website to create better user experience and enhanced workflow!

Customising the Cookie Banner


1. Access Your Website:

  • In the Hocoos Dashboard, click on the Edit website button.
  • Locate the Cookie Banner in the Website Editor.


2. Customise the Cookie banner:

Use the Widget menu buttons to take the first step in customising your Cookie banner.

  • The Design button gives an option to change the background and text colors for the Cookie banner.


  • To view all represented animations for the Cookie banner tap the Pop-up animation button.


  • The Pop-ups button displays the pop-up, which will be shown to the customer once they enter the website.


  • The Customize Consent Preferences pop-up contains a lot of useful information about types of cookies collected and can be edited as well.


  • To edit the Customize Consent Preferences pop-up use the Design and Pop-up animation buttons.

Using the Design button it’s possible to change the background and text colors for the pop-up.


  • The Pop-up animation button lets you customise the pop-up's animation displayed when a user clicks on the Customize button on the Cookie banner.


  • If you have changed your mind about adding the Cookie banner on your website, click the Remove widget button to delete it.


The next step in customising the Cookie banner process is banner text editing.

  • Use the Edit text button to edit the banner content.


  • Click on the Edit text button to view all options the button offers.

Tip: The default Cookie banner content includes a link to your Cookie policy page. Try to avoid deleting it.


  • Click on the Edit color button to see color options. The available colors from your website's palette will be shown. You can select a custom color using the Color picker button.


The final step lies in customising the Cookie banner buttons.

  • To adjust the Customize button - two options are available.


  • Tap on the Edit text button to display the button text editing options.


  • Click on the Design button to show options for the button's outward.

In the Choose button colors section there are two options: Default and Hover. Both of them are used to change the Background, Border and Text colors of the button. The Default option shows the button's normal color, while the Hover option shows how it looks when the client mouse over it.

Tip: Try to choose the suitable color for the button hover state so that the customer sees that it is active, when they hover over it with their mouse.


The button colors on the Cookie banner will match your website's color palette by default. To change a color, click on it and select a new one using the Color picker tool.

Tip: Better to prepare the color HEX code and insert it in the Color picker tool field.


  • In the Choose all buttons view section there are three button styles.

The button styles are changing dynamically - select the one you like best.

You're All Done! You have successfully learned how to set and customise a cookie banner for your website. Enjoy improved user experience and earn trust from your customers!

See Also:

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us