Modern Events Calendar Carousel View on Events Page

Support
#1

Hi guys,

  1. Been trying to have a carousel display on the “main” events page (using modern events calendar), but cannot find such an option…

  2. If 1) is not an option, is there a way to display only the events for the current year?

  3. Is there a way to change the font size of the archive page title?

url: http://www.crestedbuttesnowsports.org/events

Thank you,
Petar

#2

Hi Petar,

You can edit any of the shortcodes to choose “Carousal View” in the skin as in this screenshot:

You can also choose “Yearly View” in the skin menu in the screenshot above.

For the archive h1 font size, you can add this CSS code snippet into (Theme Options > CSS):

.archive h1 {
    font-size: 3em;
}

Thanks.

#3

Thank you for the quick reply.

The main (default) page does not use a shortcut - it’s been override by the plugin. And that is why I am asking, if that could be changed to Carousel. These are the options so far:

Thank you,
Petar

#4

Hi @kcreative,

Unfortunately, it’s not possible. That option is only applicable for shortcodes and that settings in your screenshot are for event main page (index).

Thanks!

#5

Thank you for the quick reply!

  1. Just noticed an issue with the layout on this page using the countdown view shortcode - it looks like the text is “stacking on” top of each other: http://www.crestedbuttesnowsports.org/

  2. Also, how could I change the background to white and the text color to white?

  3. Placing a shortcode here doesn’t display any events: http://www.crestedbuttesnowsports.org/upcoming-events/

Thank you,
Petar

#6

Hi Petar,

1- To correct this, I recommend adding a custom class to that column as in this screenshot:

Then you can add this CSS snippet to (X > Theme Options > CSS):

.custom_class .mec-wrap .mec-event-countdown-style3 .mec-event-countdown-part2 {
    display: none;
}

.custom_class .mec-wrap .mec-event-countdown-style3 .mec-event-countdown-part1 .mec-event-upcoming {
    text-align: left;
}

2- You can use this CSS code to change the background color, the font color is already white and I don’t think it will be visible on the white background color?

.custom_class .mec-wrap .mec-event-countdown-style3 {
    background: #fff;
}

3- That’s because none of your events has a featured image, you must assign a featured image to your events if you want to use the Carousel style.

Thanks.

#7

Thank you so much for the help, that was really useful!

I did hide the event title .mec-event-title and styled the event link .mec-event-link, but it is displayed over two lines https://prnt.sc/jxo04u How could I fix that and center it according to this element: https://prnt.sc/jxo0nr ?

  1. Also, is there a way to hide the featured image and get rid of the “side bar” element in the actual event page? https://prnt.sc/jxo1yj

Thank you,
Petar

#8

Hello Petar,

1.) To resolve the two line title, please use this custom css:

.mec-event-countdown-style3 .mec-event-title-link {
    min-width: 140px;
}

2.) And to hide the featured image and get rid of the sidebar, please use this custom css code:

.single-mec-events .mec-wrap .col-md-4,
.mec-single-event .mec-events-event-image {
    display: none;
}

.single-mec-events .mec-wrap .col-md-8 {
    width: 100%;
}

Please let us know if this works out for you.

#9

Perfect! Thank you so much for your help!

#10

You are most welcome!
We’re glad we were able to help you out.

#11

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.