Hello Community,
For some reason my images are showing in the preview, but not live. The path is correct as images are showing in the background correctly on live site. Also I have text on the live site that isn’t supposed to be there as there is other text written locally in it’s place and not showing that text. I’m wondering if these 2 issues are cache related?
Hi @fintechntrusts2020, can you drop a link to the repo that hosts your site so we can take a look at what’s going wrong?
It’s been a week since I posted my inquiry and no one has responded. I’m having some issues figuring out why my pictures are not displaying on the live site, and why text will not update live on Github Pages. If you’re interested I’m willing to compensate you for some assistance in resolving these issues.
Thanks for posting that link! Could you give some more information about what you mean by “images are showing in the preview?” I can see the images are loading correctly on your site but I’m not quite sure where else you’re looking for these images. Are they not working when you load your site locally, or are you looking at these images somewhere else?
Can you share some screenshots/links of where these images aren’t showing up?
Hello Thomas, and thank you for responding, I will explain the following in the following images:
In the screen above(which is the live site), the link appears to be broken, however in the image below there doesn’t appear to be anything wrong with the code.
Hi.
The text part is easy. Check out your layouts. You use the Mission twice. Once as mission/index.html using default layout and again as your demo post using post layout. Neither have a subtitle in them. So add {{ subtitle }} to the post layout like you do on page layout.
And you’ll probably want to turn mission/index.html to use page and not default layout.
The reason your image is broken is because of your relative path.
Your overview page on the public URL here
http://www.replica-eco.net/project/replica-overview
use a frame to load content from
And on that page looking at HTML source, you have
<p><img src="/images/replica_logo_2.jpeg" alt="" /></p>
Which should rather be:
<p><img src="/Replica-Economics/images/replica_logo_2.jpeg" alt="" /></p>
Use relative_url.
Test it:
fintechntrusts2020.github.io/Replica-Economics/images/replica_logo_2.jpeg
Therefore you should edit this page https://github.com/fintechntrusts2020/Replica-Economics/blob/4d5d8064bc465790ca9692c9ea54bcbf1ccf2b14/_projects/replica_overview.md
Change
to
Note your view in your .md file will not preview correctly because of using Jekyll / Liquid, but the site will build correctly.
The initial text will show if you image is broken, to help you know where on the page it is trying to load.
Secondly, to make that work, you must also edit your config https://github.com/fintechntrusts2020/Replica-Economics/blob/4d5d8064bc465790ca9692c9ea54bcbf1ccf2b14/_config.yml
To have:
baseurl: /Replica-Economics
That might already be set by GH Pages, but it is good to be explicit. Especially for local builds for https://localhost:4000/Replica-Economics/ to work.
After you have got the images fixed, I would recommend restructuring your site.
It is very unintuitive to design and debug a public URL which is just a frame that points to your github pages site.
Your site is also likely to suffer in search engine results. Here are SEO issues:
frame content. In fact a frame is very 1990s and you might get penalized for just even using a frame. (An iframe is more modern, but still not a good fit for you).url: https://www.replica-eco.net so your sitemap builds correctly.I suggest you get rid of the frame approach. Combine your two sites into one. Use GH Pages to build and host your content and your public domain on top of the same site (with no frame) to make it friendly.
You can use GitHub Pages’ free functionality of a public custom domain. Go to your repo settings and choose to setup a custom domain. You already own and paid for www.replica-eco.net so you just have to configure GH Pages to use it. For example I think you’ll need to create a CNAME file in your repo. You might need to find a tutorial on this in the GH Pages docs if you need more info.
Oh and if you go this route you might want to go from serving on /Replica-Economics to /
You’ll need to revert to this:
baseurl: ''
And rename the repo itself from Replica-Economics to fintechntrusts2020.github.io
This is a GH Pages thing which turns the domain from fintechntrusts2020.github.io/Replica-Economics to fintechntrusts2020.github.io.
Hello there Michael, thank you for the helping! With your advice I fixed the issue with the text. However, when following your recommended simple fix, I still only get a broken link even after the config application. Is there something that I’m missing? The change:
Is to take place at the replica_overview.md file correct? Or is that change to be made in html?
That is markdown code so it must be in a .md file.
Or you must rewrite as HTML then put it in .html
<img src="{{ '/images/replica_logo_2.jpeg' | relative_url }}"
alt="Replica logo" />