{% all_cookie_groups 'cookie-consent__cookie-groups' %}
Closed this issue · 5 comments
Is there a trick to getting the tag 'all_cookie_groups' to work?
At the moment I am getting an error 'Invalid block tag' for {% all_cookie_groups 'cookie-consent__cookie-groups' %}.
To confirm, I have the following essentials in my template:
{% load static %}
{% load cookie_consent_tags %}
{% all_cookie_groups 'cookie-consent__cookie-groups' %}
I have looked in cookie_consent_tags.py and the tag doesn't appear to exist.
Everything else's is set up correctly :
django-cookie-consent 0.4 installed
urls.py - path("cookies/", include("cookie_consent.urls"))
Migrated and cookiegroup populated.
Django 4.2 and Django-cookie-consent 0.40
I note that all_cookie_groups is present as a tag in 0.5.0-beta
Does installing that beta resolve your issue?
You can find the instructions here: #15 (comment)
Yes it does - thank you.
One, question - I am trying to integrate a bootstrap modal (instead of the
<template id="cookie-consent__cookie-bar"> option) without much success, can you offer any suggestions on how I would do this?
I got the bootstrap modal to work (rightly or wrongly?) as follows:
in the html template:
{% load static cookie_consent_tags %}
{% static "test_app/cookiebar.module.js" as cookiebar_src %}
{% url 'cookie_consent_status' as status_url %}
{% all_cookie_groups 'cookie-consent__cookie-groups' %}
<script type="module">
import {showCookieBar} from '{{ cookiebar_src }}';
$(document).ready(function () {
showCookieBar({
statusUrl: '{{ status_url|escapejs }}',
templateSelector: '#cookie-consent__cookie-bar',
cookieGroupsSelector: '#cookie-consent__cookie-groups',
onShow: () => {$('#cookieModal').modal('show');},
onAccept: () => $('#cookieModal').modal('hide'),
onDecline: () => $('#cookieModal').modal('hide'),
});
});
</script>
<template id="cookie-consent__cookie-bar">
<!-- Cookie Consent Modal -->
<div class="modal fade" id="cookieModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-gdpr">
<div class="modal-content">
<div class="modal-body">
<strong>Allow optional cookies?</strong>
<p>Accepting optional cookies helps us provide a better experience, improve our products, and
tailor our marketing.
For more information read our cookie policy.</p>
</div>
<button type="button" class="btn btn-success cookie-consent__accept">Accept</button>
<button type="button" class="btn btn-outline-info cookie-consent__decline">Decline</button>
</div>
</div>
</div>
<!-- Cookie Consent Modal -->
</template>
In cookiebar.module.js
Changing the end of the file from:
// grab the contents from the template node and add them to the DOM, optionally
// calling the onShow callback
const cookieBarNode = templateNode.content.firstElementChild.cloneNode(true);
registerEvents(cookieBarNode, cookieGroups);
onShow?.();
doInsert(cookieBarNode);
};
to:
// grab the contents from the template node and add them to the DOM, optionally
// calling the onShow callback
const cookieBarNode = templateNode.content.firstElementChild.cloneNode(true);
registerEvents(cookieBarNode, cookieGroups);
onShow?.();
doInsert(cookieBarNode);
// Use setTimeout to defer execution of onShow until rest of synchronous code finished
setTimeout(() => {
onShow?.();
}, 0);
};
Version 0.6.0 is now published, with the Javascript fix that should make the bootstrap modal work out of the box now!