Overwritten CSS files after enabling CSS file merging and compression - Support

Viewing 24 posts - 1 through 24 (of 24 total)

Author

Posts
July 2, 2019 at 1:38 pm #1115167

phouthuijzen
Participant

Guys,

I am done editing for my website and have enabled CSS file merging and compression for better website speed. But everytime I enable this function my CSS files get overwritten and some stuff is wrong. For example the two logos are now beneath eachother (wrong), when I disable the CSS file merging and compression one logo is left the other on the rigth side (Good). I already have tried to enable the “Delete old CSS and JS files?” but nothing helps. Please help me!

Thank you in advance.

Regards,
Patrick

July 3, 2019 at 8:02 am #1115363

Rikard
Keymaster

Hey phouthuijzen,

Thanks for the login details, though they are not working. Please check and verify. Where exactly can we find the CSS related to the logos?

Best regards,
Rikard

July 3, 2019 at 9:49 am #1115401

phouthuijzen
Participant

Excuse me, new login details below :).

The CSS related to the logo’s are in my style.css and functions.php files of my child-theme. I upload these files with Filezilla (FTP program). I have put the login for FTP credentials also in the private content area. If you login to my FTP, remember to go to the map /public/sites/www.ictleadservices.nl/enfolddemo This is where I have my new “under construction” website and the child theme files where I have put the code.

Best regards,
Patrick

July 4, 2019 at 4:13 am #1115622

Rikard
Keymaster

Hi Patrick,

Thanks for that, though I can’t see anything in style.css in your child theme, it’s empty. And functions.php only contains a function without any styling. Are you saying that these files have other content before you turn on file compression, and after you have turned it on they are overwritten? Or could it be that you are uploading the wrong files via FTP?

Best regards,
Rikard

July 11, 2019 at 9:48 am #1117726

phouthuijzen
Participant

Hi Rikard,

Thank for replying zo quick.

I think you must be watching the WordPress Theme Editor, because I see the same as you (no style.css in my child theme and one code in my functions.php). The strange thing is that if I Disable the CSS file merging and compression everything on the website is shown in a good way (logo etc.), so it should pick up the right style.css file. But nothing changes in the WordPress Theme Editor, I see no style.css code still empty (which is strange) and one code for the Header widget area in my functions.php (which is similar as the code I have uploaded with FTP). In other words I see the same results in WordPress Theme Editor when I disable or enable CSS File Merging. Nothing changes.

You can see I have uploaded my style.css and functions.php files with FTP to the map: /public/sites/www.ictleadservices.nl/enfolddemo/wp-content/themes/enfold-child if you log in to my FTP. This is not wrong, is it? And you can also see that there is more code in my style.css on the FTP server than there is to see in the WordPress Theme Editor. Strange stuff….

July 12, 2019 at 4:57 am #1117912

Rikard
Keymaster

Hi,

Thanks for the update, though the site in private seems to be down at the moment?

Best regards,
Rikard

July 15, 2019 at 9:13 am #1118708

phouthuijzen
Participant

I just checked, should be working now.

July 16, 2019 at 5:26 am #1119032
Rikard
Keymaster
Hi,

Thanks for that. Are you sure that you are uploading to the correct site? I’m checking the path in private, and I see the same content in your functions.php via FTP as I do in the WordPress editor:
```
/*
* Add your own functions here. You can also copy some of the theme functions into this file. 
* WordPress will use those functions instead of the original functions then.
*/

//--------------------------------

// Header widget area

//--------------------------------

add_action( 'ava_after_main_menu', 'enfold_customization_header_widget_area' );
function enfold_customization_header_widget_area() {
dynamic_sidebar( 'header' );
} 
```
Best regards,
Rikard
July 29, 2019 at 11:55 am #1122720

phouthuijzen
Participant

Hi Rikard,

Very busy so sorry for the delay. Where do I have to put my funtions.php and CSS file according to you? It is very strange that the website works with CSS and Javascript merging disabled, but does not work properly when enabled. So it should be on the correct site and map, because else it won’t work if i disable the CSS and Javascript merging.

I have the same problem with another website. Also enabling of disabling the merging performance is the trigger for working website or not properly working. Meaning the CSS that is working or not working. Please have a look in to thjis, because this drives me crazy…

With regards,
Patrick

July 30, 2019 at 9:08 pm #1123297

Basilis
Inactive Moderator

Hi,

You need to put this over functions.php file

Best regards,
Basilis

August 1, 2019 at 2:15 pm #1123905

phouthuijzen
Participant

Hi,

I don’t understand what you mean. Maybe it will work at onother site: http://www.ictredactie.nl (same problem as above).

