Hi, I have problem with image loading. I tried everything from previous topics but nothing work.
background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("‥/images/hero.jpg");
also I tried ‥/dist/images/hero.jpg or ‥/resources/assets/images/hero.jpg and ‥/images/hero.jpg
I used WAMPP server, localhost, my config.json
Nothing worked. I put this code in _header.scss.
My JS works fine. And image exist ofc. in dist/images
This is probably an auto-formatting issue, considering there are fancy quotes in your config.json, but you did not use three dots instead of two (
../images/) in the URL path, by any chance, did you? (I assume that you did not put an actual Unicode ellipsis (cf.
Ofc i used two dots. What you mean about fancy quotes?
// ^ ^ fancy, curly, typographic, Unicode
// ^ ^ non-fancy, ASCII
see also: https://en.wikipedia.org/wiki/Quotation_mark#Electronic_documents
Thanks, now i understood. But in Visual Studio Code it looks fine. I’m sure the editor on this page has formatted it this way. I don’t changed it manually in config.json. The dots have been copied here in the same way. Now they looks normal. I fixed it.
But, my image still can’t load
Hmmm… I thought it worked because I edited footer and everything worked fine. But now I’m in consternation. Look:
GET http://localhost:3000/wp-content/themes/sage/dist/styles/main.css net::ERR_ABORTED 404 (Not Found)
GET http://localhost:3000/dist/images/hero.jpg 404 (Not Found)
Now the problem seems more complicated…
- the browser shouldn’t even get to your image if it did not find
main.css. (Although the
ABORTED error might come from hot-reloading/browsersync, not sure about that.)
- anyway, your
wp-content/...) is missing from the image’s path, which either means a misconfiguration of the dev server (like a wrong
config.json) or somehow you get an absolute path in your compiled CSS, thus, again:
- what does your compiled CSS say? Does
dist/styles/main.css exist? How is hero.jpg referenced there?
I had an issue with absolute paths recently, but I tried to run WP in a subdirectory locally/on the dev server (
test.dev/example.com/wp-content), and in root for production (
example.com/wp-content) and found that this setup just causes headaches… But I guess your problem is different.
This topic was automatically closed after 42 days. New replies are no longer allowed.