site_wide_header - WPCode Library

Basic | Grid-Filter Tastaturbedienbar

document.addEventListener(“DOMContentLoaded”, function () { const filterItems = document.querySelectorAll(‘.vc_grid-filter-item’); filterItems.forEach((item, index) => { item.setAttribute(‘tabindex’, ‘0’); // Fokusierbar per Tab item.setAttribute(‘role’, ‘button’); // Semantik: Rolle als Button item.setAttribute(‘aria-pressed’, item.classList.contains(‘vc_active’) ? ‘true’ : ‘false’); item.setAttribute(‘aria-label’, item.textContent.trim()); // Tastaturbedienung (Enter oder Leertaste) item.addEventListener(‘keydown’, function…Continue reading

CLEAN & MINIFY ASSETS

HTML: CSS: Use CleanCSS or Webpack to minify. cleancss -o style.min.css style.css JS: Use Terser or Webpack. terser main.js -o main.min.js –compress –mangleContinue reading

Impact

Untitled Snippet

Add title above image (Blurbs)

om.Campaign.changeView.done

document.addEventListener(‘om.Campaign.changeView.done’, function(event) { // This event is passed the Campaign object console.log(event.detail.Campaign); } );Continue reading

Adding a Clear Button to Reset All Fields in Your Form

document.addEventListener(‘DOMContentLoaded’, function() { // Change the form ID to match your WPForms form ID var form = document.getElementById(‘wpforms-form-10’); if (form) { var clearButton = document.createElement(‘button’); clearButton.type = ‘button’; clearButton.innerText = ‘Clear’; clearButton.class = ‘custom-btn’; clearButton.style.marginTop = ’10px’; clearButton.classList.add(‘custom-clear-button’); form.appendChild(clearButton); clearButton.addEventListener(‘click’,…Continue reading

MVNO Table Verizon[CSS]

/* General Table Styling */ .verizon-mvno-table { border-collapse: separate; border-spacing: 0; width: 100%; margin: 20px auto; font-family: Arial, sans-serif; } .verizon-mvno-comparison-table { width: 100%; border: none; /* Make table lines invisible */ } .verizon-mvno-table-header-row { background-color: #f5f7f9; color: #333; font-weight:…Continue reading

[T-MO] Network Metric Cards CSS

/*────────────────────────────────────────────────────────────── LightSpeed Metrics Cards – final align spec (2025-05-31) ──────────────────────────────────────────────────────────────*/ /* 1 ▸ GENERAL ————————————————*/ .ls-lp-container{display:flex;flex-direction:column;gap:41px;margin:40px 0;} .ls-lp-card{position:relative;border-radius:20px;padding:30px 50px;overflow:visible!important;} .ls-lp-tmobile-card{background:#E20074;color:#000;} .ls-lp-usmobile-card{background:#1a1a1a;color:#fff;} .ls-lp-carrier-name{font:700 36px/1.1 sans-serif;margin:0;color:#fff!important;} .ls-lp-coverage-location{font-size:14px;margin:4px 0 0;} .ls-lp-collapsed-row{display:flex;align-items:center;justify-content:space-between;gap:20px;} .ls-lp-left-col{display:flex;flex-direction:column;align-items:flex-start;} .ls-lp-center-col{display:flex;gap:30px;flex:1;} .ls-lp-right-col{display:flex;align-items:center;gap:20px;} /* 2 ▸ METRICS ———————————————–*/ .ls-lp-metric-box{flex:1 1 0;min-width:0;display:flex;justify-content:center;} .ls-lp-metric-inner{display:flex;flex-direction:column;align-items:flex-start;text-align:left;position:relative;}…Continue reading