Je développe un site Web à laide de wampserver sur localhost et jessaie de visualiser mon site sur mobile sur mon réseau local.
Jai changé lURL du domicile et du site dans Settings > General de
À
Jai également utilisé le plugin URL velvet blues pour mettre à jour mes images etc. de localhost vers mon ip.
Toutes mes images sur mon site safficheront sur mobile, à lexception des images de la ligne darrière-plan de la page daccueil. Jai vérifié lURL dans les outils de développement Chrome et le chemin de lURL est le même que les images affichées. Je ne sais pas comment procéder.
Toute aide serait formidable.
Commentaires
- Que ' est bizarre. Donc vous voulez dire que les URL sont valides, mais pas affichées?
- Oui. Jai vérifié le chemin de lURL et cest la même chose. La seule différence I peut voir que les images qui saffichent sont des balises img et que celles qui ne saffichent pas sont des images darrière-plan, cest-à-dire affichées utilisez < img src = " ip / site / wordpress / wp-content / uploads / 2017/06 / image.jpg " > mais non affichés sont background-image: url ( ip / site / wordpress / wp-content / uploads / 2017/06 / image. jpg ). Limage darrière-plan peut-elle poser problème même si lURL est correcte? Merci.
Réponse
Les chemins relatifs agissent différemment lorsquils sont utilisés dans un fichier CSS. Le comportement est toujours le même et le chemin est encore relative, mais pour un humain, cela peut sembler déroutant.
Lorsque vous utilisez un chemin comme celui-ci pour votre image:
<img src="/path/image.jpg"/> Le navigateur regardera à lintérieur du path dossier, situé à la racine du site Web actuel. Mais lorsque vous utilisez la même valeur dans votre CSS:
background-image: url( "/path/image.jpg" ); Lhistoire est différente. Le navigateur examinera le dossier path, en fonction de lemplacement de la feuille de style , et non de lURL actuelle. Donc, si la feuille de style se trouve à:
www.example.com/wp-content/themes/twentyseven/ Le navigateur cherchera alors:
www.example.com/wp-content/themes/twentyseven/path/image.jpg Ce qui nexiste pas. Il est donc important de créer vos chemins CSS par rapport au chemin de la feuille de style.
Pour une meilleure compréhension, jetez un œil ici .
Commentaires
- Juste pour clarifier: si lurl de limage darrière-plan ( ip / site / wordpress / wp-content / uploads / 2017/06 / image.jpg ) et ma feuille de style est à C: \ wamp64 \ www \ site \ wordpress \ wp-content \ themes \ theme \ style.css dois-je créer le chemin du fichier C: \ wamp64 \ www \ site \ wordpress \ wp-content \ themes \ theme \ site \ wordpress \ wp-content \ uploads \ 2017 \ 06 \ image.jpg ?
- Non. Saisissez dabord
ip/site/wordpress/wp-content/uploads/2017/06/image.jpgdans votre navigateur et voyez sil souvre. Si tel est le cas, vous voudrez peut-être envelopper lURL dans''commebackground-image url('URL')ou ajoutezhttp://avantip. - Je p ut ce chemin dans un navigateur et il souvre. Dans les outils de développement, il a http: // avant lIP mais il nest pas entouré de guillemets. Malgré le manque de citations, les images darrière-plan saffichent sur mon site Web localhost mais pas sur mobile. Merci.
Réponse
Le problème n’était pas avec l’url img src ou background-image, c’était avec Apache et le pare-feu. Je ne sais toujours pas pourquoi, mais lorsque jai changé le fichier http.vhosts.config et actualisé le serveur wamp, puis désactivé les paramètres du pare-feu pour Wamp, les images sont visibles. Si je faisais linverse en changeant le pare-feu et ensuite Apache, les images nétaient pas visibles.