editing the CSS

[Edwin]

Hi. I’m trying to change the colors, etc of my calendar views. Not having much luck. Here are the steps I’ve taken.

I created the following directory structure and file name:

/wp-content/themes/MY-THEME/tribe-events/pro/tribe-events-pro.css

which is a copy of the file found at:

/wp-content/plugins/events-calendar-pro/src/resources/css/tribe-events-pro-theme.css

Unfortunately, when I change the CSS in the new file, I see no changes. (I tried deleting the cache also.)

So……

1. Are the directory structure and file names listed above correct? If so, am I missing a step somewhere?

2. Also, is this the only CSS file I need to update?

3. Is there a list that indicates particular screen elements and the corresponding CSS element to change? I want to change a number of things.

At this point, I have three views that I want to update:

http://upstairslounge.net/z1/ (mini month view)
http://upstairslounge.net/z1/events/ (large month view)
http://upstairslounge.net/z1/event/test/ (single event)

4. Is it possible to change the CSS for the form for entering events?

Thanks,

Edwin

• This topic was modified 10 years, 5 months ago by Edwin.

[Brian]

Hi Again,

I can help out here to get you started. See my answers below.

1. Are the directory structure and file names listed above correct? If so, am I missing a step somewhere?

That looks to be correct. I tested on my site and added some css and it worked for me. It could be the css is not overriding the existing ones so it is not showing. Do you have any example of what you changed?

2. Also, is this the only CSS file I need to update?

That should work fine, you are not overriding the existing sheet you are just adding from here.

3. Is there a list that indicates particular screen elements and the corresponding CSS element to change? I want to change a number of things.

Unfortunately, no that list would almost be impossible to maintain. I use the developer tools or firebug in my browsers to find css classes to change. We have a basic guide to getting started using it:

Using Google Chrome Developer Tools

4. Is it possible to change the CSS for the form for entering events?

Any css can be changed with the correct selectors. The Community Events has a body class of tribe_community_edit
You could use that to target form elements on that page only.

Cheers

[Edwin]

Hello again Brian,

Still no luck. Could we try a specific example? Please see http://upstairslounge.net/z1/events/2015-11/

Because my page background is black, the default link color of #111 is not visible. Could you show me how to change that color? I used the element inspector in Chrome to determine that all links on that page are controlled by the class “url”. Unfortunately, I can’t find that class in the stylesheet. I may be editing the wrong file.

Thanks,

Edwin

[Brian]

Hi,

I found this changes the text color for me:

.tribe-events-month-event-title a {
color: #fff;
}

The class might not be in the stylesheet you most likely will have to create your selectors like that.

Thanks

[Edwin]

This reply is private.

[Brian]

Unfortunately, I am not able to teach how to do customizations. I have provided all the resources I have. If you do not know css that is not something we can help with.

Our terms and conditions are clear that we provide the plugin as is and not able to provide help to customize every little aspect of the plugin.

Having said that here is some more information about our stylesheets (Skeleton, Full, or Tribe Events):

https://theeventscalendar.com/knowledgebase/stylesheets-and-page-templates/

It is best practices to use a child theme for any modifications:

https://codex.wordpress.org/Child_Themes

And we have another smaller guide to changing parts of the css:

https://theeventscalendar.com/knowledgebase/changing-fonts-and-colours/

Personally I would just add css and not override the entire thing, but I would also default to doing whatever I can get to work too.

Beyond this I do not have anything else I can provide.

[Support Droid]

This topic has not been active for quite some time and will now be closed.

If you still need assistance please simply open a new topic (linking to this one if necessary)
and one of the team will be only too happy to help.

[Author]

Posts