Change Event Blocks background color

Hi there!

Thanks for reaching out.

That’s a great idea! We don’t have this option at the moment, unfortunately. So you’ll need some custom code to get it working as you want it to.

Thanks!

Hi,

Ok. Can you just tell me then in which document I can add similar classes to sp-template-event-blocks ?

Thanks,
Tom

Hi @ventatto ,

You can copy event-blocks.php from wp-content/plugins/SportsPress/templates/ to wp-content/themes/child-theme/sportspress/ and alter it so as to include the classes you want ??

Thanks,
Savvas

Hm, I don’t currently see anything in the Calendar view output that indicates the type of event.

Which Calendar View do you use ?
Calendar,
List, or
Blocks ?

Thanks @savvasha !

Hi @corrinarusso, it indeed does not appear in the output of an event. But I think it’s a great feature to filter events so I want to profit from it by setting events’ background color consequently.

Agree.
So which Which Calendar View do you want to use for your feature request?

Above all for event blocks. If I can then apply it to event list it would be a good point as well.

There are unique template files for the output.
In this example, I modified the template for a List Calendar.
See here :
https://ibb.co/k2svS2L

Copy the event-list.php from your plugin folder, into :
/wp-content/themes/<name of child theme>/sportspress/event-list.php

Inside the foreach ( $data as $event ): add this :
$printformat = get_post_meta( $event->ID, 'sp_format', true );

Then in the table loop :
foreach ( $teams as $t => $team ):

Change this :
echo '<tr . 'class="sp-row sp-post' . ( $i % 2 == 0 ? ' alternate' : '' ) . ' sp-row-no-' . $i . '" itemscope itemtype="https://schema.org/SportsEvent">';

to this :
echo '<tr class="' . $printformat . '" class="sp-row sp-post' . ( $i % 2 == 0 ? ' alternate' : '' ) . ' sp-row-no-' . $i . '" itemscope itemtype="https://schema.org/SportsEvent">';

Now all you need to do is add your row CSS based on the game format.

Good question!
See here :
https://ibb.co/3026PFk

You will need to implement this into each of the Calendar types.
(block, etc)

Great I found something similar to this but yours is better organized. Thanks for your help !

I’m glad it’s resolved!

Let us know if you need anything else.

Kind Regards,
-Roch