I cannot get image to show in Harlowe passage.

Question

Sorry, this is a basic question but I cannot get the image to show and it is holding up my project and I can't find the answer.

I am using the latest Twine download on windows.

I have this in my start passage

<img src="Earthmoon" alt="Earth and moon" style="width:304px;height:228px;">

 

The Earthmoon image is in the same folder as the published story file.  

When I test the story, I get the picture space with the alt text.

When I publish the story and open that, I only get the alt text.

Any ideas?

Answer 1

You need to include the file extension, it's part of the full file name/path. So it'd be Earthmoon.jpg or Earthmoon.png, for example.

Comments

I have done that but it didn't work. It is a jpg. I also tried another picture.  I have opened the published file in Chrome and in Firefox.  No luck.  Thanks for your suggestion though.  It's driving me to frustration with coding.

---

I would also suggest not using mixed case in media file names, as some operating systems are case-sensitive even though Windows is not.

eg. Windows essentially considers "Earthmoon.jpg" and "earthmoon.jpg" as the same file name, where as some operating systems would consider them as two different files.

I generally use all lower case letters, and use a dash between each 'word' within a file name if needed.

eg,
"Earthmoon.jpg" => "earthmoon.jpg
"SomeComplexImageName.png" => "some-complex-image-name.png"

---

Hi Chapel,  I don't understand but it has worked.  (maybe it is because originally I didn't save the image with the filename extension)

The image file is Earthmoon.  

I had changed both the file name and code to Earthmoon.jpg.  However, after your comment, I left the image filename as Earthmoon but changed only the code to:

<img src="Earthmoon.jpg" alt="Earth and moon" style="width:304px;height:228px;">

It worked!

Thanks Chapel and greyelf.

---

Windows has a setting that is on by default that hides file extensions. It shows Earthmoon, but the file name is actually Earthmoon.jpg. When you changed the file name to Earthmoon.jpg, the actual file name became Earthmoon.jpg.jpg. Essentially, by default, modern windows systems try to avoid letting you alter file names. So the file name should be Earthmoon, and the relative url to reach it when it's in the same folder should be Earthmoon.jpg.

---

Thanks again.  I shall be more careful in future.

---

@Chapel
I didn't even think of that issue, as I automatically turn file extensions on as one of the first things I do after installing any version of Windows on a machine. LoL