feat: add Contact Form 7 forms and gated content modal
This commit is contained in:
@@ -27,6 +27,9 @@ function bitwms_enqueue_scripts() {
|
|||||||
true // load in footer
|
true // load in footer
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// Gated content modal — loaded on all pages.
|
||||||
|
wp_enqueue_script( 'bitwms-gated-content', $theme_uri . '/js/gated-content.js', [], $theme_version, true );
|
||||||
|
|
||||||
// Content feed AJAX filter — front page only.
|
// Content feed AJAX filter — front page only.
|
||||||
if ( is_front_page() ) {
|
if ( is_front_page() ) {
|
||||||
wp_enqueue_script(
|
wp_enqueue_script(
|
||||||
|
|||||||
@@ -0,0 +1,38 @@
|
|||||||
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
|
var modal = document.getElementById('gated-modal');
|
||||||
|
if (!modal) return;
|
||||||
|
|
||||||
|
var overlay = modal.querySelector('.gated-modal__overlay');
|
||||||
|
var closeBtn = modal.querySelector('.gated-modal__close');
|
||||||
|
|
||||||
|
// Open modal on [data-gated] click
|
||||||
|
document.addEventListener('click', function (e) {
|
||||||
|
var trigger = e.target.closest('[data-gated]');
|
||||||
|
if (!trigger) return;
|
||||||
|
e.preventDefault();
|
||||||
|
var materialId = trigger.dataset.gated;
|
||||||
|
var downloadUrl = trigger.dataset.downloadUrl;
|
||||||
|
// Set hidden field + store download URL
|
||||||
|
var hiddenField = modal.querySelector('input[name="material-id"]');
|
||||||
|
if (hiddenField) hiddenField.value = materialId;
|
||||||
|
modal.dataset.downloadUrl = downloadUrl || '';
|
||||||
|
modal.classList.add('gated-modal--open');
|
||||||
|
document.body.style.overflow = 'hidden';
|
||||||
|
});
|
||||||
|
|
||||||
|
function closeModal() {
|
||||||
|
modal.classList.remove('gated-modal--open');
|
||||||
|
document.body.style.overflow = '';
|
||||||
|
}
|
||||||
|
|
||||||
|
if (closeBtn) closeBtn.addEventListener('click', closeModal);
|
||||||
|
if (overlay) overlay.addEventListener('click', closeModal);
|
||||||
|
|
||||||
|
// After CF7 successful submit — trigger download
|
||||||
|
document.addEventListener('wpcf7mailsent', function () {
|
||||||
|
if (modal.classList.contains('gated-modal--open') && modal.dataset.downloadUrl) {
|
||||||
|
window.open(modal.dataset.downloadUrl, '_blank');
|
||||||
|
closeModal();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
@@ -1704,3 +1704,15 @@ body.sidebar-overlay::after {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* ==========================================================================
|
||||||
|
Gated Content Modal
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
.gated-modal { display: none; position: fixed; inset: 0; z-index: 2000; align-items: center; justify-content: center; }
|
||||||
|
.gated-modal--open { display: flex; }
|
||||||
|
.gated-modal__overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.5); }
|
||||||
|
.gated-modal__content { position: relative; background: var(--color-white); padding: 48px; max-width: 480px; width: 90%; z-index: 1; }
|
||||||
|
.gated-modal__close { position: absolute; top: 16px; right: 16px; background: none; border: none; font-size: 1.5rem; cursor: pointer; color: var(--color-gray-text); }
|
||||||
|
.gated-form input[type="text"], .gated-form input[type="email"] { width: 100%; padding: 12px 16px; border: 2px solid var(--color-gray-light); border-radius: 0; margin-bottom: 12px; font-size: 1rem; box-sizing: border-box; }
|
||||||
|
.gated-form input:focus { outline: none; border-color: var(--color-primary); }
|
||||||
|
|||||||
Reference in New Issue
Block a user