Add Plausible Banner

This commit is contained in:
2025-04-21 22:51:03 -08:00
parent 83e91efb5d
commit 554cb7ca38
4 changed files with 45 additions and 1 deletions

View File

@@ -16,6 +16,7 @@
{{ if ( .Site.Params.footer.enable ) }} {{ if ( .Site.Params.footer.enable ) }}
{{ partial "footer/main" . }} {{ partial "footer/main" . }}
{{ end }} {{ end }}
{{ partial "cookies/plausible" . }}
{{ partial "scripts" . }} {{ partial "scripts" . }}
</body> </body>
</html> </html>

View File

@@ -0,0 +1,21 @@
<div id="plausible-banner" tabindex="-1" class="hidden fixed bottom-0 right-0 z-50 flex justify-end w-full p-4 pb-8 border-b border-gray-200 dark:border-gray-600">
<div class="flex items-center">
<div class="relative bg-white shadow-lg shadow-black dark:bg-gray-600 rounded-lg text-sm text-gray-500 dark:text-white lg:mb-0">
<div class="justify-between items-center p-5 lg:flex">
<p class="mb-4">
</p>
<div class="items-center space-y-4 sm:space-y-0 sm:space-x-4 sm:flex lg:pl-10 shrink-0 px-2">
We use Plausible Analytics, a privacy first web analytics tool that does not use cookies.
<span class="text-sm px-1"><a class="cursor-pointer font-sm text-gray-900 hover:underline dark:text-white" onclick="disablePlausible();">Disable Plausible</a></span>
<span class="text-sm px-1"><a href="/cookies/" class="font-sm text-gray-900 hover:underline dark:text-white">Cookie Policy</a></span>
<button id="close-modal" onclick="enablePlausible();" type="button" class="py-2 px-4 w-full text-sm font-medium text-center text-white rounded-lg focus:ring-4 focus:outline-none bg-primary-700 sm:w-auto hover:bg-primary-800 dark:bg-primary-600 dark:hover:bg-primary-700 cursor-pointer">OK</button>
</div>
</div>
</div>
</div>
</div>

View File

@@ -2,4 +2,4 @@
<script src="{{ .Site.BaseURL }}/js/vendors.bundle.js"></script> <script src="{{ .Site.BaseURL }}/js/vendors.bundle.js"></script>
<script defer data-domain="beardedtek.com" src="https://plausible.beardedtek.org/js/script.file-downloads.hash.outbound-links.pageview-props.revenue.tagged-events.js"></script> <script defer data-domain="beardedtek.com" src="https://plausible.beardedtek.org/js/script.file-downloads.hash.outbound-links.pageview-props.revenue.tagged-events.js"></script>
<script>window.plausible = window.plausible || function() { (window.plausible.q = window.plausible.q || []).push(arguments) }</script> <script>window.plausible = window.plausible || function() { (window.plausible.q = window.plausible.q || []).push(arguments) }</script>
<script src="{{ .Site.BaseURL }}/js/plausible-exclude.js"></script>

View File

@@ -0,0 +1,22 @@
// Plausible Exclude
const plausibleBanner = document.getElementById('plausible-banner');
var hidePlausibleBanner = window.localStorage.getItem('hidePlausibleBanner');
function disablePlausible(e) {
window.localStorage.setItem('plausible_ignore', 'true');
window.localStorage.setItem('hidePlausibleBanner','true');
plausibleBanner.classList.add('hidden');
}
function enablePlausible(e) {
window.localStorage.removeItem('plausible_ignore');
window.localStorage.setItem('hidePlausibleBanner','true');
plausibleBanner.classList.add('hidden');
}
if ( hidePlausibleBanner){
plausibleBanner.classList.add('hidden');
} else {
plausibleBanner.classList.remove('hidden');
}