In my child theme (/public_html/ictredactie.nl/wp-content/themes/enfold-child) i put a CSS code for the footer.(font-size 12px). When i enable merge and compress all theme CSS files and merge and compress all theme javascript files, my CSS didn’t work anymore. The font size is much bigger.

Can you help me? What am i doing wrong?

August 6, 2019 at 10:59 am #1125049

Ismael
Moderator

Hi,

Thank you for the update.

The site looks the same with or without the file compression. Can you give us a screenshot of the styling issue, or the difference when you enable the compression?

Best regards,
Ismael

August 6, 2019 at 11:33 am #1125064
phouthuijzen
Participant
Hi,

The first image is the good one (footer-right.jpg). The font size of my footer is 12px. Here is the CSS and Javascript file mering and compression disabled.
When i enable the CSS and Javascript file, the font size is much bigger (footer-wrong.jpg)

With Regards,
- This reply was modified 5 years, 4 months ago by phouthuijzen.
August 7, 2019 at 10:54 am #1125448
Ismael
Moderator
Hi,

Thank you for the info.

The following code is added in the style.css file, but when we try to edit the file from the Appearance > Editor panel, it’s blank. Why is that?
```
#footer .widgettitle + * {
    font-size: 12px !important;
}
```
Best regards,
Ismael
August 7, 2019 at 1:53 pm #1125530

phouthuijzen
Participant

Hi,

That is very strange. When i go to the appearance > editor panel, it’s not blank. See the picture.

I have no idea what is going wrong here..

Best Regards,

August 8, 2019 at 10:06 am #1125856

Ismael
Moderator

Hi,

Thank you for the update.

We can access the style.css file now. Odd.

We moved the css in the Enfold > Quick CSS field and re-enabled the compression. This time it works.

Best regards,
Ismael

August 8, 2019 at 2:12 pm #1125945

phouthuijzen
Participant

Hi,

Thank you. It is working now. Nice!

But one question remain: To the right of the Quick CSS is this: Just want to do some quick CSS changes? Enter them here, they will be applied to the theme. If you need to change major portions of the theme please use the custom.css file or the Enfold Child theme.

Why isn’t our child theme working when we enable CSS and Javascript file mering and compression? What are we doing wrong?

Best Regards,

August 9, 2019 at 3:19 pm #1126244

Ismael
Moderator

Hi,

Thank you for the update.

Did you add any modifications related to the style.css file? We are not really sure why the style.css is not being included in the compression.

Best regards,
Ismael

August 14, 2019 at 2:01 pm #1127616

phouthuijzen
Participant

Hi Ismael,

No we did not add any modifications related to the style.css file. So i really don’t know why it isn’t working..

Best Regards,

August 19, 2019 at 1:51 am #1128766

Ismael
Moderator

Hi,

I see. We can’t really reproduce the issue on our end, so this is probably an issue with a plugin or perhaps a server configuration but that’s very unlikely. As a temporary solution, add the style modification in the Quick CSS field instead of the child theme’s style.css file.

Sorry for the late response.

Best regards,
Ismael

March 8, 2021 at 1:00 pm #1286428

phouthuijzen
Participant

Hi,

In about 1,5 years later we still have this problem. We are currently working on a new site. We are working in the Enfold-Child template, with a style.css. I put this code in the style.css: .container_wrap { border-top: none; }. When i enable merge and compress all theme CSS files and merge and compress all theme javascript files, my CSS didn’t work anymore. The border (under the breadcrumb) is still visable. When i disable merge and compress all theme CSS files, the border is gone (what i want). When i put the code .container_wrap { border-top: none; } in Enfold > Quic CSS field, it also works. But that is not what i want. Why is my style.css not working in my Enfold Child theme, when i enable merge and compress all them CSS files?

Best Regards,

March 10, 2021 at 5:25 am #1286974

Rikard
Keymaster

Hi,

Thanks for the update. Please post admin WordPress login details in private to the new site, so that we can have a closer look.

Best regards,
Rikard

March 10, 2021 at 9:45 am #1287022

phouthuijzen
Participant

Hi,

I put the login details in the private section.

In the mean time i am working at the site. In the style.css of the Enfold Child theme you can see the code: .container_wrap { border-top: none; }. This is not working.

Because this doesn’t work, I temporarily put other css changes in the quick CSS field. Eventually I want to have this in the style.css file too.

Best Regards,

March 13, 2021 at 4:23 pm #1288030

Günter
Keymaster

Hi phouthuijzen,

@phouthuijzen

There had been a invalid character at the beginning of styles.css – opening it in WP theme editor showed a red point. Removing this it is working now.

Best regards,
Günter
Author

Posts

Viewing 24 posts - 1 through 24 (of 24 total)

You must be logged in to reply to this topic.