The author box layout is being displayed oddly

Molongui » Help » Molongui Authorship Docs » Author Box » The author box layout is being displayed oddly
This article applies to any version of the plugin, release 1.3.5 or higher.

Molongui Authorship relies on some useful jQuery libraries to make the author box responsive so it displays nicely on any screen size. Some optimization plugins, like WP Rocket or Autoptimize, may cause trouble loading those libraries properly making the author box to be displayed in a weird or undesired way.

So, if you have Autoptimize, WP Rocket, Breeze or any other optimization plugin installed and experience issues with how the author box is displayed, please be sure to include the following files to the exclusion list of CSS files (it might be a setting called something like “CSS files to exclude from optimization” or similar). Wildcard masks may vary between plugins, so you should read that plugin documentation to know how to use wildcard masks:

Molongui Authorship
/wp-content/plugins/molongui-authorship/assets/css/(.*).css

Molongui Authorship Pro
/wp-content/plugins/molongui-authorship-pro/assets/css/(.*).css

You don’t have to worry about those files not being optimized because all JavaScript and CSS files from Molongui plugins are already minified and optimized. Below we explain how to exclude those Molongui Authorship libraries from some of the most used optimization plugins:

How to exclude CSS files in W3 Total Cache

Allowing W3 Total Cache plugin to minify, combine and defer Javascript and CSS files from Molongui Authorship shouldn’t cause any trouble. However, enabling a CDN to deliver CSS files from it, could.

So, if you want to deliver CSS files from a CDN and your author boxes aren’t being rendered fine, make sure to set the configuration below:

  1. Go to “Performance” > “CDN” (check out screenshot below)
  2. Go to the “Advanced” tab/section
  3. In the “Rejected files” text input specify the following paths (each one in a new line):
    • {plugins_dir}/molongui-authorship/assets/css/*
    • {plugins_dir}/molongui-authorship-pro/assets/css/*
  4. Click on the “Save Settings & Purge Caches” button
  5. Done!

How to exclude CSS files in Autoptimize

To exclude the above mentioned Molongui Authorship libraries from optimization when using Autoptimize plugin, make sure to follow the steps below:

  1. Go to “Settings” > “Autoptimize”
  2. Open the “Main” tab
  3. Click on the “Show advanced settings” button, on the top-right corner
  4. In the “Exclude CSS from Autoptimize” text input, under the “CSS options” section, specify the following path (separating it with a comma from the existing ones):
    • /wp-content/plugins/molongui-authorship/assets/css/
    • /wp-content/plugins/molongui-authorship-pro/assets/css/
  5. Click on the “Save changes and empty cache” button
  6. Done!
Excluding files from optimization in Autoptimize
Excluding files from optimization in Autoptimize

How to exclude CSS files in WP Rocket

Allowing WP Rocket to minify, combine and defer Javascript and CSS files from Molongui Authorship shouldn’t cause any trouble. However, enabling a CDN to deliver CSS files from it, could.

So, if you want to deliver CSS files from a CDN and your author boxes aren’t being rendered fine, make sure to set the configuration below:

  1. Go to “Settings” > “WP Rocket”
  2. Open “CDN” tab
  3. In the “Exclude files from CDN” textarea input, specify the following URLs, one per line (see image below):
    • /wp-content/plugins/molongui-authorship/assets/css/(.*).css
    • /wp-content/plugins/molongui-authorship-pro/assets/css/(.*).css
  4. Save changes
  5. Open the “File optimization” tab
  6. In the “Excluded CSS files” textarea input, under the “CSS files” section, specify the following URLs, one per line (see image below):
    • /wp-content/plugins/molongui-authorship/assets/css/(.*).css
    • /wp-content/plugins/molongui-authorship-pro/assets/css/(.*).css
  7. Save changes
  8. Done!
Excluding files from a CDN on WP Rocket
Excluding files from optimization in WP Rocket

You can read further information on how to exclude CSS files from optimize CSS delivery in WP Rocket’s documentation.

How to exclude CSS files in Breeze

Breeze is another cache plugin that provides CDN integration options. Allowing Breeze to cache, minify, combine and defer Javascript and CSS files from Molongui Authorship shouldn’t cause any trouble. However, enabling a CDN to deliver CSS files from it, could.

So, if you want to deliver CSS files from a CDN and your author boxes aren’t being rendered fine, make sure to set the configuration below:

  1. Go to “Settings” > “Breeze”
  2. Open the “CDN” tab
  3. In the “Exclude content” input, add the following paths using a comma without spaces as a separator between elements (see image below):
    • /wp-content/plugins/molongui-authorship/assets/css/
    • /wp-content/plugins/molongui-authorship-pro/assets/css/
  4. Save changes
  5. Purge all cache
  6. Done!
Excluding files from a CDN on Breeze

How to exclude CSS files in LiteSpeed Cache

LiteSpeed is another cache plugin that provides CDN integration options. Allowing LiteSpeed to cache, minify, combine and defer Javascript and CSS files from Molongui Authorship shouldn’t cause any trouble. However, enabling a CDN to deliver CSS files from it, could.

So, if you want to deliver CSS files from a CDN and your author boxes aren’t being rendered fine, make sure to set the configuration below:

  1. Go to “LiteSpeed Cache” > “Settings”
  2. Open the “CDN” tab
  3. Click on the “Show Advanced Options” button on the top-right.
  4. In the “Exclude Path” input, add the following paths, one per line (see image below):
    • /wp-content/plugins/molongui-authorship/assets/css/
    • /wp-content/plugins/molongui-authorship-pro/assets/css/
  5. Save changes
  6. Purge all cache
  7. Done!
How to exclude CSS files from SpeedLite Cache Plugin
Updated on September 4, 2022

Did not find a solution? We are here to help you succeed.
Open a support ticket