Hide plugins like WooCommerce and Elementor

We do not recommend using WP Ghost to hide classes such as “woocommerce“ and “elementor” (scroll down to the end of this article to see why).

However, since many people requested this feature, we’ve made it available as part of our ongoing commitment to delivering solutions that best meet our customers’ needs.

Some plugins like WooCommerce and Elementor are exclusively built for WordPress.

When their class names are detected in the site’s source code by theme detectors, you will receive the information that your website is using WordPress – even if all the WordPress-specific common paths are changed and hidden.

These plugins add their names to the source code and scripts in JS and CSS files based on those class names.

Hide WordPress Dedicated Plugins

Hide Plugin Class Names

To hide class names from theme detectors, follow the steps below:

1. To activate this option, go to WP Ghost > Mapping > Text Mapping.
2. Add the class names “woocommerce” and “elementor” and assign them different names, such as “shop” and “lp”.
3. Click the Save button to apply the changes.

Change Names in CSS and JS files

Now that you have changed the classes in the source code, you need to synchronize the new class names into the CSS and JS files.

1. Go to WP Ghost > Mapping > Text Mapping.
2. Switch on the Text Mapping in CSS and JS files option.
3. Click the Save button to apply the changes.

Note! Enabling this option will create dynamic CSS and JS files, which may slow down the site’s loading time. This is why we recommend you use a cache plugin to optimize your website’s loading speed and cache the CSS and JS files.

Cache Plugin Note! If you are using a cache plugin, avoid inline defer JS and use delayed JS instead. Inline defer JS will load the javascript content in a Base64 URL and WP Ghost will not be able to load the JS file dynamically and change the class name and paths within.

Troubleshooting

Even if you change the class names and load the CSS and JS dynamically, browser caches, server caches, and probably CDNs can also cache the files.

Theme Breaks or The Layout Doesn't Load Correctly

If your theme appears broken or the layout doesn’t load correctly after modifying the WordPress core paths using WP Ghost, it could be due to incorrect server configurations.

When the new paths for CSS and JS files fail to load correctly, it typically indicates that they have not been appropriately configured. Let’s explore a couple of common scenarios and their corresponding solutions.

Here’s how to troubleshoot and resolve this issue:

Identify the problem

The issue typically arises because the updated paths for CSS and JS files cannot be found or the class names were changed in the source code using WP Ghost > Mapping > Text Mapping and are not found in CSS files. This can disrupt your theme’s functionality and layout.

Clear all cache

If you have a cache plugin or use server caching, clear all the cache, as the change of paths has significantly changed the website’s structure.

Run a Frontend Test

Go to WP Ghost > Change Paths, click the Frontend Test button, and follow the server configuration instructions, if any.

Check Your Server Configuration

For Nginx Servers:

• Ensure the new paths are added to the Nginx configuration.
• After updating the configuration, reload the Nginx service to apply the changes.
• Follow this guide for detailed instructions:
  How to Set Up WP Ghost on an Nginx Server

For Apache Servers:

• Verify that AllowOverride is set to All in your server configuration.
• This allows the .htaccess file to load the new paths correctly.
• Follow this guide for detailed instructions:
  How to Set AllowOverride All

Additional Resources

For a comprehensive guide on configuring your server to ensure themes and layouts load correctly, refer to this tutorial:
Theme Not Loading Correctly? Website Loads Slower?

By addressing these configuration issues, your theme and layout should display correctly after path changes.