CSS Formatting for the page appears to be missing

Do you use the Jetpack plugin?

To get it working, you need to disable Asset CDN on @wpcerber admin pages. WP Cerber does not allow offloading its admin assets to remote servers. There is a post on the support forum: https://t.co/MB0yHovud3

— WP Cerber Security (@wpcerber) December 31, 2022

The fix is the same that I had to do a few months ago that I thought had been resolved –

If you go into the wp-admin/admin.php?page=jetpack_modules page and disable Asset CDN it works again. Tons of errors in the inspect window under the network tab when activated

Hi there!

I work on the Jetpack team, and this was recently reported to us as well. I wanted to offer a work-around for folks who would want to use both Jetpack’s CDN feature as well as WP Cerber.

Before I offer the work-around, I wanted to try to offer a bit of background behind the problem, for anyone curious as to what’s happening in their dashboard.

This problem will happen on all WP Cerber admin pages if you use WP Cerber version 9.2 or higher, in combination with Jetpack and its Site Accelerator feature, specifically the static file CDN:

• When you activate this Jetpack feature, static assets (JavaScript and CSS files) shipped with WordPress itself, the Jetpack plugin, and the WooCommerce plugin will be served from Jetpack’s content delivery network (CDN), alleviating the load on your server.
• In version 9.2, WP Cerber stopped allowing remote files to be loaded in all its admin pages.

The 2 features cannot really work well together. WP Cerber’s admin pages rely on files shipped with WordPress itself (stylesheets and JavaScript files used to style the pages), but those files cannot be loaded anymore since they would be loaded from a remote CDN.

There are 2 ways to work around the problem:

1. You could disable the CDN feature in Jetpack, by flipping the toggle in the screenshot above (located under Jetpack > Settings > Performance in your dashboard).
2. You can bypass Jetpack’s Asset CDN when you’re on a WP Cerber admin page, by adding the following code snippet to your theme’s functions.php file, or to a functionality plugin on your site:

/**
 * Filter the core version and locale
 * used for the static assets CDN from Jetpack,
 * when on WP Cerber's admin pages.
 *
 * We'll return a custom version number that we know
 * will never match a public version of WordPress.
 *
 * @param array $version_and_locale array( $version  = core assets version, i.e. 4.9.8, $locale = desired locale )
 *
 * @return array The core version and locale.
 */
add_filter(
	'jetpack_cdn_core_version_and_locale',
	function ( $version_and_locale ) {
		$current_screen = get_current_screen();
		if (
			! empty( $current_screen )
			&& false !== strpos( $current_screen->base, 'cerber' )
			&& ! empty( $version_and_locale )
		) {
			return array( 'cerber_' . $version_and_locale[0], $version_and_locale[1] );
		}

		// Fallback.
		return $version_and_locale;
	}
);

/**
 * Filter the name of the Jetpack plugin
 * returned for the static assets CDN from Jetpack,
 * when on WP Cerber's admin pages.
 *
 * We'll return a custom plugin version that we know
 * will never be used by Jetpack.
 *
 * @param array $jetpack_slug_and_version array( $slug = the plugin repository slug, i.e. jetpack, $version = the plugin version, i.e. 6.6 )
 *
 * @return array The Jetpack plugin slug and version.
 */
add_filter(
	'jetpack_cdn_plugin_slug_and_version',
	function ( $jetpack_slug_and_version ) {
		$current_screen = get_current_screen();
		if (
			! empty( $current_screen )
			&& false !== strpos( $current_screen->base, 'cerber' )
			&& ! empty( $jetpack_slug_and_version )
		) {
			return array( $jetpack_slug_and_version[0], 'cerber_' . $jetpack_slug_and_version[1] );
		}

		return $jetpack_slug_and_version;
	}
);

I hope this clarifies things a bit!

Thank you @jeherve for the work-around! However, I would prefer to see Jetpack does not offload and load admin assets from a remote server. This is an unsafe and non-compliant with privacy laws approach. I hope you get a user consent before processing/storing website owners’ personal data on Jetpack servers.

I would prefer to see Jetpack does not offload and load?admin assets?from a remote server.

That’s a good idea, and not something I had thought about. Thanks for the idea!

While it can be a bit tricky to disable Jetpack’s asset CDN only on the WP Cerber admin pages, it is much easier to disable it on?all admin pages. The feature will still work on your site’s frontend so site visitors can enjoy the benefits of running the CDN. However, it will not be active in your dashboard anymore, and as a result will not break WP Cerber’s admin page.

You can achieve that with the following code snippet:

/**
 * Disable Jetpack's Asset CDN in the wp-admin dashboard.
 *
 * @return bool
 */
add_filter(
	'jetpack_force_disable_site_accelerator',
	function () {
		if ( is_admin() ) {
			return true;
		}
		return false;
	}
);

That’s a lot simpler than the code snippet that I posted above, so most folks may prefer that approach. ??

@gioni Maybe that’s even something you could add to your plugin, to preemptively fix the issue for all site owners that use your plugin and may enable Jetpack’s CDN feature? Granted, that won’t fix the issue for folks using another CDN, but that may help some people already!

This is an unsafe and non-compliant with privacy laws approach. I hope you get a user consent before processing/storing website owners’ personal data on Jetpack servers.

Yes, that’s an important point indeed. ??
The CDN feature isn’t enabled by default when you activate the Jetpack plugin. Site owners interested in the feature can only enable it once they’ve taken note of the Terms of Service and connected their site to WordPress.com. We also offer tools to help site owners understand all this and help them comply with privacy laws such as the GDPR.