- This topic has 11 replies, 3 voices, and was last updated 10 years, 9 months ago by
.
-
Posts
-
Pretty sure this can be handled with a custom made CSS. I want to format the calendar to display a small icon of my choosing next to the event title based on the category(s) assigned to the event / and or utilize a color scheme label similar to what is depicted in this example:
Doesn’t seem too hard but is out of my realm of technical / design know how. Can anyone recommend a freelancer with exeperience with Events Calendar to create such a thing?
If there’s enough interest in event coloring of this style I’m sure it wouldn’t take too much effort for me to add it as an option to The Events Calendar Category Colors plugin.
Anyone else want this?
Was not even aware of that plugin! Looks like that will get me half way there. Still would love to be able to display icons next to the event title as well that are determined by category.
I’m not quite clear on what you mean by icons and where you want them. The stripes, I’m sure can be done.
I made these 20×20 icons:
http://www.thebarnpresents.net/images/events/barn_opt.jpg
http://www.thebarnpresents.net/images/events/covers_opt.jpg
http://www.thebarnpresents.net/images/events/festival_opt.jpg
http://www.thebarnpresents.net/images/events/residency_opt.jpg
http://www.thebarnpresents.net/images/events/local_opt.jpg
http://www.thebarnpresents.net/images/events/recommends_opt.jpgEach is associated with a category. I would like them to display alongside the title of the event in the calendar with the corresponding category(s). This would be in addition to the coloring which would represent another set of categories. Here is a screencap of a mockup that I did:
http://www.thebarnpresents.net/images/events/screen_grab_cal.jpg
Does that make sense?
That’s kinda what I thought. Unfortunately, that would be far outside the scope of my plugin. But, you could add something like the following to the appropriate category CSS. If you are using my plugin, look to where the background-color is set and add the following to that selector.
{ background: url(‘myimage.gif’) no-repeat left center; }
You will have to add the url for your images and add the extra CSS to your theme. The above code fragment requires the specific category selectors for your site. If you are using my plugin then you can look at the page source to see the correct selectors.
Check out the new version of The Events Calendar Category Colors v1.2.2. It now has an option to color the left border.
Plugin is great — thanks! Wondering: will it only work if the event has one and only one category assigned? Seems like if there is more than one category, it will not pick up any colors even if only one of the assigned categories is associated with a color. Am I missing something? Would be cool if there was a category hierarchy, that would choose first available color from an ordered list.
Similarly, in the code snippet you suggest above… will that only display one icon per category or would it cycle through a list like what is depicted in the example.
Thanks again for your responses thus far.
The plugin is only designed to pickup one category per event. I couldn’t even image what to do with an event having 10 categories, and if not 10, where does one set a limit. Honestly I can’t even tell you what the plugin will do if more than one category is selected. Not doing anything would certainly be a possibility.
Same response for the icons. BTW, what site you trying to use this on?
Andy – thanks again for you’re continued engagement in this thread. The site I am trying to use it on is here:
http://www.thebarnpresents.com/events
It is a live music calendar. I wanted to add visual cues to each of the listings to make distinguish between shows and for people to easily locate what they’re looking for.
These come in two separate ways:
1. by musical genre — I wanted this to be use the color coding. the problems here is that sometimes bands I cover straddle musical genres (e.g. rock + jazz) or there are more than one act on a bill or in a festival lineup. Ideally, I would have a hierarchy (have the calendar always display the color code for rock over jazz over acoustic for instance) or barring that (I can only categorize based on the genre I wanted to display
2. by event description — if the band was local to our area, is playing a weekly residency, we recommend, plays covers, we highly endorse the event, or the event is a festival, I wanted to use icons to convey these categories, too. Of course — a recommended local cover band at a weekly residency would require 4 separate icons.
My guess is that this type of thing is not easily accomplished through the available plug-ins. My hope is that it wouldn’t be that difficult for somebody with a working knowledge of the code to add in. Any suggestion for how I could potentially find somebody willing to help me out?Steven, you could effectively create 2 (and only 2) overlapping genres by using both the left border color and background color for a category. This will require 3 categories though, rock, jazz and rock + jazz. As for icons, all you would really have to do is look at the CSS generated by the plugin and for each category selector create something like the following.
.tribe-events-calendar .cat_rock { background: (‘path/to/image.png’) no-repeat left }If you do this for every category/image and place it in your override events.css file it should do the trick.
In order to have multiple images you might have to have a single image file with multiple images in it. When making separate categories for these icons you would just set the category colors options to transparent. That might work.
- The topic ‘Any recommendations for a freelancer to create a custom CSS for me?’ is closed to new replies.