Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML Build a Blog with Jekyll and GitHub Pages Hosting with GitHub Pages Project Pages Websites

jessica grinberg
jessica grinberg
14,117 Points
Posted by jessica grinberg
jessica grinberg
14,117 Points

my images won't display since I deployed the repo to project pages

hi, my images won't display since I deployed the repo to project pages, any clue on how to fix it?

3 Answers

Ran ShemTov
Ran ShemTov
14,148 Points
Ran ShemTov
Ran ShemTov
14,148 Points

In your question, there are abosolutely no clues that will help us understand the question better.

However, i'd assume it has something to do with the path specified to the images. So, as first step, i would suggest checking the "src" attribute seeing these aren't only relative to your local environment (your computer).

jessica grinberg
jessica grinberg
14,117 Points
jessica grinberg
jessica grinberg
14,117 Points

I am sorry, thanks for your help! Yes it is definitely a path issue. Once I deployed the website I modified _config.yml with the following:

baseurl: '/classcodedesign'
url: "http://jessgrinberg.com"

and my image tag looks like this:

    {% if page.image %}
    <img class="feat-img is-hidden-mobile" src="/img/{{ page.image }}">
    {% endif %}

Do you see any mistake?

Thanks!

jpihlk
jpihlk
29,314 Points
jpihlk
jpihlk
29,314 Points

Same thing happened to me. I was able to fix it in the page.image loop by adding "{{site.baseurl}}" to the src attribute:

 src="{{site.baseurl}}/img/{{post.image}}
yotafukuzawa
yotafukuzawa
7,856 Points
yotafukuzawa
yotafukuzawa
7,856 Points

I have the same problem. When I copied all the files into my github it didn't copy the _site file for some reason. Do I need that file to display the image?