Custom Page Section to Event Detail

To add Custom Page Section to Event Detail Page, under current Event Description, so you can freely design the layout without being limited to the Event Page.

#1. First you need to install this plugin

(follow plugin & add code to Header/Footer only)

#2. Next, find ID of Event Detail Page

In my example, we will have:

#item-68a298c26d9125395f6f0cea

#item-68a298c26d9125395f6f0cee

#3. Next, create 2 Pages and design your desired layout (in next step, we will use code to append these page into Event Detail)

#3.1. Next, find URL of both pages. In my example, we will have:

event-extra-01

event-extra-02

#4. Next, use this code to Code Injection > Footer (under Plugin code)

<script>
const productLoaders = [
    {
        itemId: '#item-68a298c26d9125395f6f0cea',
        targetUrl: '/event-extra-01'
    },
    {
        itemId: '#item-68a298c26d9125395f6f0cee',
        targetUrl: '/event-extra-02'
    }
];
document.addEventListener('DOMContentLoaded',function(){productLoaders.forEach(config=>{const targetElement=document.querySelector(`${config.itemId} div.eventitem-column-content`);if(targetElement){const loaderDiv=document.createElement('div');loaderDiv.setAttribute('data-wm-plugin','load');loaderDiv.setAttribute('data-target',config.targetUrl);targetElement.appendChild(loaderDiv)}});if(window.wmInitContentLoad){window.wmInitContentLoad()}})
</script>

#5. Update Event Detail Page ID + Custom Page URLs here.