How to Use Borlabs Cookie Plugin with JetElements

Borlabs Cookie is a plugin that helps you comply with cookie consent regulations on your WordPress website. When working with the JetElements plugin, you may want to block certain types of content, such as maps, until a user provides consent. 

WordPress Cookie Consent Plugin Setup

Activate the Borlabs Cookie Plugin license

After activating the plugin, you will be redirected to the Plugins page. Locate the Borlabs Cookie plugin and press the “License” link to continue the installation process.

As an alternative, you can go to the License section via the path: WordPress Dashboard > Borlabs Cookie > System > License.

On the License page, you will find the following set of features.

The Your License Information section includes the following features:

• License Status — a field that displays the current license validity;
• Confirm Refresh — a checkbox that confirms refreshing of the license;
• “Refresh License Information” — a button that updates the license details.

The Your License section includes the following features:

• License Key — a field that is used to enter the license key;
• “Save all settings” — when clicked, saves all of the changes made.

The Remove License section includes the following features:

• Confirm license removal — a “Confirmed” checkbox that should be ticked when confirming the license removal;
• “Remove License” — a button that deletes the current license.

To activate the license, find the License Key field, enter the license key value into the field, and press “Save all Settings”.

Now, the installation process is complete.

Activate the plugin features on your website

To make sure the Borlabs Cookie plugin is working properly and is fully compatible with JetElements, you need to install the JetElements package. To do so, follow the path: WordPress Dashboard > Borlabs Cookie > Library:

• in the search bar, type “JetElements” to find the installation package and click “Send”;
• when a JetElements compatibility patch appears, click on the “Details” button to go to the patch page;
• on the patch page, scroll down and click the “Install” button.

By following these steps, you ensure that cookies are only activated when users provide consent, keeping your website compliant with privacy regulations.

On the package installation page, one can find the following installation components.

The Package Information section contains the details of the package, including the description, type of the patch, installation date, version number, and so on.

The Package Components section contains the following information:

• Compatibility Patches — a “jet-elements” compatibility patch is included in this package and is necessary for the proper functioning of this package;
• Content Blockers — a Google Maps “google-maps-jet-elements” content blocker is included in this package and is necessary for the proper functioning of this package;
• Script Blockers — a Google Maps Api “google-maps-api” script blocker is included in this package and is necessary for the proper functioning of this package;
• Services — a Google Maps “maps” service is included in this package and is necessary for its proper functioning.

Also, you can check the language configuration settings.

Within the section Configure Language: EN (en), one can turn on/off language options:

• Google Maps – Settings (Content Blocker) — both options are enabled by default:
  • Overwrite Translation — a switch that turns translations on or off; when enabled, the text will be replaced by translations provided within the package. If you prefer to keep your translation and only adjust the component settings, turn off this option;
  • Overwrite Code — a switch that turns code updates on or off; when enabled, elements like Images, HTML, CSS, Global, and Initialization code will be replaced by the package’s code. To keep your custom code changes intact while updating only component settings, turn this option off.
• Google Maps – Settings (Service) — a section that includes the following fields:
  • Overwrite Translation — a switch that is enabled by default and controls translations. If enabled, package-provided translations will replace your existing text. Turn off this setting to maintain your translation while adjusting only the component settings;
  • Overwrite Code — a switch that is enabled by default and controls code replacement. When enabled, it updates the Opt-in, Opt-out, and Fallback code with the package’s code. To keep your modifications while only changing component settings, turn off this option;
  • Service Group — a dropdown that allows choosing the service group of the cookie, with options including “Essential”, “External Media”, “Marketing”, “Statistics”, and “Unclassified”.

The Reinstallation section contains a single button, “Reinstall”, which allows one to reinstall the package if necessary.

The Auto Update Settings section includes the following options: 

• Enable Auto Update — a switch that is turned off by default. When enabled, the package will automatically update to the latest version;
• Overwrite Code on Auto Update — a switch that is turned on by default. When enabled, this setting will replace your existing code (including Content Blocker: Image, HTML, CSS, Global, and Initialization, as well as Service: Opt-in Code, Opt-out Code, and Fallback Code) with the latest version from the package. To keep your custom code modifications and only update component settings, leave this option disabled;
• Overwrite Translation on Auto Update — a switch that is turned on by default. When enabled, text translations will be overwritten with the package’s latest version during auto-updates. To maintain your custom translations and only update component settings, turn off this option;
• “Save all settings” — when clicked, saves all of the changes made.

The Uninstall section includes a single button, “Uninstall”, which allows you to uninstall the package if necessary.

Activating the Content Blocker

