@savvystrider
Posted
To get your image to appear, add a period to the start of your src attribute:
<img src="./images/qr-code-148732__480.webp" alt="QR Code">Marked as helpful
I had trouble with the image appearing once I deployed it to my GitHub page. Wondering if anyone has any tips to fix this issue. Please see the link below:
https://madamsauce.github.io/qr-code-component-main/
@savvystrider
Posted
To get your image to appear, add a period to the start of your src attribute:
<img src="./images/qr-code-148732__480.webp" alt="QR Code">Marked as helpful
@Falco-Boehnke
Posted
The image location is, I assume, in your project and inside the 'images' folder.
The full path to the image would then be:
https://madamsauce.github.io/qr-code-component-main/images/qr-code-148732__480.webp
If you try that path you find the image, so the issue must be with your src value
You are using the image link like this
src="/images/xyz.jpg"
A slash in front means the path is from root, which means it looks for the image at:
https://madamsauce.github.io/images/xyz.jpg
You can fix this in three ways:
Remove the slash in front of images. This means the file will be searched in the folder images
, that should be located in the current folder, which would be the project folder.
Add a .
in front, that makes it look in the folder you are in right now (project folder) and goes into images
Add the absolute url instead: https://madamsauce.github.io/qr-code-component-main/images/qr-code-148732__480.webp
Personally I have seen Option 1 most of the time for images located in your project
@Ignacio017
Posted
i think you dont put the folder of the image
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord