Feature image not working with wget

Developer help
1

Hi, I recently started using Ghost. I have it installed on my computer and I’m generating static pages using wget. I found out that if the feature image is uploaded from my computer, it doesn’t show up on the generated static page. However, if it’s selected from Unsplash, this problem doesn’t occur.

When displayed on localhost, all images are displayed correctly - the error only shows up after wget.
If an image is inserted into the text of a post, it will still be displayed after using wget.

On the left is an image from Unsplash and on the right should be the image I uploaded:

image
image2290×292 69 KB

The command I use to generate a static page:

wget -r -nH -P docs -E -T 2 -np -k http://localhost:2368/

Can someone please advise me on how I could solve this problem? I don’t want to rely solely on photos from Unsplash.

2

Wget gets the html of the page. Then the browser you’re using parses that HTML and fetches the images.

I’m guessing that the images on your machine are not available at the time you open the page. You need to put those images somewhere (and possibly rewrite the urls for them) that the static pages can access them.

Unsplash works because that URL is accessible.

3

I don’t think there should be a problem with this. If I add the same image to the text, it will be displayed correctly after generating the static page. In this case, it is only the featured image of the article.

4

Can you paste in an example of the html from a page, showing an image that works (not featured) and one that doesn’t (featured)?

5

Sorry for the late reply. The image displays normally if added from Unsplash:

<section class="gh-cover gh-outer" style="--cover-height: 1070.4375px;">
<img class="gh-cover-image" srcset="https://images.unsplash.com/photo-1552283576-3ea3519bf12e?crop=entropy&amp;cs=tinysrgb&amp;fit=max&amp;fm=jpg&amp;ixid=MnwxMTc3M3wwfDF8c2VhcmNofDV8fHJhc3BiZXJyeSUyMFBpfGVufDB8fHx8MTY4MDYxNDgyNg&amp;ixlib=rb-4.0.3&amp;q=80&amp;w=300 300w,
                        https://images.unsplash.com/photo-1552283576-3ea3519bf12e?crop=entropy&amp;cs=tinysrgb&amp;fit=max&amp;fm=jpg&amp;ixid=MnwxMTc3M3wwfDF8c2VhcmNofDV8fHJhc3BiZXJyeSUyMFBpfGVufDB8fHx8MTY4MDYxNDgyNg&amp;ixlib=rb-4.0.3&amp;q=80&amp;w=720 720w,
                        https://images.unsplash.com/photo-1552283576-3ea3519bf12e?crop=entropy&amp;cs=tinysrgb&amp;fit=max&amp;fm=jpg&amp;ixid=MnwxMTc3M3wwfDF8c2VhcmNofDV8fHJhc3BiZXJyeSUyMFBpfGVufDB8fHx8MTY4MDYxNDgyNg&amp;ixlib=rb-4.0.3&amp;q=80&amp;w=960 960w,
                        https://images.unsplash.com/photo-1552283576-3ea3519bf12e?crop=entropy&amp;cs=tinysrgb&amp;fit=max&amp;fm=jpg&amp;ixid=MnwxMTc3M3wwfDF8c2VhcmNofDV8fHJhc3BiZXJyeSUyMFBpfGVufDB8fHx8MTY4MDYxNDgyNg&amp;ixlib=rb-4.0.3&amp;q=80&amp;w=1200 1200w,
                        https://images.unsplash.com/photo-1552283576-3ea3519bf12e?crop=entropy&amp;cs=tinysrgb&amp;fit=max&amp;fm=jpg&amp;ixid=MnwxMTc3M3wwfDF8c2VhcmNofDV8fHJhc3BiZXJyeSUyMFBpfGVufDB8fHx8MTY4MDYxNDgyNg&amp;ixlib=rb-4.0.3&amp;q=80&amp;w=2000 2000w" sizes="100vw" src="https://images.unsplash.com/photo-1552283576-3ea3519bf12e?crop=entropy&amp;cs=tinysrgb&amp;fit=max&amp;fm=jpg&amp;ixid=MnwxMTc3M3wwfDF8c2VhcmNofDV8fHJhc3BiZXJyeSUyMFBpfGVufDB8fHx8MTY4MDYxNDgyNg&amp;ixlib=rb-4.0.3&amp;q=80&amp;w=1200" alt="">
<div class="gh-cover-content">
<a class="gh-article-tag" href="../tag/clanky/index.html">Články</a>
<h1 class="gh-cover-title">Raspberry Pi 4 Minecraft server s Dockerem a ngrok - Bez potřeby veřejné IP adresy</h1>
</div>
</section>

If I upload a picture from my computer it won’t show up, after wget. Otherwise on a page running on localhost it displays without problems.

Here I am attaching part of the code from the static page:

<figure class="gh-article-image">
<img srcset="../content/images/size/w300/2023/05/645c294e1f5bcda693b9df11_usernames-blog-header.png 300w,
                   ../content/images/size/w720/2023/05/645c294e1f5bcda693b9df11_usernames-blog-header.pngg 720w,
                  ../content/images/size/w960/2023/05/645c294e1f5bcda693b9df11_usernames-blog-header.pngng 960w,
                 ../content/images/size/w1200/2023/05/645c294e1f5bcda693b9df11_usernames-blog-header.pngpng 1200w,
                ../content/images/size/w2000/2023/05/645c294e1f5bcda693b9df11_usernames-blog-header.png.png 2000w" sizes="(max-width: 1200px) 100vw, 1200px" src="../content/images/size/w1200/2023/05/645c294e1f5bcda693b9df11_usernames-blog-header.png" alt="Uživatelská jména na Discordu a propojení s mcservery.eu">
</figure>

image
image1895×578 58.2 KB

The image is uploaded on the server, but unfortunately wget is setting the path wrong for some reason.