DTech

[Jeremy]

Hello. We recently purchased your EVENTS CALENDAR PRO.
I want to make a number of changes to the calendar. Mostly color changes to the month view of the calendar. And some font changes like making certain text Bolder and changing the colors. I searched but didnt see the exact answers I was looking for. Can someone help?
Title of event not showing up in tool tip popup
I want to change the color, make bold and bigger the text that says “Collapse Filter”.
I want to change the color of the submit button.
Change the color of the grid backgrounds that have the numbers of the days
Change the color of the grid backgrounds for the current day
Change the color of the grid backgrounds that have the names of the days

Thanks

[Geoff]

Hi there, Jeremy! Thanks for getting in touch and welcome to the forums. We’re stoked you’re using PRO and hope you’re enjoying it so far. 🙂

Customizing styles is absolutely possible. I’d suggest checking out this handy tutorial which walks through how to use your browser’s DevTools to find and customize calendar styles.

I’m happy to provide you with classnames for the items you mention above, but because The Events Calendar often inherits styles used in the theme, you will still want to make sure to use the tips outlined in the tutorial to find and identify exactly what you need.

• Title of event in tooltip: #tribe-events-content .tribe-events-tooltip h4
• Collapse Filter text: .tribe-events-filters-horizontal #tribe_events_filter_control a
• Search submit button: #tribe-bar-form .tribe-bar-submit input[type=submit]
• Grid day number: .tribe-events-calendar div[id*=tribe-events-daynum-]
• Grid current day number: .tribe-events-calendar td.tribe-events-present div[id*=tribe-events-daynum-]
• Grid table header: .tribe-events-calendar thead th

Cheers!
Geoff

[Jeremy]

And do I need to have a directory for each add-on inside my “tribe-events” folder with a css page to change the color of buttons etc?
Example tribe-events/filters/tribe-events-filters.css
Or can I just drop a css file in this directory- tribe-events/pro/tribe-events-pro.css.
and it change css for all?

thanks for the response.

[Geoff]

Good question! You can either create a new CSS file (/tribe-events/tribe-events.css) and add your styles there, or add them directly into your theme’s style.css file. Either way will work and depends on your preference.

Check out our Themer’s Guide for more info on customizing the calendar styles.

Cheers!
Geoff

[Jeremy]

yea, i was able to figure that out a bit ago.

Another question.

My Titles aren’t showing up in the tooltip on the Month view or on the actual event pages.

Can you help?

Thanks

[Jeremy]

might help if I give the link to the calendar.
http://planmecacadcam.com/planmecacadcam2/calendars/

[Geoff]

I see you have some Javascript errors. For example this comes up in the console:

You have included the Google Maps API multiple times on this page. This may cause unexpected errors.

Uncaught ReferenceError: M is not defined (main.js)

Try cleaning up those errors and see if that makes a differences. The tooltips rely heavily on JS, so my hunch is that these errors are causing the issue.

By the way, just want to give you a heads up that our team will be out next week starting on Monday. I’ll do my best stay on top of replies to this thread, but note our normal response time will be longer than normal during that time.

Cheers!
Geoff

[Jeremy]

do you have any idea how I can go about fixing the errors?

Thanks

[Geoff]

Hello Jeremy,

You can try following the steps in our troubleshooting guide to see what theme or plugin is causing the conflicts, then tackle them from there. I’m afraid, however, that resolving the conflicts is a question better suited for the theme or plugin author where the conflict is coming from.

Cheers!
Geoff

[Jeremy]

I still cant change the color of the submit button in the Filters section. I tried both of the below in the css.
Whats wrong?

#tribe-bar-form .tribe-bar-submit input[type=submit] {
background-color: #009ccc;
}

#tribe_events_filters_wrapper input[type=submit] {
background-color: #009ccc;
}

[Geoff]

Hi Jeremy,

This seems to do the trick when I attempt it in DevTools:

#tribe_events_filters_wrapper input[type=submit] {
background: #009ccc;
}

The difference is that the plugin CSS uses background vs. background-color which takes precedence.

Cheers!
Geoff

[Jeremy]

Is it possible to exclude certain content from the excerpt in the tooltip on the Calendar view?

We have a shortcode button within the content area on each event page and it shows the text “REGISTER” in the tooltip’s excerpt text. Is there a way to have the tooltip exclude showing just that bit of shortcode for the button and the register text soe that it doesnt show in the excerpt?

[Geoff]

Hello Jeremy!

I’m afraid I’m unfamiliar with the shortcode you’re using for the button. You could try using the Excerpt field in the event editor. That would override what is being grabbed from the event description.

i’m going to go ahead and close this thread since it seems we’re veering from the original topic at hand. Please feel free to start a new thread if you have any other questions and we’d be happy to help there. 🙂

Cheers!
Geoff

[Author]

Posts