images not showing in sidebar

[udion]

I have placed my profile picture in images folder and updated config.yml so that avatar has my image name, I am still not able to see my images, however if I put the names of the file which were there by default (i.e profile.png, etc..) it seems to work.

Please help

[TsingQAQ]

Hi udion and others, I’ve encountered the same problem with yours. I could change the default profile images to other photos(png formatt only, jpg test failed) already included in the image file. However, when I uploaded a png photo, it didn't work. What's more, I can't make it work by renaming the uploaded photo to default: profile.png. Have you solved this problem?

[udion]

No, still no luck, I could find pages which are using the same template with their own images but could not find how they are doing it. Please post the solution here if you do find out. (earlier I thought it has to do with the resolution of the images, but I tried the exact resolution as that of default profile.png, it doesn't work!)

[udion]

check out HUGO!

[LeonardoPaccianiMori]

I have a similar problem: some images do work and show in the site (in my case I have added a photo in the "about" pages and it shows correctly) but some others don't, like the profile picture in the sidebar or any other image I add in any other page. Is there any way to solve this without using HUGO?

[kruegert]

Did you change the base url in the config.yml file to your url?

url : https://[yourAccountName].github.io ...the base hostname & protocol for your site e.g. "https://mmistakes.github.io"

Otherwise the image is searched under https://academicpages.github.io

[bernielima]

Some toughts about the "config.yml" :

Correct >>>> avatar: name_of_the_picture.png Wrong >>>> avatar: /folder/name_of_the_picture.png

I tried 2 pictures. One worked out well, the other dont. (dont know why).

[lynchrobo]

I've found that sometimes you need to capitalize the file type, i.e.

my_photo.jpg doesn't work my_photo.JPG does work

I've had some issues with the photo showing up fine on the front page but not on subpages, but this seems to help at least partially.

[jiachangliu]

I think one of the key issues is that once you change the name after "avatar", you need to locally update it using git and upload it online to github using git as well. Once your images are uploaded on github, you should be able to display it locally using "bundle exec jekyll liveserve" as well.

The reason for this is that the generated index.html file under the _site folder has the location of the image points to your online github repository. Without uploading the images to github first, your local index.html will not display the image.

[ASeatonSpatial]

I've got this problem, i've changed the url and put my file in the images folder. I can see it in the repo on github, but when it searches [myrepo].github.io/images/myimage.jpg it doesn't find anything.

I've checked another repo and they have done exactly the same. When I check [hisrepo].github.io/images/hisimage.jpg the file is there. All he did was add it to the images folder same as me, why is my image not appearing?

[ASeatonSpatial]

I should mention my workflow is:

clone the forked repo change things locally commit changes push to remote

Then I wait a bit and have a look at the website to see if I broke anything. I've not tried displaying locally.

[ASeatonSpatial]

Alright, a little bit strange, not sure if useful to anyone: I tried it locally using bundle exec jekyll liveserve and it worked. After that I committed and pushed changes to remote and now it's working through github pages as well.

[yyou1996]

Did you change the base url in the config.yml file to your url? url : https://[yourAccountName].github.io ...the base hostname & protocol for your site e.g. "https://mmistakes.github.io" Otherwise the image is searched under https://academicpages.github.io

This works for me.

[Superhzf]

Did you change the base url in the config.yml file to your url?

url : https://[yourAccountName].github.io ...the base hostname & protocol for your site e.g. "https://mmistakes.github.io"

Otherwise the image is searched under https://academicpages.github.io

To me, this basically works. Plus: The format of the target image has to be original .png

[jkeller52]

Correct >>>> avatar: name_of_the_picture.png Wrong >>>> avatar: /folder/name_of_the_picture.png

For me, this wasn't the case. Changing my _config.yml to avatar: /folder/filename.png solved the issue.

[jroeder-astro]

I know this thread has been dormant for a while, but none of the above solutions brought me any closer to my picture showing up on the page.

[kabbas570]

Did you change the base url in the config.yml file to your url?

url : https://[yourAccountName].github.io ...the base hostname & protocol for your site e.g. "https://mmistakes.github.io"

Otherwise the image is searched under https://academicpages.github.io

Thanks, this one is working fine, change the URL and GitHub repo path.

[hbshrestha]

I also faced this issue. I followed the following steps to resolve them:

• I used file of small size (<200 KB) for avatar, which was stored inside images directory.

In config.yml file,

• For the avatar, I simply used: "filename.JPG". I did not use "/images/filename.JPG". Note that I used JPG in capital.
• For url, I used https://username.github.io without quotes, where username refers to my personal user name
• For baseurl, I left it as just empty quotes "".
• For repository, I used name of the repository in my GitHub inside quotes "username.github.io" where username is my personal user name.

I committed these changes and pushe them into the repository. Then I ran bundle exec jekyll liveserve. Finally I was able to see the image in the website after several attempts.

[JiyangZhang]

I've got this problem, i've changed the url and put my file in the images folder. I can see it in the repo on github, but when it searches [myrepo].github.io/images/myimage.jpg it doesn't find anything.

I've checked another repo and they have done exactly the same. When I check [hisrepo].github.io/images/hisimage.jpg the file is there. All he did was add it to the images folder same as me, why is my image not appearing?

super useful !

[davideboido]

I found that my uploaded images were way too heavy and high-resolution than the original profile.png, that is 720x720 px @72 dpi. Once I resized my picture and commited it, it displayed correctly. Hope it helps

[mx5nabcd]

Delete everything behind the colon related to #Site Author(author) from the _config.yml file and commit. And if it's confirmed that it's all been deleted from your homepage, you can just add the avatar.

[rjzupkoii]

Reading through the discussion there doesn't seem to be a bug in the underlying code, but we should add to the wiki a good write-up on how images are processed in the template.

[AlexandreGastonBellegarde]

SOLVE IT: type manually: /images and select the file in the arborescence

-- Now the link is done and it's work

[rlucas7]

What I was able to do to fix this issue:

https://github.com/rlucas7/rlucas7.github.io/commit/e14176c45673bfe23fb160f06e26dc44ba78b926

basically I use the filepath base directory templating: "{{site.baseurl}}/<path-to-image-from-repo-root>.png" and place this in either ~[image]() or the <img src="filepath" />. To be specific you replace

~[image](filepage) -> ~[image]({{site.baseurl}}/<path-to-image-from-repo-root>.png)

or if you use html tags directly

<img src="{{site.baseurl}}/<path-to-image-from-repo-root>.png"/>

there are a couple examples of both approaches in the commit referenced above in case you want something super concrete.

Hope this helps.