How do I upload an image file?

Glitch Help
1

Hello!

I’m creating a website using Glitch, and I was wondering if it was possible to upload an image file which I can then access with HTML. Otherwise, when I want to upload an image everyone can see no matter what browser they’re using, and the same with the Favicon.

As far as I’m concerned I need to upload the image to another website and copy the image URL from there. Correct me if I’m wrong.

Thanks!

2

Hey Crazykk1449,

You can upload an image for your website directly into your project without having to use another site:

  1. Open up your projects assets and drag an image from your desktop into it
    35 PM
    Screen Shot 2017-11-14 at 3.22.35 PM.png778×426 33.2 KB
  2. click the uploaded file to get the url
  3. use that url in your code
3 Likes
3

Thank you pketh! That’s really helpful :smile:

2 Likes
4

didn’t work work for me.

5

When you upload an image to assets, you will get a cdn.glitch.com link that you can use. If you want to directly upload it to your site (like yoursite.glitch.me/image.png) you will need to use code to upload it.

1 Like
6

Did you get an error when uploading?

7

how would you do that

1 Like
8

You can use wget from the command line using the uploaded asset’s URL to import it in to your project locally.

9

GitHub cloning. I did it once by accident. https://glitch.com/edit/#!/skola

10

how do you put it in the code? do u just copy the link and add that link and that’s it? or do u have to code it in. if u have to code it in what is the code?

12

i copy the link and add that link into the logo.png file. But the image won’t show up in that file.

13

Ya, it’s not supposed to.

go to the terminal and run this to see it

wget urlhere
refresh
2 Likes
14

how does it pop up? i do that and it won’t pop up on the screen

15

hit enter when your done with all the bash stuff.

1 Like
16

like it says the file is downloaded and it won’t pop up in the logo.png file

17

Yeah, rename the file so it doesn’t have a code at the end

like this

instead of 

logo.png?sajdsfjdsfsojflkasjks

type this

logo.png

and refresh

18

can u do it for me, your making nonsense

19

Hi @techdude1610 ! it’s cool to ask for help, and we are so glad that you did! But we don’t recommend asking other users to do something for you.

If you need additional help beyond the forum, you can always contact Glitch Support. You also might want to review this article about the best ways to get help when you are stuck.

4 Likes
20

Can you show us a screenshot of the file tree?

21

like the image i wanna add to logo.png or a photo of logo.png with nothing

22

Hi @techdude1610!
I understand you want to include an image in your HTML page. Can I see how you are trying to add this. You should use an <img> tag. You can checkout W3schools to see what this is and how to use. As the source, use the url you were given when you added the image as a asset to the project

23

Here’s a link:

24

it is an png file that i am trying to add… NOT in html. Just so it would upload normally and not like an html cause it is a png file.

26

ok. hopefully it works

27

I did it, but not working. this is what I did in the file.

<img>https://cdn.glitch.com/9a18d3ad-b9cc-45c3-9c19-df7fb7eaa4fe%2Fdefault.png?v=1603917590580</img>

in that file, then I went to the term and did refresh. still not working

28

Hi @techdude1610!
You are almost there!
If you read the W3schools article I sent you can learn more about this, but that should be:

<img src="https://cdn.glitch.com/9a18d3ad-b9cc-45c3-9c19-df7fb7eaa4fe%2Fdefault.png?v=1603917590580">

Hope this helps! :slight_smile:
Eddie

1 Like
29

How do you name the file when importing?

30

that’s wget -O newname.jpg 'https://...'

3 Likes