Stylesheets pulling styles from all over

[Donald]

Hi, I upgraded to Pro 3.10 and the styles are all horrible. Overlapping text and tooltips with text hanging over. I also installed in the my theme folder a tribe folder as instructed and created new css files. Your calendar is still showing styles from the 20 plus style sheets in the regular events calendar plugin folder and the pro folder. How can I get rid og all these css files and have one?

[George]

Hi Donald,

The theme folder you’ve added, and the stylesheets you’ve added within it, unfortunately will not help here – you can remove those files if you’d like.

As for your specific issues, I checked out the “Resources” being loaded on http://sfciviccenter.org/events and didn’t notice any problematic amount of Tribe CSS files being loaded – it seemed like the required the plugin CSS was being loaded without issue, although there are many other plugins loading their own CSS too.

Can you clarify exactly what happened before and after updating? Were all your styles completely fine before updating, and then as soon as you activated 3.10, they broke like this?

Also, have you made any customizations to any Events Calendar-related CSS OR HTML anywhere on your site?

Thank you!
George

[Donald]

So why do your instructions say to create those folders and files if they don’t work????

the templates were all jumbled before the update. I’ve tried the full tribe, the skeleton and one in the middle, al like this.the Buttons covering text area, the tooltip not fitting the content. Also, if I want to change the calendar, the formatting for the name of the event is in one style sheet, the date is in another, description another, calendar grid yet another. I don’t know if I have made any html changes. I also installed the free version on a friend’s site that I’m helping her with and hers works fine.

There was a line somewhwe that said you could block or whatever all css and make your own, How do I do that?

[George]

Hi Donald,

Adding new CSS files can be a solution for customizations and such, but the essence of your question boiled down to what you ended your first post with:

How can I get rid og all these css files and have one?

Adding more files to a sub-folder for Events in your theme can help with some customization issues, but won’t help here, and your problems seem to mostly be because of the CSS coming from your theme, as evidenced by your comments about setting up the calendar on a friend’s site and not having these issues.

Further, you mentioned having trouble customizing things because of CSS being spread across different files:

Also, if I want to change the calendar, the formatting for the name of the event is in one style sheet, the date is in another, description another, calendar grid yet another.

This is not quite true, but if you want to simplify things, the best solution for that is to go back and select the “Skeleton” styles on your site. This will leave the rest of the styling up to your theme, which though it seems to be the main problem here, would simplify the process of fixing these styles because you could then just write CSS to correct it one place: at the very bottom of your theme’s style.css file.

I’m sorry about some of the limitations that come into play when the main problem is your theme, but that seems to be the case here. Hopefully being able to customize things at the bottom of your theme’s style.css helps simplify things a bit.

Cheers,
George

[Donald]

ok, these are the instructions, from your files, You are telling me they are wrong.

* The Events Calendar Tribe Theme Stylesheet
*
* To add your own custom styles, create a stylesheet with the name
* tribe-events.css in the tribe-events/ directory of your theme.
* Your new stylesheet will be loaded after our own stylesheet.
*
* To replace our stylsheet altogether, you can use the ‘tribe_events_stylesheet_url’ filter. (was asking about this – never got an answer)
*

then you end with blaming my template for the conflict.

earlier I asked how ot change colors for different event categories and said specifically that the plug-in they suggested no longer works so please offer another way using CSS. he did not read it and told me to get the same plug-in i had said was not working.

I had thought that getting pro would add something is t really has not added much.

[George]

Hi Donald,

I’m sorry you’re disgruntled about this and feel our support wasn’t adequate. Let’s take a step back and try to make things right here, as we do care about your site and want to help.

There are several different problems and issues going on at once. Let’s cut all that out and focus first on loading custom stylesheets.

First things first, you wrote this in your reply above:

* To replace our stylsheet altogether, you can use the ‘tribe_events_stylesheet_url’ filter. (was asking about this – never got an answer)

If you see your original two posts on this thread, you don’t mention filters anywhere, so it was an honest miscommunication and I’m sorry I didn’t pick up on your desire to use these filters.

If you want to use the filters listed in that Themer’s Guide article, your best bet is to follow the code examples there that show how to use those filters.

Check out the information in that article that I screenshotted here → https://cloudup.com/caUBzaBsMdz

Read those two paragraphs, do they help? Basically: set the “Tribe Stylesheet” option to “Skeleton”, then follow the instructions there to point to a file called custom-events-stylesheet.css in your theme.

You will have to create this file in your theme’s root directory – that means that this file does not go in the /tribe-events folder of your theme.

If you first create this file, then add those filters to your theme’s functions.php file, and then delete your other attempted customization files to keep things simple and organized here, we should be in a good place to continue addressing your other questions.

Let me know if this helps clarify things a bit, at least for this first step. We can move to your other items once we’re squared up on this one.

Your patience means a lot, and I appreciate it. By tackling these items one at a time hopefully we can get things working as desired on your site.

Sincerely,
George

[Donald]

ok- this:

* To replace our stylsheet altogether, you can use the ‘tribe_events_stylesheet_url’ filter. (was asking about this – never got an answer)
was copied from the your css files header, I was quoting it to aks on howe to change the style sheets.

So I used your There’s Guide, which says:

Loading Custom Styles for The Events Calendar PRO (premium)

To load custom styles for PRO views and elements, create a stylesheet called tribe-events-pro.css in the tribe-events/pro/ directory of your theme.
To load custom styles for the Events Calendar widget, create a stylesheet called widget-calendar.css in the tribe-events/pro/ directory of your theme.

So are these instructions for the Themer’s Guide wrong? I created folders as instructed in my theme folder. Now you say I have to add to my function file instead.

[Donald]

Also, not trying to be a pain, I want this to work.

I had other support threads with some answers saved there and they appear to not be around anymore. Were they deleted?

I also have this installed on three sites all with different hosting and all with different themes and plugins, so when the default answer to every issue is “its your theme” it is a little insulting.

I have followed the instructions on your site and things do not work, then I;m told about a different fix that is not mentioned anywhere else. How am I supposed to know which instructions to follow and whcih ones not.

[George]

Do you want to keep all existing Events Calendar styles, and just load some extra styles in addition to the Events Calendar’s own styles?

Or do you want to REPLACE the existing Events Calendar styles with your own stylesheet altogether?

[Donald]

I wanted to use the Tribe style but be able to make changes to it and keep the file from being overridden.

[George]

Hi Donald,

Okay, if you want to keep the tribe styles but just extra styles on top of the defaults provided, then:

• Remove any and all filters or custom PHP code you might have added to your theme’s functions.php file or something, related to the Tribe stylesheet URL or anything like that.

• Then, just add the custom CSS you would like to the /tribe-events.css file that you’ve created in the /tribe-events folder of your theme.

This file is being loaded fine on your site, it’s just empty: http://sfciviccenter.org/wp-content/themes/theme1389/tribe-events/tribe-events.css

If you have not added any custom PHP code to your site related to Tribe stylehseet URLs, then there is a separate problem here relating to how all those Tribe stylesheets are being loaded on your page. I did not notice this before but see it when I check your site now. This could be because of a plugin or something on your site, however it should not actually cause technical problems – it just slows things down a tiny bit.

But adding the custom CSS you would like to the /tribe-events.css file that you’ve created in the /tribe-events folder of your theme should not be affected by that problem at all. I will investigate that problem to see if I can recreate it and see what I find.

Thank you,
George

[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