Struggling with images in course-in-a-box

Hi there! I’m new here and I’ve been working on building my own course using the amazing course-in-a-box template.

I cannot seem to get my images in the modules to show up and I’m hoping someone can help me figure it out. My image showed up just fine in the index.md file, but when I try to add them to the .md files in the modules, they show up in the github preview, but they don’t render at https://emjay37.github.io/course-in-a-box/.

I have tried using markdown with relative and absolute paths, html with relative and absolute paths, tried creating a static link, and tried adding another images folder within the /posts directory. Most of these methods look like they work in the github preview (I can see the image), but when I go to the actual site, I either see a missing image icon or nothing at all, depending on the method I used.

I am a novice at html and github and an absolute beginner at markdown, so I’m assuming this is something I’m doing wrong, rather than a bug. Can anyone give me some guidance on how to get my images to show up?

Thank you!!!

1 Like

Hi @Emily,

The template is a little tricky when it comes to including images. To get the correct URL for your images, you need to prepend it with: {{site.baseurl}}. {{site.baseurl}} would evaluate to course-in-a-box/ in your case.

For example, I see you’re including an image on this page:

<img src="img/treeFortLogoLarge.png" class="center">

For the right URL, it should be

<img src="{{site.baseurl}}/img/treeFortLogoLarge.png" class="center">

Let me know if you don’t get it sorted.