Adding an image in Codepen w/a relative link

HTML-CSS
1

Hello!

I’m finishing my Survey Page project in Codepen. I don’t have an absolute url for the image I would like to use for my background. How do I use the image file with only a relative link?

2

Hi @Nreynolds1202,

If you use the free version of CodePen, you need to have the image accessible somewhere. You can use GitHub for example (tuto: https://dev.to/ljcdev/a-quick-hack-to-using-local-images-on-codepen-4cfp) or Google Photos (I saw someone here use this service).

There is other ways and maybe someone knows a better solution.

2 Likes
3

CodePen pens do not include asset hosting. I believe that the “projects” feature does include asset hosting, but that is not included in the free plan. You will need to host your image online; a website can’t see it if it’s only on your personal computer. If you google “free image hosting” you’ll find a bunch of services that do this.

1 Like
4

Ah! Thank you! I’ll check this out.

5

Ok, thanks for explaining that. Thanks and I’ll do that.

6

HERE IS A SMALL LIST OF FREE SITES:

If you just want to host a few images, IMGUR.com is fine, but there are some contradictions of usage when using IMGUR for CODEPEN, and the Images can be removed for a breach of the Terms of service. when being used to host An Image Library for Codepen or Websites.

I think you can still use Flickr.com for Hosting, but the linking from there is a little more complex.

1 Like
7

You can use GitHub as well.

8

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.