Eduardo
Eduardo

Reputation: 1

Exclude the header of my web page created with Elementor from the LiteSpeed ​Cache optimization plugin

Due to the optimization of the CSS files with the LiteSpeed ​​Cache plugin, my Elementor header appears deformed, how do I find the CSS class to be able to exclude the header from the Lite Speed ​​optimization? Thank you and I hope you can understand me.

I tried putting the css classes that were supposed to be from the Elementor Pro header created by a container. I added them in the "Exclude CSS" and "Exclude unused CSS file and embed" boxes, but I couldn't get it to work, the header still displays wrong. It only shows like this on the home page, on the other subpages it shows fine. I would not like to disable CSS optimization as it would load my website slower.

Upvotes: 0

Views: 1359

Answers (1)

Obase
Obase

Reputation: 145

Follow these steps to exclude the header of your Elementor-built web page from the LiteSpeed Cache optimization:

1. Identify the Header Container:

  • Use your browser's developer tools (usually accessible by right-clicking on the page and selecting "Inspect" or "Inspect Element") to identify the HTML structure of your header.
  • Look for a unique class or ID associated with the header container.
  • Alternatively, assign a unique ID to the header container on the Advanced tab of the element's settings.

2. Exclude CSS Classes:

  • Once you've identified the CSS classes/ID's associated with your header, go to the LiteSpeed Cache settings in your WordPress dashboard.
  • Look for the "Exclude CSS" option and enter the CSS class or classes associated with your header.
  • Save the changes and clear the LiteSpeed Cache.

3. Exclude Unused CSS File and Embed:

  • If excluding specific classes doesn't work, you can also try excluding unused CSS files or embedding. Look for the "Exclude unused CSS file and embed" option in the LiteSpeed Cache settings.
  • Enter the path or filename of the CSS file associated with your header.

4. Cache Purge:

  • After making these changes, make sure to clear your LiteSpeed Cache to see the effects. Use the "Purge All" button. Very important!

5. Check Home Page Specifics:

  • Since you mentioned that the issue is specific to the home page, check if there are any home page-specific settings in LiteSpeed Cache. Check both the Cache and Page Optimization tabs for this.

6. Theme or Elementor Settings:

  • If everything else fails, check if your theme or Elementor has any settings related to CSS optimization. Sometimes themes or page builders have their own optimization features that may be interfering with LSCache.

Upvotes: -1

Related Questions