Skip to main content

FluentCommunity

#Tips

Modern Events Calendar integrated with FC

Finally, with 3 custom snippets, I was able to integrate MEC Events into FluentCommunity frame. In future I would appreciate some integration possible from FC plugin directly! πŸ‘€

Modern Events Calendar integrated with FC
  • 8 likes
  • 8 comments

Gerard Godin

Interesting

Kaneisha G.

Congrats! Unless it’s a secret, it would be helpful to share exactly what you did to make it work so other community members can learn.

Drive Zone

Kaneisha G.Β 

Snippet 1 => Fluent overriding child theme

// Load Fluent Community frame for all pages including posts, archives, etc.
add_filter('fluent_community/template_slug', function ($templateSlug) {
return 'fluent-community-frame.php';
}, 10, 2);

/////////////////////////

Snippet 2 => MEC overriding Fluent

/**

  • VykreslenΓ­ MEC single eventu uvnitΕ™ FluentCommunity rΓ‘mce
  • Opraveno načasovΓ‘nΓ­, aby MEC byl inicializovanΓ½
    */

add_action('template_redirect', function () {

// Pouze na detailu MEC eventu
if (!is_singular('mec-events')) {
    return;
}

add_action('fluent_community/theme_content', function ($themeName, $template) {

    // OvΔ›Ε™enΓ­, ΕΎe je MEC k dispozici
    if (class_exists('MEC') && method_exists('MEC', 'instance')) {
        $MEC = MEC::instance();

        echo '<div class="mec-event-wrapper">';
        echo MEC_Kses::full($MEC->single()); // plnΓ½ single layout
        echo '</div>';

    } else {
        echo '<p style="color:red;">❌ MEC plugin nenΓ­ aktivnΓ­ nebo jeΕ‘tΔ› nebyl načten.</p>';
    }

}, 5, 2); // priorita 5 = dΕ™Γ­ve neΕΎ ostatnΓ­ obsah

});

//////////////////////////////////

Snippet 3 => CSS styling for events

/**

  • Boxed layout pro MEC single event ve FluentCommunity
    */

add_action('wp_head', function () {
if (!is_singular('mec-events')) return;
?>
/ Box styl pro MEC event /
.mec-event-wrapper {
background: #ffffff;
padding: 2rem;
margin: 4rem auto;
max-width: 1080px;
}

    /* Odstranit nadbytečné okraje */
    .mec-event-wrapper > div {
        margin: 0 !important;
    }

    /* Sladit MEC typografii s FluentCommunity */
    .mec-event-wrapper h1,
    .mec-event-wrapper h2,
    .mec-event-wrapper h3 {
        color: #000000;
    }

    .mec-event-wrapper p,
    .mec-event-wrapper span {
        color: var(--fcom-menu-text, rgb(84, 88, 97);
    }                     

    /* ZarovnΓ‘nΓ­ media/gallery blokΕ― */
    .mec-event-wrapper img {
        border-radius: 12px;
        max-width: 100%;
        height: auto;
    }        

</style>
<?php

});

Drive Zone

I made it with these 3 snippets, if you use Astra theme as me it should work without problems.

Snippet below is just cosmetic change for Astra theme to now show Next/Prev buttons because MEC does have them already. In case of use change in snippet /udalosti/ slug for your slug used for events.

add_action('wp_head', function () {
$url = $_SERVER['REQUEST_URI'] ?? '';
if (strpos($url, '/udalosti/') === false) return;
?>
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single:not(.ast-related-post),
.ast-separate-container .post-navigation {
display: none !important;
}
\<?php
});

Kaneisha G.

Drive ZoneΒ thanks for sharing!

MariΓ‘n Ε aray

VidΓ­m, ΕΎe ste z Česka :) ProsΓ­m vΓ‘s, čo za plugin to je na tie udalosti? Mohli by ste mi poslaΕ₯ link na vaΕ‘u komunitu? RΓ‘d by som sa inΕ‘piroval. Ďakujem

Drive Zone

MariΓ‘n Ε arayΒ ZdravΓ­m, plugin MEC od Webnus, web mΓ‘m uzamčenΓ½, dΔ›lΓ‘m na nΔ›m :)

MariΓ‘n Ε aray

Drive ZoneΒ , super, drΕΎΓ­m palce pre ΓΊspeΕ‘nΓΊ komunitu :)