[Resolved] Dynamic CSS & JS not working on Avada theme when Toolset Views is active.

[Author]

Posts

[jamesK-8]

I am trying to:
In the Avada theme there is an option under theme options advance that allows css and javascript to be dynamically created instead of in-line when selecting "CSS Compiling method"
Selecting "File" mode to compile the dynamic CSS to files in uploads/fusion-styles folder.

This works only when Toolset Views is deactivated.

I expected to see: All in-line CSS and in-line Javascript script and rules to be dynamically created within their respected folders.

Instead, I got: no folders created, so the CSS and javascript stain in-line.

[Luo Yang]

Hello,

There isn't similar report, in case it is a compatibility problem of other plugins, please try this:
1) deactivate other plugins and switch to original Avada theme, and test again
2) If the problem still persists, please provide a copy of your website, also point out the problem page URL, where and How can I see the problem you mentioned above:
This works only when Toolset Views is deactivated
https://toolset.com/faq/provide-supporters-copy-site/

[Luo Yang]

Thanks for the details, I am downloading the files, will feedback if there is anything found

[Luo Yang]

Thanks for the details, The Views plugin disabled the Avada CSS Compiling method "file" mode on purpose:
See source code of Views plugin, file plugins\wp-views\vendor\toolset\toolset-theme-settings\compatibility-modules\themes\wpddl.layouts-avada-theme.class.php, line 9~15:

	/**
	 * Force Avada css mode to inline instead of file, this solves the problem with caching
	 */
    public function set_inline_css_mode(){
    	if( !defined('FUSION_DISABLE_COMPILERS') ){
		    define('FUSION_DISABLE_COMPILERS', true);
	    }
    }

So it is not recommended to use Avada CSS Compiling method "file" mode with View plugin, it will conduct some unexpected results.

[jamesK-8]

What problems with caching are created with this option? Is there a fix other than disabling this option?

[Luo Yang]

I have checked it in our to-do list, there is some compatibility problem between Avada CSS Compiling method "file" mode with Layouts plugin:
Avada theme options are not being read on the saved layout for pages/posts.

Since you are not using the Layouts plugin, if you insist on using "file" mode, you can add below line in your theme/functions.php

define('FUSION_DISABLE_COMPILERS', false);

And test again.

[gytis]

I can confirm the issue: running latest Avada theme and all Toolset plugins - with them activated I observe that following folders disappear from file system:
wp-content/uploads/fusion-styles (compiled CSS files)
wp-content/uploads/fusion-scripts (compiled JS files)

And also in Theme options (Avada > Theme Options > Advanced > Dynamic CSS & JS) I can see warning:
IMPORTANT NOTE: JS Compiler is disabled. File does not exist or access is restricted.

Now with plugins:
Toolset Views
Toolset WooCommerce Views
Toolset Layouts
deactivated Avada's CSS compilier works as expected.

Turning plugins back on again deletes mentioned folders from wp-content/uploads and compiliers stop working again.

[Luo Yang]

@gytis, Thanks for sharing the workaround.

[gytis]

Well I can't say it's a workaround - I keep using both Views and Layouts plugins on my site therefore can't use Avada's CSS file generation... This somehow needs to be solved from Toolset plugins side.

[jeffW-6]

I just want to chime in here with @gytis. I am also working with Avada and Toolset and am finding that site performance seems to be taking a hit because the "JS Compiler is disabled". Any chance there is an ETA on when this will be resolved?

Thanks,

Jeff

[gytis]

Any updates regarding this issue?

[gytis]

Is following setting anyhow related?

Avada Fusion Compilers Options

Enable/disable Fusion Compilers to enhance front-end rendering performance. For Avada Settings edited with Toolset to take effect, Fusion Compilers must be disabled.

Enable Fusion Compilers

[gytis]

I can confirm that having following setting in Avada:
Avada > Theme options > Advanced
CSS Compiling method: File
..and Toolset setting:
Toolset > Settings
(General) Enable Fusion Compilers
..solves the issue - CSS files are now generated and can be seen in source by element ID fusion-dynamic-css-css.

Thanks! 🙂