# Any issue with uploading pictures to my theme

**URL:** <https://talk.jekyllrb.com/t/any-issue-with-uploading-pictures-to-my-theme/8898>\
**Category:** Help\
**Created:** [February 1, 2024, 5:35pm UTC](https://talk.jekyllrb.com/t/any-issue-with-uploading-pictures-to-my-theme/8898 "2024-02-01T17:35:06Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Osho](https://avatars.discourse-cdn.com/v4/letter/o/a88e57/32.png) [@Osho](https://talk.jekyllrb.com/u/Osho)\
**Post date:** [February 1, 2024, 5:35pm UTC](https://talk.jekyllrb.com/t/any-issue-with-uploading-pictures-to-my-theme/8898/1 "2024-02-01T17:35:06Z")

</div>

i use the chirpy theme, and i have this problem i opened a new folder named ‘images’, and on my markdown editor I see the picture perfectly, but on my site, i see it like this

 ![image](https://canada1.discourse-cdn.com/flex030/uploads/jekyllrb/original/2X/f/f6c5b6155e5472d3eef0e7da93e4601d44e6b4b2.png)  
and its not loading it…  
any suggestions?  
i tried to put an image from online, it did work but when i click on it it does not pop up nicely as it should, it just opens the site that the picture is from…  
thank you very much~

---

<div class="post-metadata">

**Author:** ![rdyar](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/rdyar/32/710_2.png) [@rdyar](https://talk.jekyllrb.com/u/rdyar)\
**Post date:** [February 1, 2024, 8:10pm UTC](https://talk.jekyllrb.com/t/any-issue-with-uploading-pictures-to-my-theme/8898/2 "2024-02-01T20:10:16Z")

</div>

use the browser inspector to see what the path it is trying to use is. Usual issue is the path doesn’t contain the baseurl.

In your code how did you link to the image?

---

<div class="post-metadata">

**Author:** ![Osho](https://avatars.discourse-cdn.com/v4/letter/o/a88e57/32.png) [@Osho](https://talk.jekyllrb.com/u/Osho)\
**Post date:** [February 1, 2024, 8:38pm UTC](https://talk.jekyllrb.com/t/any-issue-with-uploading-pictures-to-my-theme/8898/3 "2024-02-01T20:38:40Z")

</div>

thigs is how i did it on the .md file `![figure](/images/figure1.jpg)`  
and not sure what i can get out of this inspect i will paste it here mabye it would help?

`````html
<p>
<a href="https://media.licdn.com/dms/image/D4E03AQHM2iVNATNcdg/profile-displayphoto-shrink_800_800/0/1705672518081?e=1711584000&amp;v=beta&amp;t=wMToik2qiNP8siabepJiQ15WzMKdIC0iskgG0Lubr48/images/figure1.jpg" class="popup img-link shimmer"><img src="https://media.licdn.com/dms/image/D4E03AQHM2iVNATNcdg/profile-displayphoto-shrink_800_800/0/1705672518081?e=1711584000&amp;v=beta&amp;t=wMToik2qiNP8siabepJiQ15WzMKdIC0iskgG0Lubr48/images/figure1.jpg" alt="figure" width="45%" loading="lazy"></a>
</p>````Preformatted text`
`````

---

<div class="post-metadata">

**Author:** ![rdyar](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/rdyar/32/710_2.png) [@rdyar](https://talk.jekyllrb.com/u/rdyar)\
**Post date:** [February 1, 2024, 8:44pm UTC](https://talk.jekyllrb.com/t/any-issue-with-uploading-pictures-to-my-theme/8898/4 "2024-02-01T20:44:42Z")

</div>

that looks like a link to an image on linked in? does it work?

the inspector \>\> console tab will probably show it as a 404 and show the path that isn’t working.

`![figure](/images/figure1.jpg)`

are you using GH for hosting? if so you likely need to use the baseurl in the path.

---

<div class="post-metadata">

**Author:** ![Osho](https://avatars.discourse-cdn.com/v4/letter/o/a88e57/32.png) [@Osho](https://talk.jekyllrb.com/u/Osho)\
**Post date:** [February 1, 2024, 8:55pm UTC](https://talk.jekyllrb.com/t/any-issue-with-uploading-pictures-to-my-theme/8898/5 "2024-02-01T20:55:00Z")

</div>

no, my profile picture is from linkedin and it works.  
it shows ‘403’ in the console.  
i do host it on GH, what do you mean use the baseurl in path?  
i can upload a picture from URL but then, but when i click on it it does not pop up nicely as it should…  
it just opened the URL, and giving this shinning black thing on it like its loading and it doesn’t stop =\

---

<div class="post-metadata">

**Author:** ![rdyar](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/rdyar/32/710_2.png) [@rdyar](https://talk.jekyllrb.com/u/rdyar)\
**Post date:** [February 1, 2024, 9:48pm UTC](https://talk.jekyllrb.com/t/any-issue-with-uploading-pictures-to-my-theme/8898/6 "2024-02-01T21:48:01Z")

</div>

check this link:

> **[Jekyll’s site.url and baseurl](https://mademistakes.com/mastering-jekyll/site-url-baseurl/)**
>
> Learn what Jekyll's site url and baseurl variables are and how to properly set them with relative\_url and absolute\_url filters to avoid broken links and 404 errors.

if you are using GH for hosting then your repo name needs to be part of the path to assets like images (or css or js).

Check your config file and see if it has a baseurl setup. If not you likely need to add it and then prepend paths like your image above to include the baseurl variable like `{{site.baseurl}}/images/figure1.jpg`

---

<div class="post-metadata">

**Author:** ![Osho](https://avatars.discourse-cdn.com/v4/letter/o/a88e57/32.png) [@Osho](https://talk.jekyllrb.com/u/Osho)\
**Post date:** [February 1, 2024, 10:11pm UTC](https://talk.jekyllrb.com/t/any-issue-with-uploading-pictures-to-my-theme/8898/7 "2024-02-01T22:11:53Z")

</div>

you mean it need to be in the ‘assets’ repository?  
i did check my confic file and i had problem that i had a CDN link in there my mistake, i took it off and now its empty.  
but picture still doesn’t work… this is my page if you wanan take a look, look that every picture have this shiny black on it, and when you click on it it doesn’t zoom in nicely it just opened the link address =

> **[Dor G](https://oshopython.github.io/)**
>
> Bloging, tech

what did i do wrong?

---

<div class="post-metadata">

**Author:** ![rdyar](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/rdyar/32/710_2.png) [@rdyar](https://talk.jekyllrb.com/u/rdyar)\
**Post date:** [February 1, 2024, 11:29pm UTC](https://talk.jekyllrb.com/t/any-issue-with-uploading-pictures-to-my-theme/8898/8 "2024-02-01T23:29:09Z")

</div>

so it looks like you are using GH but you have a user repo which is treated different than a project repo. You get one user repo (repo name is your username) but you can have unlimited project repos. Project repos need a baseurl value but user repos do not.

So ignore my baseurl info as it does not apply to this particular site.

I can see your images has some weird wave moving over them, not sure why that is but it is some javascript somewhere. When I click the image it opens up by itself with a black background, looks fine to me.

Is your original issue still a problem?

---

<div class="post-metadata">

**Author:** ![Osho](https://avatars.discourse-cdn.com/v4/letter/o/a88e57/32.png) [@Osho](https://talk.jekyllrb.com/u/Osho)\
**Post date:** [February 2, 2024, 5:24am UTC](https://talk.jekyllrb.com/t/any-issue-with-uploading-pictures-to-my-theme/8898/9 "2024-02-02T05:24:38Z")

</div>

if you look at other chrippy theme websites you will see that the pictures should pop up on the post itself, and not direct you to the URL of the picture… =  
it still a problem yes, i couldn’t find it on the javascript as well and maybe modify it  
if you have any suggestions i would be happy to hear [=  
thank you~