[WordPress] Fichier CSS pas chargé

Ce site est optimisé pour être consulté depuis un navigateur moderne dans lequel JavaScript est activé.

[WordPress] Fichier CSS pas chargé

myxomatom

Bonjour,

Je crée cette discussion car j'ai suivi le tuto pour l'installation de WordPress sur moi raspberry pi, je n'ai juste pas forcé le https et j'utilise un sous-domaine.

L'installation s'est très bien déroulée, mais il y a un petit problème quand même:

La partie admin marche très bien, parcontre, la partie accessible à tous ne semble pas charger le fichier CSS... Pourtant, je n'ai rien installé, c'est le thème de base, sans plugin. J'ai activé les 2 autres thèmes préinstallés pour voir, mais ça ne change rien.

J'ai utilisé l'outil de développement de chrome pour voir de quoi ça venait, et le fichier CSS est vide apparemment, mais quand j'utilise le lien qui se trouve dans le header, j'arrive à accéder au fichier CSS...

Je vous mets le lien vers mon "blog" si quelqu'un veut voir avec chrome ou firebug:

Blog.koenig.website

Merci d'avance et bon week-end

xavier

Salut

il nous faudrait les log de ngnix ou apache pour voir un peu pourquoi le css se charge pas.

myxomatom

Alors,

Après avoir fait pleins d'essais, j'ai fini par trouver l'origine du problème: en fait c'est un souci de header.

Les fichier CSS arrivent avec un header "octet/stream" alors que ça devrait être "css/text"

J'ai donc "résolu" le problème de façon un peu bourrin: dans le bloc http du fichier nginx.conf j'ai mis comme type par défaut "css/text"... Maintenant le blog fonctionne correctement et les autres pages aussi.

Par contre, du quelqu'un a une méthode un peu plus "propre", je suis preneur.

J'ai essayé de rajouter un header aux fichiers CSS dans le bloc serveur, mais ça n'a pas fonctionné.

xavier

tu cree un fichier /etc/nginx/mime.types

types {
    text/html                             html htm shtml;
    text/css                              css;
    text/xml                              xml;
    image/gif                             gif;
    image/jpeg                            jpeg jpg;
    application/x-javascript              js;
    application/atom+xml                  atom;
    application/rss+xml                   rss;
}

tu fais un "include /etc/nginx/mime.types;" dans ton vhost

http://stackoverflow.com/questions/10075304/nginx-fails-to-load-css-files

myxomatom

xavier cet article je l'ai vu, tu penses bien que "WordPress no css" c'est le première recherche que j'ai fais.

Mais ça ne marche pas, je l'ai mis dans le partie serveur, mais sans résultat, comme plusieurs autres essais que j'ai trouvé sur Google.

J'ai aussi essayé ça dans la partie serveur:

location ~ \.css {
    add_header  Content-Type    text/css;
}

Le seul truc qui a marché c'est quand j'ai modifié le bloc serveur dans nginx.conf:

events {
    worker_connections 768;
    use epoll; # gestionnaire d'évènements epoll (kernel 2.6+)
}

http {

#default_type  application/octet-stream;
default_type  text/css;


access_log /var/log/nginx/http-access.log combined;
error_log /var/log/nginx/http-error.log info;

Ça marche, mais c'est un peu crados, il doit y avoir mieux.

xavier

voici la config de cher moi (qui et celle par défaut )

user www-data;
worker_processes auto;
pid /var/run/nginx.pid;

events {
    worker_connections 1024;
    use epoll; # gestionnaire d'évènements epoll (kernel 2.6+)
}

http {
    include /etc/nginx/mime.types;
    default_type  application/octet-stream;

access_log /var/log/nginx/access.log combined;
error_log /var/log/nginx/error.log error;

puis dans /etc/nginx/mime.types

types {
    text/html                             html htm shtml;
    text/css                              css;
    text/xml                              xml;
    image/gif                             gif;
    image/jpeg                            jpeg jpg;
    application/javascript                js;
    application/atom+xml                  atom;
    application/rss+xml                   rss;

text/mathml                           mml;
text/plain                            txt;
text/vnd.sun.j2me.app-descriptor      jad;
text/vnd.wap.wml                      wml;
text/x-component                      htc;

image/png                             png;
image/tiff                            tif tiff;
image/vnd.wap.wbmp                    wbmp;
image/x-icon                          ico;
image/x-jng                           jng;
image/x-ms-bmp                        bmp;
image/svg+xml                         svg svgz;
image/webp                            webp;

application/font-woff                 woff;
application/java-archive              jar war ear;
application/json                      json;
application/mac-binhex40              hqx;
application/msword                    doc;
application/pdf                       pdf;
application/postscript                ps eps ai;
application/rtf                       rtf;
application/vnd.apple.mpegurl         m3u8;
application/vnd.ms-excel              xls;
application/vnd.ms-fontobject         eot;
application/vnd.ms-powerpoint         ppt;
application/vnd.wap.wmlc              wmlc;
application/vnd.google-earth.kml+xml  kml;
application/vnd.google-earth.kmz      kmz;
application/x-7z-compressed           7z;
application/x-cocoa                   cco;
application/x-java-archive-diff       jardiff;
application/x-java-jnlp-file          jnlp;
application/x-makeself                run;
application/x-perl                    pl pm;
application/x-pilot                   prc pdb;
application/x-rar-compressed          rar;
application/x-redhat-package-manager  rpm;
application/x-sea                     sea;
application/x-shockwave-flash         swf;
application/x-stuffit                 sit;
application/x-tcl                     tcl tk;
application/x-x509-ca-cert            der pem crt;
application/x-xpinstall               xpi;
application/xhtml+xml                 xhtml;
application/xspf+xml                  xspf;
application/zip                       zip;

application/octet-stream              bin exe dll;
application/octet-stream              deb;
application/octet-stream              dmg;
application/octet-stream              iso img;
application/octet-stream              msi msp msm;

application/vnd.openxmlformats-officedocument.wordprocessingml.document    docx;
application/vnd.openxmlformats-officedocument.spreadsheetml.sheet          xlsx;
application/vnd.openxmlformats-officedocument.presentationml.presentation  pptx;

audio/midi                            mid midi kar;
audio/mpeg                            mp3;
audio/ogg                             ogg;
audio/x-m4a                           m4a;
audio/x-realaudio                     ra;

video/3gpp                            3gpp 3gp;
video/mp2t                            ts;
video/mp4                             mp4;
video/mpeg                            mpeg mpg;
video/quicktime                       mov;
video/webm                            webm;
video/x-flv                           flv;
video/x-m4v                           m4v;
video/x-mng                           mng;
video/x-ms-asf                        asx asf;
video/x-ms-wmv                        wmv;
video/x-msvideo                       avi;
}

met include avant la ligne default_type

myxomatom

xavier Super, merci beaucoup, c'était ça, j'avais oublié le include

include /etc/nginx/mime.types;

Tout de suite c'est beaucoup mieux et ça va sûrement m'éviter d'autres problèmes dans le genre par la suite.

PS: Au fait comment on ajoute une étiquette pour passer la discussion en résolu?

xavier

lol oui si tu oublies include c'est difficile à appliquer les mime.
en plus dans mon 2eme message j'en avais parlé ..
ça arrive d'avoir info sous les yeux et pas la voir 🙂

pour étiquette faut attendre un admin