Hi to all!
Search drupal site all the way down, but still could not find any correct answer on strange behaviour happening when enabling CSS and JS aggregation checkboxes in Administer > Site configuration > Performance. In one word - this does not work for me as expected messing up all the css layout, but only partly. I would like to get any comments on my situation on collaborate a bit on this question.
What I did.
I started to design new theme for my drupal website. Work was done using MAMP and local installation. Theme design was started with Zen theme pack - Starterkit. Followed Readme file, installed all necessary parameters and tuned CSS to my needs. Works OK till this part.
Wanted to do.
After completing design, wanted to move it to testing server (Ubuntu, Apache2, PHP5, MySQL 5.x, Drupal 6.9). Again - everything OK.
Problems begun here.
After moving all the files and launching new site, I tried to prepare site for production use, enabling caching, compression, etc. Things in Performance settings. Unfortunately after enabling CSS Aggregation checkbox my site frontend changed a lot, namely loosing css theming. The strangest thing - it did it partly.
My tried solutions and findouts.
During portal search I found out some significant things, that had to be checked and discovered the following:
1. After enabling css aggregation, drupal merges css files in one file and saves it in sites/default/files/css folder with system created file name. I checked permissions on folder and files - they are OK and can be accessed through browser. (accessible to apache user and with 775 parameters).
2. Found some solutions concerning core hacking and manual GZipping and tuning - didn't changed at this point anything, considering this not as important on this stage.
3. CSS image paths were made inside theme folder and stated ... url(images/filename.png).... Assuming, that Drupal gets it from theme folder and not from DocumentRoot, if I'd put a slash "/" before images. Even tried with full path - the same effect.
4. mod_rewrite and Clean URLs are working corectly - no changes needed there, and Apache VirtualHosts definitions are simple and corect.
5. No manual modifications were made to .htaccess file for Drupal directory.
6. I am aware of Drupal caching. So any changes made to css files, while experimenting, was taken into account, clearing caches, browser caches.
7. Thought - my apache conf was not correct. Checked back on dev machine - the same situation. So probably the cause is somewhere else.
8. Suggestions met in drupal site was not concerning later than drupal 6.4 version. So I expected, that this could be solved up to v6.9.
9. Didn't touch caching settings so far. Wanted to solve css aggregation first, and after move forward.
After trying to dive into what does the browser see (Firefox 3, Mac OS), I noticed, that i had lost css styling only partly. For ex., I had background image on body html tag and global font-family declaration, but after css aggregation - no signs of css background parameters, although other settings are ok.
Another try - tried to restyle Garland theme with my settings. Original Garland theme works correct, if css aggregation is enabled, but restyled garland theme - not again.
Question.
Could anybody, please, push me in right direction for solution? What causes css aggregation in one file, and why it is done partly? I expected all css files defined in .info file to be merged, but unfortunately something is overriding css parameters. I had different settings for same tags in different css files, but still in dev mode I could see in Firebug, that hey were overriden correctly, leaving things I expect. But after Performance tuning - was lost. Even tried to publish all css settings for one tag in one css file - the same result.
Comments
My guess is that you have
My guess is that you have some broken syntax in your custom css and that aggregation causes the result of the defect to be worse. With css aggregation both on and off try submitting your site to the w3 css validator. It may show you a syntax error.
--Zivtech--
--Zivtech--
Hi, I allready did that.
Hi, I allready did that. Just forgot to mention. Unfortunately I did it with offline site. I'll try to get in public and check it again. But I noticed big amount of errors only in js files from contributed modules, but not in css. But after disabling all but core and some core optional modules, things didn't chanded at all.
adding comments: No, the problem is not in CSS. All CSS went through v2.1 validation. Result with aggregation - the same.
Similar
I've customised a custom template by adding an extra css file into the
.info. All works fine until I try to 'optimize css files'. Then I get the original theme without my additions.
When I validated my css, I did have some errors, which I've corrected. However, the original theme also has errors which doesn't seem to affect the optimisation.
Ignore my comment above
I've discovered the problem I was having. My css was being added successfully, but when I looked at the css file created in /sites/default/files/css, I discovered my css was all commented out. This is because at the top of the file, I'd accidentally nested a start of comment line '*/' within another comment, e.g.:
/* this is a css comment
/* and here's the nested one
*/
subsequent code is treated as css until the file is optimised
You're having path issues
I was trying to fix a different problem related to caching and Drupal misbehaves if there are path errors.
Since you are moving to a production server, there's path problems partially.
I cannot dig any further than that, but have to say that I found out about the issue by trying to adjust Administer > Site Configuration > File System
path settings.
I hope this little bit helps.
Probably you are right...
Unfortunately the quickest way for me was to check once more css and finaly I managed to rewrite it due to timing problem. But the same issue arrised experimenting with jquery_update module, using compressed js files (packed or minified). Due to that I'll try to experiment with another project, and in case of success, post additional info. Thanks anyway for another direction.
This solution worked for me
This solution worked for me (after an hour of head-scratching): make sure all your files are encoded as UTF-8 NO BOM, not UTF-8.