Code showing correctly in preview, but not actual page? #23726
-
https://github.com/fintechntrusts2020/Replica-Economics , I have another post where I’m still having issues with inserting images, however, now my bullet points are not correct as they were. Help? |
Beta Was this translation helpful? Give feedback.
Replies: 6 comments
-
Can you post a direct link to the page you’re having trouble with and maybe share a screenshot of what the issue is/what it’s meant to look like? |
Beta Was this translation helpful? Give feedback.
-
Preview page link; https://github.com/fintechntrusts2020/Replica-Economics/blob/532f492f3fecd0bba1f3b92388968a7a28fb60df/_pages/origin.md However, below is the link to the live page and it shows a broken image
Why Replica Exists? – Replica EconomicsThe history behind Replica |
Beta Was this translation helpful? Give feedback.
-
This is the current command for the image <“img src=”/images/demo/meeting.jpg"> |
Beta Was this translation helpful? Give feedback.
-
Thanks for posting those links! The reason this is happening is because of a relative path issue with how the browser loads this image file on GitHub.com compared to on your Pages site. Looking at the code for this image:
The source for this image starts with a However, on your Pages site, there’s an extra element that’s required in your URL—the repository name The actual URL that your image is loaded from is this:
However, currently the browser is looking for it at this URL:
This is happening because the initial To fix this you’ll simply need to remove the
If you’re having other issues with images like this it’s likely that there’s other relative pathing issues causing similar problems! |
Beta Was this translation helpful? Give feedback.
-
Hey there thomas, yes your advice worked. However, the link is now broken on the preview, is that purely because of a relative pathing issue? If so, where my be a logical area to begin troubleshooting? Index, config, etc? |
Beta Was this translation helpful? Give feedback.
-
Oop, I missed this part during my testing, sorry! 🙈 Looks like there is a way to fix it for both at the same time. You’ll first need to convert this
Then you’ll need to make sure you set your
Once you do both of these your image should show up correctly on both GitHub and on your website! |
Beta Was this translation helpful? Give feedback.
Oop, I missed this part during my testing, sorry! 🙈
Looks like there is a way to fix it for both at the same time. You’ll first need to convert this
img
tag to a markdown image tag, and add back in the initial/
:Then you’ll need to make sure you set your
baseurl
to the name of your repository inside your_config.yml
file:Once you do both of these your image should show up correctly on both GitHub and on your website!