Custom display of colours in list-events

Ryan, I’m not quite sure what you’re trying to accomplish. Is the legend option not sufficient here? Can you show me some sort of example? Have you looked at the wiki for help?

Ah ok sorry, on the default theme with Event Manager, a little colored bar appears in the title of the event listings. However, i’ve made a custom theme for my event list, How do i get the coloured bar back? is there a CSS class i need to include for it to be coloured?

Hmm example,

I just want my <div class="eventCat">category</div> to be coloured within the event list loop. Can i just append the CSS class the eccc creates to my div? or is there another way of grabbing the colour code into my theme?

Can you send the URL of the site? The event title should be colored in the list view be default. Or are you wanting a legend to appear in the list view?

sure https://hqhq.dk/beta/events
It’s very much not complete yet ??

I have:

<div id="event" class="wrapme">
  <div class="eventCat tribe-events-list-event-title summary" ></div>
...
</div>

the eventCat class just places the box to the side, how do i colour it?

Ryan, 2 things.

1. I’ve got an update coming out, hopefully within the next week, to allow adding the legend to other views, like the list view. If you want the legend in the list view and want to add an opening div to the added code, please review the instructions on the wiki. Specifically the teccc_legend_html filter. You may want to add your eventCat class in this manner.

2. It looks like your list view customization is placing the title of the event not in the same div that The Events Calendar would normally place it. I’ll have to take a closer look. As a test, if you change themes back to TwentyTwelve does the list view color like you expect it too?

OK. It’s not typically the legend, its the colour bars in general (if that makes sense)

If i delete my theme/tribe-events/* files so it reverts back to the plugins theme files it works fine yeah. it’s my template that isn’t using the plugins css classes.. How does your plugin give the HTML colour code out? maybe you can make an add on so we can call the HTML colour code within the loop? i.e teccc_get_color(); ? just an idea.

This plugin styles are based upon The Events Calendar category classes. Therefore, if you remove or place your event title outside of the div that TEC’s category class defines it will not get styled as you desire.

My suggestion is to modify your template to place the event title back in it’s default location an adjust the CSS from there. If you are an Events Calendar PRO user it’s best to post your problem on their forum. The devs there are much more adept at fixing these issues. Unfortunately it’s a bit outside of the scope here.

The CSS generated by this plugin is placed in the head of the appropriate views. Even in your modified template the CSS is present. Just look at the source. It’s easy to identify.

OK. I’ve solved it.
For reference to others wishing to do this:

Added a css class to views/category.css.php

.eventCat-<?php echo $slug ?> {
		background-color: <?php echo $options[ $slug.'-background' ] ?>;

	}

added the class and div to my themes single-event.php

$terms = get_the_terms(get_the_ID(), 'tribe_events_cat');
$firstItem = current($terms);
?><div class="eventCat eventCat-<?=$firstItem->slug?>" ></div><?

You can just set a foreach on the $terms array coming through if multiple categories are used ?? of-course, this isn’t the perfect solution as in an update this could break.

Thanks for the direction Andy.

Adding images now ??

Ryan, I’m glad you’ve solved your problem but as you point out any update will break this. I still think the solution is to somehow make changes to your customized template that don’t require inserting additional css or classes.

OK. i guess i can just add a filter onto a class like you said,
but how can i add the colour i’ve picked in the admin to my css class?

add_action( 'teccc_add_legend_css', 'my_extra_legend_css' );
function my_extra_legend_css () {
    echo '#eventCat {
background-color: ; }';
}

or am i missing a point of this?

I’m also getting a error with teccc_add_legend_view()

Fatal error: Call to undefined function teccc_add_legend_view() in /home/www/hqhq.dk/beta/wp-content/themes/angular/functions.php on line 435

that was with: teccc_add_legend_view(‘upcoming’);

??

teccc_add_legend_view is in code that hasn’t been released yet. If you need it you can grab the full code from GitHub.

WRT your template, you’ll need to look at the default view and make sure the correct code putting the title and class tags is replicated in your template.

It might be easier to put you template up on snippi or some other code snippet service so others can look at it.