cancel
Showing results for 
Search instead for 
Did you mean: 

How to fix admin page css got broken?

How to fix admin page css got broken?

i have this issue after i try to fix admin icon. Here is my problem can anybody suggest me some solution. I really appreciate it.Screenshot from 2022-07-19 17-48-58.png 

9 REPLIES 9

Re: How to fix admin page css got broken?

Hello @annq3sivn4281 

 

Try to static deploy - 

php bin/magento setup:static-content:deploy in the magento root directory

 

and set permission by below command:
sudo chmod -R 777 var/ pub/ generated/

 

It may help you!
Thank you.

Problem solved? Click Accept as Solution!

Re: How to fix admin page css got broken?

You are not helping me at all, STOP IT!

Re: How to fix admin page css got broken?

Hello @annq3sivn4281 ,

 

This issue is caused because your static files (css/js) are not able to execute.

You can check in console log, your css/js files must going to 404, just open any of those in new window.

Now, check where you are pointing your domain, if it's pointing to docroot of project, then the static files URL must included "pub" in those, for ex : "https://LOCAL.DOMAIN.COM/pub/static/...."

in that case or vice versa, check your domain pointing and your static files path you have set.

 

Also share those details here and any static file generated path.

 

Hope it helps !

Problem Solved ? Click on 'Kudos' & Accept as Solution ! Smiley Happy

Re: How to fix admin page css got broken?

Honestly, i did not have this error at the beginning. I follow the step from Bhanu Periwal, he giuld me to remove some files from root, i follow those steps and this lead me that my admin page layout broken. So that is all my issue

Re: How to fix admin page css got broken?

@annq3sivn4281 ,

 

Can you share what steps you have taken ?

if you are referring the above comment, that directly won't remove any file, you can run all the commands again and share output :

rm -rf generated/metadata/* generated/code/* var/cache/mage-* var/page_cache/mage-* var/view_preprocessed/* var/di/* pub/static/_* pub/static/frontend/ pub/static/adminhtml/
php bin/magento se:up
php bin/magento se:di:co
php bin/magento se:st:de -f
php bin/magento c:f

let us know the results here.

Problem Solved ? Click on 'Kudos' & Accept as Solution ! Smiley Happy

Re: How to fix admin page css got broken?

Re: How to fix admin page css got broken?

oh okay, got the issue.

So you are not supposed to clear whole pub/static/ as there is a file (.htaccess) inside static folder which is required and which manages the static files url redirection etc.

You can do one new, setup a new demo project in your local, copy static folder from there and paste inside your current project pub/ folder and then  rerun commands I shared above.

 

Hopefully it will resolve your problem Smiley Happy

Problem Solved ? Click on 'Kudos' & Accept as Solution ! Smiley Happy

Re: How to fix admin page css got broken?

I was facing this issue on an Adobe Commerce Cloud project.
Following below steps helped me to resolve the issue `Refused to apply style from '<URL>' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.`

 

Steps

1. Ensure to dump `app/etc/config.php` from integration or staging environment where you updated your required admin configurations.

2. Then, using ece-tools package command: `php ./vendor/bin/ece-tools config:dump`.

3. Using `scp` CLI command download the remote `app/etc/config.php` file in your local machine.

4. Then, add this file to git, apply git commit and perform a git push.

5. Finally, deploy the latest change to integration -> staging -> production environment.

Re: How to fix admin page css got broken?

To add to all the answers, ensure you have .htaccess file within the magento's root directory.