Quick Access

Set up your Quick Access method

Default Quick Access

After consent is exercised by the user (does not matter which option is selected), Beautiful Consent will transform itself to a minimised version, which we call ‘Pill’.

By default, the quick access created for your website is a floating cookie pill that will appear in the position and size that you selected during the configuration of the module.

Pill sizes

This Quick Access method can be as small and simple as a cookie icon, and as big as a large pill where the selected consent of the user is explicitly indicated. There are three sizes: small (floating button, the most preferred by most websites), medium (more detailed), and large (which explicitly shows the decision the user took about consent in your site).

Trigger Selector

If you don't like the floating pill, we can designate another element on the website to function like the pill, displaying the banner when clicked. To implement this, we need two things:

  • Which element will trigger the action.
  • The element’s identifier so we can execute the action.

This identifier is called a CSS Selector, which is used to target HTML elements on a webpage based on their attributes, classes, IDs, or hierarchy within the document structure.

CSS Selector

The Trigger Selector is based on assigning the same responsability that the floating pill had, to an element within your website. For this element, we recommend to create a simple empty link in your footer with a specific ID.

How can I get the CSS Selector of an element in my website?
  1. Open Developer Tools
  • Right-click on the element you want to select.
  • Click "Inspect" (this opens the Elements tab in DevTools).

  1. Find the Element in the HTML
  • The element will be highlighted in the Elements panel.

  1. Copy the CSS Selector
  • Right-click the highlighted element in the Elements panel.
  • Hover over "Copy" and select "Copy selector".

  1. Paste the selector in the Personalization view