게시판을 이미지 저장소로 활용하는 법

  아임웹 연구소 소장 해준  |  2017 . 09 . 10

시작에 앞서
코드를 사용해 부가적인 기능을 추가하는 과정에서, 때때로 사이트에 올린 이미지의 주소(URL)가 필요한 경우가 있습니다. 이미지 주소는 브라우저별 개발자 도구를 사용해 알아낼 수 있습니다. 그러나 개발자 도구 사용에 익숙하지 않은 분들께서는 이에 어려움을 느끼실 수 있습니다.

이런 때 게시판을 이미지 저장소로 활용해, 쉽게 이미지 주소를 알아낼 수 있습니다. 이번 꿀팁에서는 그 방법을 소개합니다. 한 번 만들어두면 앞으로 두고두고 활용하실 수 있으니, 다소 길더라도 꼭 한 번 따라 해 보시기를 바랍니다. :)



1단계, 빈 메뉴 생성하기
디자인 모드 [메뉴 관리]를 열고, 더하기(⊕) 아이콘을 클릭해, 빈 메뉴를 하나 생성합니다.




2단계, 메뉴 설정하기
1) 혹시 구분하기 어려운 메뉴명으로 메뉴를 생성했다면 꼭 본인이 구분할 수 있는 이름으로 변경해주세요.
2) 향후 게시판 메뉴 접속을 위해, 나만 알 수 있는 주소로 URL을 입력해주세요.
3) 상단메뉴에 이미지 저장소가 나타나지 않도록 메뉴 숨김을 체크해주세요.




3단계, 게시판 위젯 추가하기
위젯 추가 버튼을 클릭해, 게시판 위젯을 추가해주세요.




4단계, 게시판 설정하기
게시판 이름을 작성하고, 게시판을 관리자만 사용할 수 있도록 권한을 모두 소유자로 바꿔주세요.




5단계, 게시판에 이미지 추가하기
게시판이 있는 메뉴에 접속해, [글쓰기] 버튼을 클릭합니다.

*게시물을 쓰려면, 디자인 모드가 아닌 웹사이트에 접속해야 합니다.
*이미지 저장소 게시판이 있는 메뉴에 접속할 수 없는 경우, 위 2단계로 돌아가 메뉴 URL을 확인해보세요. URL을 브라우저 주소창에 입력해 접속할 수 있습니다.




6단계, 이미지 업로드하기
1) 텍스트 편집기에서 [이미지 첨부] 아이콘을 클릭합니다.
2) 업로드할 이미지는 내 PC에서 선택해주세요.
3) '작성'을 클릭해, 게시물을 등록합니다.




7단계, 게시물 편집으로 돌아가기
게시물이 등록되었다면, 정상적으로 게시판에 이미지가 업로드된 것입니다. [수정]을 클릭해, 다시 게시물 편집 모드를 켭니다.




8단계, 이미지 주소(URL) 복사하기
1) 이미지 위에 마우스 커서를 올리고, 마우스 오른쪽 버튼을 클릭합니다.
2) 보조 메뉴에서 Copy Image Address 또는 이미지 주소 복사를 클릭하는 것으로 이미지 주소가 복사되었습니다.
*보조 메뉴는 게시물 수정 모드에서만 나타납니다.




9단계, 복사한 주소 붙여넣기
이미지 주소를 복사했으니 이제 어디든 붙여 넣을 수 있게 되었습니다. 복사한 주소는 아래 그림처럼, 상단 이동 스크롤 버튼 소스 코드 등에 붙여 넣을 수 있습니다.



해준
배우고 익히고 나누는 | 해준씨 | 유용한 콘텐츠 마케팅 | 네이버 카페 '아임웹 연구소' 소장
jin@haejoon.com

아임웹 공식제휴사

아임웹은 페이팔, KG이니시스, 네이버페이, KCP 공식파트너입니다.