☰

NGINX+wordpress: CSS は配信されているが適用されていない

tag-icon • tag-icon nginx wordpress css
NGINX+wordpress: CSS は配信されているが適用されていない

スタッカー仲間の皆さん、乾杯！

自己ホスト型の nginx 環境で WordPress を実行する必要があります。

ほぼ正確には、NGINX ワードプレス ドキュメント。

server {
    listen 443 ssl;
    server_name _;
    ssl_certificate /var/lib/nginx/PKI/www/server/cert.pem;
    ssl_certificate_key /var/lib/nginx/PKI/www/server/key.pem;
    root /var/lib/nginx/www/wordpress;
    index index.php;
    location / {
            try_files $uri uri/ /index.php?$args;

    }
    location ~ \.php$ {
        include /etc/nginx/fastcgi_params;
        fastcgi_intercept_errors on;
        fastcgi_pass php;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    }

    location ~* \.(js|css|png|jpg|jpeg|gif|ico)$ {
            expires max;
    }
}

スタイル設定を除いて、ほとんどすべてが期待どおりに動作します。サイトにはスタイル設定が適用されていないようです (管理者ログイン/クイックスタート ウィザードにも適用されます)。

管理ダッシュボード内では、すべて正常に見えます。

CSS ファイルは NGINX によって適切に提供されています。

答え1

私の nginx 設定には mime.types のデフォルトが含まれていませんでした。

これは nginx の「Content-Type」応答ヘッダーに影響しているようで、「text/css」ではなく「text/plain」になります...

... 残念なことに、WordPress テンプレートのいずれもリクエスト内のコンテンツ タイプを指定しません。例:

<link rel='stylesheet' id='wp-block-library-css'  href='https://censored.net/wp-includes/css/dist/block-library/style.css?ver=5.8' media='all' />

おそらくこんな感じになるはずですが、まあ

<link rel="styleseeht" type="text/css" ...>

関連情報