• Hi, according to your last update, you add the “grid view”, in normal things it work fine, but when i create a shorcode using [events_list] in your docs said “For shortcodes, simply add view=”grid” and you’re set!” and when i add the propriety to de the shortcode nothing happens [events_list view=”grid”] is not working

Viewing 4 replies - 1 through 4 (of 4 total)
  • Yep, doesn’t work for me either, just displays the default list view. I was hoping to junk a whole load of css that I’d written to convert the list view into a grid view. A real pain and poorly tested. Looking at the default event grid format in Events > Settings > Formatting, this seems to be exactly the same as the one for the default events list format with the same classes. Shouldn’t this be different?

    Also, your documentation is woefully out of date as I can’t see any mention of the ‘view’ attribute in the shortcodes help page.

    • This reply was modified 1 year, 10 months ago by simonc17.
    • This reply was modified 1 year, 10 months ago by simonc17.
    Thread Starter gzlonline

    (@gzlonline)

    hey @simonc17 i’m not an expert but i was analyzed the doc and some php files to understand how this plug-in works, and how to solve this issue …. i’m using divi but I’m shure that you can do this with any builder out there and this plug-in.
    This is my solutions until the developer fix the “view” in the shortcode:

    <script>
    $(document).ready(function(){   
      $(".em.em-view-container").css("--view-grid-width", "250px");   
      $(".em.em-list").addClass("em-grid em-events-grid");  
      $(".em.em-list.em-grid>div.em-item").addClass("YOUR-CUSTOM-CLASS"); });
    </script>
    <style>
    .em-event.em-item.YOUR-CUSTOM-CLASS > .em-item-info .em-item-desc {
        display: none;
    }
    .em-event.em-item.YOUR-CUSTOM-CLASS > .em-item-info .em-item-actions {
        display: none;
    }
    .em-item.YOUR-CUSTOM-CLASS > .em-item-image {
        position: relative;
        width: 100%;
        aspect-ratio: auto;
        padding: 0!important;
    }
    </style>

    so, what this does is: just add the needed classes that already exist inside the plugin to the corresponding selectors and automatically set your shortcode to a grid view, also add a custom class to hide unnecessary elements in the card. (you need to change “YOUR-CUSTOM-CLASS” in de code )

    This is ver basic jQuery and some css to style stuff without to turn yourself crazy thinks all the media query and styles to create the perfect grid layout and fully responsive, using all the existing css calsses inside the plug-in.

    This only loads all this in the corresponds page and it wil not affect to your other calendar pages.

    I will hope to this snippet will help you and to all other people yo use this.

    PS. i tested this with [events_list category=”98″] also with [events_list] and works fine… if you want to create some cool stuf you should use also slick slider yo create a grid view calendar carrousel that’s what i’m creating.

    Doesn’t work for me either. Lets hope they start fixing bugs with this plugin soon, I consider switching to another plugin as this is becoming less and less supported.

    Hi @gzlonline,

    Thanks for pointing me to the above. But I can’t get it to work. Is the syntax correct as I get a script error unexpected end of script.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Grid view in shortcodes not working’ is closed to new replies.