파일질라 이미지 올리기

파일질라를 이용해 홈페이지에 이미지를 등록하는 방법

1. 파일질라에 접속
2. 아래의 사진을 보시면 www폴더 안에 img(img 파일명이 아니어도 됨) 라는 폴더 생성
   • 타 사이트에서 웹호스팅 하시는 분은 html 폴더나 상위 기존에 만들어진 폴더 안에 생성

www폴더안에 이미지를 넣어도 상관은 없지만 나중에 관리하게 쉽게끔 이미지 전용 폴더를 만들어 주세요. 사진이 수백장 넘어가면 각 이미지를 분류해서 여러개 폴더를 만들어 주시는게 나중에 수정할때 찾기가 수월해요!!

 

※ 꼭 www 폴더 안에 img(사용하실 폴더명) 폴더를 만들어 주셔야되요~!!

 

 

저는 www/img/person이라는 경로에 사진을 저장해뒀습니다.

 

 

1. 오른쪽 폴더에서 자신이 올리고 싶은 이미지를 우클릭
2. 위 사진처럼 클립보드로 URL 복사 버튼 클릭
3. HTML 이미지 태그에 복사된 URL 삽입
4. 파일질라에 HTML 파일 업로드 후 이미지 반영

클립보드로 URL 복사를 누르시면 latkddmsdle@ddanglittle.info/www/img/person/aelliseuapenjelleo.jpg

(웹호스팅 아이디@도메인 주소/폴더경로/사진명.파일 형식) 위에도 말했듯이 저는 카페24 사이트 에서 발급받은 웹호스팅 ID라서 /www/ 이런형식이 되는거구요 여러분은 각자 웹 호스팅 받은 사이트에서 정해주는 상위폴더 /html/ 이런 형식의 폴더명으로도 될수가 있어요. 이 말을 강조해드리는 이유가 다른사이트에서 웹호스팅 ID를 받으시면 상위 폴더가 /기존 상위 폴더명/으로 폴더명이 바뀔텐데 이거를 굳이 /www/ 이걸로 바꿔주실 필요없어요.(제가 이걸로 고생해봐서 알거든요..ㅎㅎ;)이런식으로 폴더안에 주소 경로 형식으로 복사가 됩니다. 이제 이 경로를 현재 작업하시는 소스에다가 같다 붙여넣어주실건데요 저는 Visual Studio Code 라는 프로그램으로 홈페이지를 만들고 있어서 여기 태그안에 저 소스를 넣었습니다.

 

 

적용 후 모습

 

 

위 사진과 같이 http://www.ddanglittle.info/1-1.html 라는 도메인에 이미지가 다 잘들어가있는걸 볼수가 있습니다.

※ 여기서 주의 해야할 점
폴더명과 이미지 이름은 한글로 되면 등록이 안되요 제 홈페이지에는 이미지가 총 300개 이상이 들어갔는데 영어로 바꿔줘야 된다는 것도 모르고 다 한글로 작업을 마쳤습니다. 그런데 유튜브에서 계속 사용법을 보고 따라하는데도 적용이 안되길래 영문으로 바꿔보니 적용이 되서 300개 이상을 다 수작업으로 영문이름으로 바꿔줬어요...
여러분은 헛고생하지 마시구 꼭 처음부터 이미지 폴더랑 이미지명을 넣고 싶으시면 다 영어로 바꿔주시고 작업하시는걸 추천드릴게요