Set different start/end time for multiple day events

  • Resolved kirschdaniel

    (@kirschdaniel)


    7 years, 9 months ago

    I would like to create an event that lasts two days. On the first day, the event starts at 10am and ends at 7pm. On the second day, the events starts at 9am and ends at 5pm. Currently I can only set the start/end time once and its been used for all days.
    Is there a way to add individual start/end time for each day of the event?
    If not, how can I hide to time information (element with class “event-row-date”) for such an event?

    I thought of something like: Setting a special attribute for the event which might than be selected by a css definition.

    .em-multidate-different-times .event-row-date {
  display: none;
}

    Thanks for help and ideas.
    Daniel

Viewing 4 replies - 1 through 4 (of 4 total)

  • Hi Daniel,

    One way to do it would be by using a set of custom attributes for the dates:

    https://wp-events-plugin.com/documentation/event-attributes/

    Thread Starter kirschdaniel

    (@kirschdaniel)

    This sounds good. And show it only when available using the technique described in the tutorial:
    https://wp-events-plugin.com/tutorials/creating-conditional-placeholders-for-events/

    Would that do the job or am I on the wrong track?

    Thanks
    Daniel

    That sounds like a good plan.

    Thread Starter kirschdaniel

    (@kirschdaniel)

    Just for the records, this is what I’ve done now:

    1. I’ve added a custom attribute #_ATT{multipleTimes}{YES|NO}
    This gives me a select box with YES and NO options on the event page.

    2. I’ve changed my template for the “single event format” to contain the new attribute as a class:

    <div class="event multiple-times-#_ATT{multipleTimes}">
  #_EVENTNOTES
  ... other stuff ...
  {has_bookings}
    #_BOOKINGFORM
  {/has_bookings}
</div>

    So when I select YES for the multipleTimes attribute, I get a class multiple-times-YES for my event container.

    3. I added the CSS definition:

    .multiple-times-YES .event-row-date {
  display: none;
}

    to simply hide the row with the fixed date.

    4. I added the individual times for each day at the end of the event’s description.

    • This reply was modified 7 years, 9 months ago by kirschdaniel. Reason: Fixed css typo
Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Set different start/end time for multiple day events’ is closed to new replies.