Mautic icons/Remixicon not loaded after whitelabel when Mautic 5 is installed via Composer method

[matbcvo]

When I install Mautic 5.1.1 using composer create-project mautic/recommended-project:^5 --no-interaction and run whitelabel on it, then Mautic icons (remixicon) are missing. Everything else seems to be fine (colors, logo, favicon are updated).

Below image Mautic is installed via .zip method and whitelabeled, icons are there

libraries.css tries to import remixicon.css from https://<mautic>/node_modules/remixicon/fonts/remixicon.css, but node_modules is not publicly accessible.

mautic-whitelabeler/templates/5.1.1/app/bundles/CoreBundle/Assets/css/libraries/libraries.css

Line 2 in 76af55f

@import "../../../../../../node_modules/remixicon/fonts/remixicon.css";

This project structure is like this:

bin
bin/console
docroot
docroot/app
docroot/media
docroot/plugins
docroot/themes
node_modules
var
vendor
composer.json
package.json

where docroot is publicly accessible.

https://docs.mautic.org/en/5.x/getting_started/how_to_install_mautic.html#installing-with-composer

As this method of installation moves the core app files into a folder called docroot from which Mautic runs, you should ensure that you configure your web server to serve files from this directory. This might mean updating your virtual host and/or NGINX configuration to have /docroot as the root directory. If you don’t do this, it’s likely you’ll see errors when you try to access your Mautic instance.

But when Mautic is installed with .zip method and whitelabeled, then everything is fine, remixicon is loaded. Project structure is different as there is no docroot, just all files are in the same directory.

I think Mautic Whitelabeler should support Composer installation method too, because:

From Mautic 6, the default way to install, update and manage Mautic changes to Composer.

https://docs.mautic.org/en/5.x/getting_started/how_to_update_mautic.html

[zietbukuel]

I'm having the exact same issue.

[iuriJorbenadze]

Fix Missing Icons in Mautic After Applying Whitelabeler Plugin

Problem:

After applying the Mautic Whitelabeler plugin, icons (e.g., RemixIcon) are missing, and the browser console shows 404 errors for remixicon.css.

Solution:

The issue occurs because remixicon is not installed or accessible. Follow these steps to fix it:

---

Steps:

1. Install remixicon via npm:

• Navigate to your Mautic root directory:

  cd /path/to/mautic/

• Install remixicon:

  npm install remixicon

2. Verify the Installation:

• Confirm that remixicon is installed in the node_modules folder:

  ls node_modules/remixicon

• You should see a fonts folder containing remixicon.css and font files.

3. Clear Mautic Cache:

• Log in to your Mautic instance as an administrator.
• Go to Settings > System > Clear Cache.

4. Reload Mautic:

• Refresh your Mautic instance in the browser.
• Verify that the icons are now loading correctly.

---

[iuriJorbenadze]

@matbcvo @zietbukuel @nickian
Check out this fix if you are still having this issue.

[matbcvo]

This does not resolve the issue. The package remixicon is already installed. The problem is not with remixicon itself but with the node_modules directory being located outside the docroot, which makes it inaccessible. The Whitelabeler modifies the remixicon path to point to this node_modules directory, which cannot be accessed. This issue occurs only with Composer-based Mautic installations.