Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • February 12, 2015 at 3:09 pm #395053
    envapk2

    Hi

    I have put in the Events Calendar plugin and I have put in the Upcoming Events element from the Plugin Additions. Is it possible to change the styling of how it looks? For example, I would like to make the date look bigger, change text colours, etc.

    many thanks

    Peter

    February 12, 2015 at 3:13 pm #395059
    Yigit

    Hi envapk2!

    Can you please post the link to your website and a screenshot showing the changes you would like to make? :)

    Cheers!
    Yigit

    February 12, 2015 at 3:33 pm #395074
    envapk2

    Hi Yigit

    Here is a rough idea of what I’m after

    http://www.peterk2web.com/Events.jpg

    February 12, 2015 at 3:49 pm #395090
    Yigit

    Hey!

    And link to your page please? :)

    Cheers!
    Yigit

    February 12, 2015 at 3:57 pm #395104
    envapk2
    This reply has been marked as private.
    February 13, 2015 at 6:29 pm #395941
    Elliott

    Hey!

    Add this to your custom CSS.

    .av-upcoming-event-data h4 {
  font-size: 14px !important;
  position: relative !important;
  top: 23px !important;
} /* This is the title */
.av-upcoming-event-schedule {
  font-size: 20px !important;
  position: relative !important;
  top: -20px !important;
} /* This is the date */
.av-upcoming-events {
  background: none repeat scroll 0 0 #e1e1e1;
  padding: 10px;
} /* This is the grey background */

    Regards,
    Elliott

    February 13, 2015 at 7:32 pm #395973
    envapk2

    Hi Elliott

    That works great, thanks. Also, Is there a way to change the date format to lose the ‘@’? Perhaps replace with a dash, eg February 22 – 8.00pm

    many thanks

    Peter

    February 15, 2015 at 10:17 am #396311
    Ismael

    Hey!

    You can edit config-templatebuilder > avia-shortcodes > events_upcoming.php, look for this code on line 141:

    $output .= "<span class='av-upcoming-event-schedule'>".tribe_events_event_schedule_details($entry)."</span>";

    Replace it with:

    $eventshed = tribe_events_event_schedule_details($entry);
							$output .= "<span class='av-upcoming-event-schedule'>".str_replace('@', '-', $eventshed)."</span>";

    Best regards,
    Ismael

    February 15, 2015 at 7:20 pm #396452
    envapk2

    Thanks Ismael, that works perfectly.

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Events Calendar styling’ is closed to new replies.