// Function to load an external page into a target element
function loadExternalPageIntoTarget(targetElement) {
// Prevent the element from reloading content multiple times
if (targetElement.hasAttribute('data-loaded')) {
return;
}
// Get the URL to load content from
const url = targetElement.getAttribute("data-include-url");
// Optional: Get a specific target element from the loaded content
const includeTargetSelector = targetElement.getAttribute("data-include-target");
// Optional: Get the name of the function to call after loading
const functionName = targetElement.getAttribute("data-include-function");
// Fetch the content from the provided URL
fetch(url)
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.text();
})
.then(html => {
// If a specific part of the page is targeted, extract it
if (includeTargetSelector) {
const tempDiv = document.createElement('div');
tempDiv.innerHTML = html;
const targetContent = tempDiv.querySelector(includeTargetSelector);
html = targetContent ? targetContent.outerHTML : '';
}
// Insert the content into the target element
targetElement.innerHTML = html;
targetElement.setAttribute('data-loaded', 'true'); // Mark as loaded
// Execute any script tags in the loaded content
Array.from(targetElement.querySelectorAll('script')).forEach(script => {
const newScript = document.createElement('script');
newScript.text = script.text;
document.body.appendChild(newScript).parentNode.removeChild(newScript);
});
// Initialize any Webflow components within the loaded content
if (typeof Webflow !== 'undefined' && typeof Webflow.ready === 'function') {
Webflow.ready();
}
// Call the function specified in the data-include-function attribute
if (functionName && typeof window[functionName] === 'function') {
window[functionName]();
}
})
.catch(error => {
console.error('Error loading page:', error);
});
}
// Queue content loading function after Webflow scripts are ready
Webflow.push(function() {
document.querySelectorAll('.webflow-include:not([data-loaded])').forEach(loadExternalPageIntoTarget);
});
