Skip to content

Instantly share code, notes, and snippets.

@hmbashar

hmbashar/Elementor Container clickable.js

Created October 12, 2025 17:02
Show Gist options
  • Save hmbashar/d8ac519d855219167714c3e5dbd39a8d to your computer and use it in GitHub Desktop.
Save hmbashar/d8ac519d855219167714c3e5dbd39a8d to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. hmbashar created this gist Oct 12, 2025.
    65 changes: 65 additions & 0 deletions Elementor Container clickable.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,65 @@
    <script>
    (function () {
    function isInEditor() {
    return document.body.classList.contains('elementor-editor-active');
    }

    function applyClickableContainers(context) {
    var nodes = (context || document).querySelectorAll('.elementor-element[url]');
    nodes.forEach(function (el) {
    if (el.dataset._clickBound) return; // prevent double binding
    el.dataset._clickBound = '1';

    var href = el.getAttribute('url');
    if (!href) return;

    // Basic a11y + UX
    el.style.cursor = 'pointer';
    el.setAttribute('role', 'link');
    if (!el.hasAttribute('tabindex')) el.setAttribute('tabindex', '0');

    function go(e) {
    // Don’t hijack native links or buttons inside
    if (e && e.target && e.target.closest('a, button, [role="button"]')) return;

    // allow Ctrl/Cmd to open new tab
    var newTab = e && (e.ctrlKey || e.metaKey);
    var target = el.getAttribute('target') || (newTab ? '_blank' : '_self');
    var rel = el.getAttribute('rel') || (target === '_blank' ? 'noopener noreferrer' : '');

    if (target === '_self') {
    window.location.href = href;
    } else {
    var w = window.open(href, target);
    if (w && rel) try { w.opener = null; } catch (_) {}
    }
    }

    el.addEventListener('click', function (e) {
    if (isInEditor()) return;
    go(e);
    });

    el.addEventListener('keydown', function (e) {
    if (isInEditor()) return;
    if (e.key === 'Enter' || e.key === ' ') {
    e.preventDefault();
    go(e);
    }
    });
    });
    }

    // Run on load
    document.addEventListener('DOMContentLoaded', function () {
    if (!isInEditor()) applyClickableContainers(document);
    });

    // Also run when Elementor renders widgets dynamically
    if (window.elementorFrontend && elementorFrontend.hooks) {
    elementorFrontend.hooks.addAction('frontend/element_ready/global', function ($scope) {
    if (!isInEditor()) applyClickableContainers($scope && $scope[0]);
    });
    }
    })();
    </script>