Simple Events Block

[zu]

Hi Ryan

While I was listening to the In the Loop podcast I thought again about a Events Block plugin I’d like to have.

It seemed somewhat clear how this would best accomplished, but after finishing to listen to the podcast and lending some more thought, I got lost again.

Maybe you can twitch from start to finish how I could best accomplish this. (Also I realize that there is relevant information in streams you already posted but I’m not sure where to start).

So I write down all what the block and plugin should be doing and hope you can give me some insight into best practices.

Personas

We have two, maybe three personas:

Website Admin (Joe)

Joe is an elderly person that volunteered to manage the website of a dog sports club. He’s not very technically oriented, but is able to learn how to enter and edit the contents of the wensite.

Website Visitor (Peter)

Peter (as most website visitors) is member of the club and wants to see the pictures and results of the last competition he or some other members of the club went. He also wants to see upcoming events and other news. And he wants to be able to contact the president.

(Website Editor)

Paul is ready to relieve Joe a bit and add and edit contents as well. He should not be able to change patterns, block styles or any of the „critical“ colors and design. (He’s only here as a reminder in case for some future use cases)

(Website Developer / Agency)

Urs (actually in reality that’s me, Christian, with the help of the WordPress community) is building the structure, theme, blocks (including patterns and styles) and installs the plugin to make all required functions available.

Use Cases ( User Stories )

As Joe (Website Admin) I want to add and edit events so that upcoming events appear on the homepage (e.g. sidebar) and past events can easily be found and watched by the Website Visitor (Peter)

As Peter (Website Visitor) I want to find news, upcoming events and results/pictures from past competitions easily.

Proposed solution to be implemented or challenged

Creating a Custom Post Type „Events“ that save event_start_date, event_start_time, event_end_date, event_end_time as post meta.

(It would be nice to have a date picker that respects the configured date format. If end_date and -time would be prefilled with the same date and one hour plus, that would be nice)

For additional fields like description, location, url etc. we could use separate blocks and offer a bunch of patterns.

One difficulty would be how to filter by location which I think would be great.

An event can have following states (taxonomy):

• upcoming = event_start_date > today()
• soon = event_start_date > today() + < 8 days in the future
• past = event_end_date < today()
• cancelled = manually cancelled. (Of course an event could just be deleted, when cancelled, but maybe the event should have an explanation of why it was cancelled, give information about if there is a substitute date etc. Therefore I want the event to stay in the normal flow at least in some queries but present it with a grayed out or strikethrough date (and maybe even title and description) )

An event can be of a certain type (taxonomy) like competition, general assembly, training etc. (user customizable)

Blocks / Block Patterns

Events List

The Events List Block lists the events, it should be possible to choose

• upcoming (yes/no)

• soon (yes/no)

• past (yes/no)

• cancelled (yes/no))

• type (category type taxonomy)

I guess, it would be nice to use the Query Loop block with pre-configured patterns (no idea, if that works)

Have a dynamic list in the frontend to search / filter (by name, status, location, type)

(For the MVP it’s definitively not needed to have a dynamic frontend filter)

Style

It should be possible to choose from the color palette, font size etc.

We need predefined styles small/big to use the list within a sidebar, kind of how we used to use widgets and as a main content

Events Details

This one seems tricky. Can we link from the list to the details block or does it need to be a single page?

Let’s go the easiest possible way.

I guess, a single page (FSE template) could be easier. But I’m not sure.

How can we make it possible to have blocks above or below the details block?

The details should show all information (title, description, event_start_date & -time, event_end_date & -time, location etc. but also a foto gallery, results maybe comments etc.)

I wouldn’t want to limit allowed blocks above or below the details block.

Any hints how this could be accomplished?

I’m looking forward to a stream about it.

Greetings from Switzerland.