To prevent the map from loading until cookie consent is granted, use the Content Blocker feature in Borlabs Cookie.

Navigate to WordPress Dashboard > Borlabs Cookie > Content Blocker.After installation of the JetElements package, a “google-maps-jet-elements” package will be displayed in the list of available Content Blockers.

Enable the switcher in the Status column to activate the blocker. Alternatively, you can click on the “Add New” button and create the blocker from scratch.

To edit the blocker, click on the “pencil” icon in the last column, and you’ll be redirected to the package settings page. The settings page gives you the ability to handle various elements while ensuring your users’ preferences are respected.

The Content Blocker Settings section includes the following features:

• ID — a field that displays the ID of the content blocker; 
• Shortcode — a field that contains the shortcode that can be used on any page if automatic content blocking is not working;
• Status — a toggle that can enable or disable the Content Blocker feature;
• Language — a field that displays the entry’s current language.

All of these sections have two buttons:

• “Go back without saving” — when clicked, you will return to the list of content blockers;
• “Save all settings” — when clicked, you will save all of the changes made.

The Content Blocker Information section includes one field:

• Name — a field that displays the name of the Content Blocker, which can be used within the Preview Blocked Content.

The Service Information section includes the following field: 

• Service — in the dropdown, you can select the map service provider.

The Provider Information section includes the following settings:

• Provider List — a selector that allows linking each Content Blocker to a specific provider for legal compliance. More information and options to edit or create providers can be found under WordPress Dashboard > Borlabs Cookie > Consent Management > Providers.

The Locations section includes the following field: 

• “Add Location” — fields that allow setting a new location in the format of hostname and path. If a Hostname and Path configured here are detected in an iframe, the iframe is blocked according to this Content Blocker’s settings. The Hostname refers to the website’s domain name, such as www.example.com for https://www.example.com.

The Preview Blocked Content section includes the following fields: 

• Image — a field that allows selecting image preview for the blocked content (used only with Preset B and Preset C). The image URL is accessible within the HTML preview using the {{ previewimage }} variable;
• Preset — a selector that allows choosing the preset to define the preview display of blocked content:
  • “Preset A — Default”;
  • “Preset B — Default + Background Image”;
  • “Preset C — Video Player”;
  • “Preset D — Floating Icon”;
  • “Apply Preset” — a button that saves preset configuration;
• HTML — a field that allows HTML code to be entered as a preview for blocked content. Variables like {{ name }} (for the Content Blocker’s name) and {{ previewimage }} (for the Image URL) can be embedded within the HTML;
• CSS — a field that allows adding custom CSS to style the preview for the blocked content.

The Text Placeholder section has a set of fields, including a set of variables that can be adjusted for every content blocker. Upon default, four variables include:

• “description” — a variable that contains the description text placed in the blocker. The default text is: “You are currently viewing a placeholder content from <strong>{{ name }}</strong>. To access the actual content, click the button below. Please note that doing so will share data with third-party providers.”;
• “unblockButton” — a variable that contains the unblock button text. The default text is: “Unblock content”;
• “moreInformation” — a variable that contains the more info button text. The default text is: “More Information”;
• “acceptServiceUnblockContent” —  a variable that contains the accept terms button text. The default text is: “Accept required service and unblock content”.

If you need to create a new variable, click on the “Add Text Placeholder” button.

The Additional Settings section includes the following field: 

• Execute Global code before unblocking — a field that allows entering global code to be executed before content is unblocked.

The JavaScript section includes the following fields: 

• Global — a field that allows entering JavaScript (without <script> tags) to be executed once per page after blocked content is unblocked by a visitor, useful for loading external JavaScript libraries;
• Initialization — a field that allows entering JavaScript (without <script> tags) to be executed each time blocked content is unblocked. This code runs after the JavaScript from the Global field and is triggered each time the visitor unblocks content.

Add Advanced Map Widget and Configure Its Settings

Next, add a map widget using the JetElements widget Advanced Map. This will allow you to display a map on your site, but only after users have given their consent for cookies.Go to the page or post where you want to add the map and click on “Edit with Elementor” to enter the page builder.

In the Elementor widget panel, find the Advanced Map widget provided by JetElements in the left panel and drag it to the section of the page where you want it to appear.

Configure the map’s settings, including the location, zoom level, and appearance.

By adding the map this way, it’s ready to work with the Borlabs Cookie plugin’s content-blocking features.

That’s it. Now you know how to integrate Borlabs Cookie with the Advanced Map widget from the JetElements plugin, ensuring that your WordPress website content complies with cookie consent regulations.