본문 바로가기

IT

구글 드라이브로 온라인 상품 상세페이지 무료 이미지 호스팅 하기!

반응형

 

 

 

 

 

 

 


 

 

구글 드라이브로 온라인 상세페이지

무료 이미지 호스팅 하기

For 온라인 쇼핑몰

 

 

 

 

안녕하세요! 따남입니다.

삶의 지혜를 나누고파 적는 포스팅입니다!

 

 

최근들어 창업에 대한 욕구와 열정으로

오프라인 보다 비교적 시장 진입이 쉬운,

온라인 쇼핑몰 창업을 하시는 분들이 많으시죠~?

 

오프라인 창업에 비해

 

시간적, 공간적 부담이 적은

온라인 쇼핑몰 창업은,

 

CAFE24나 고도몰 등을 통한 자사몰 개설이나

오픈마켓이나 소셜커머스 등을 통한 온라인 채널 입점 등

 

진입할 수 있는 방법과 매체들이 정말 다양합니다!

 

 

네이버에서 운영하는 네이버 쇼핑만 보더라도,

수 많은 온라인 판매자들을 만나 실 수 있습니다.

 

 

각설하고!

 

오늘의 포스팅에서 말씀드릴 내용은,

바로 온라인 쇼핑몰을 운영 함에 있어

 

소비자 소구를 이끌어 내는

가장 중요한 요소 중 하나인!

 

온라인 상품 상세페이지의

무료 이미지 호스팅에 대한

한 가지 방법을 공유하고자 합니다!

 

바로 우리에게 익숙한(?!)

구글 드라이브를

활용한 방법인데요.

 

제가 이미지 호스팅을 위해

사용하고 있는 방법이기도 하여 공유드리고 하며,

 

꼭 온라인 상품 상세페이지의

이미지 호스팅 뿐만 아니라

 

다양한 목적으로 이미지 호스팅이 필요하신 분들께

유용한 방법이 아닐까 조심히 생각해 봅니다 :)

 

 

그럼 같이 한 번 살펴보실까요~?

반응형

 

 


 

 

 

구글 드라이브로 온라인 상품 상세페이지 무료 이미지 호스팅 하기!

 

 

※ WARNING ※

이미지 호스팅의 방법은 구글 드라이브가 아니더라도

다양한 FTP 서비스 등을 이용할 수 있습니다.

 

개인적으로 구글 드라이브 사용 전에는

ESMplus를 통한 FTP로 이미지 호스팅을 하였으나,

 

아래에서 말씀 드릴 다양한 장점으로 인해

살짝 불편하여도 구글 드라이브로

이미지 호스팅을 하고 있습니다.

 

이 방법이 꼭 저에게 그랬듯 장점만 있다고 말씀드릴 수 없으니

꼭 다른 다양한 이미지 호스팅 방법들도 살펴보시고

본인의 상황에 적합한 방법을 찾으시길 바라겠습니다 :)

 

 

 


 

 

 

 [ STEP - 1 ] 

 구글 드라이브는 무엇인가? 

 

 

구글 드라이브는,

 

구글에서 운영 중인

클라우드 스토리지로써

 

개인이라도 구글 계정만 있다면

15GB의 클라우드 저장용량을 무료로 이용할 수 있는

아주아주 활용성이 높은

클라우드 스토리지 서비스 입니다.

 

 

반응형

구글 드라이브 사용 구분

 

 

구글 드라이브는 크게

개인용과 비즈니스용으로 서비스를 제공하고 있으며,

 

오늘은 개인용 버전 사용을 가정하고

이미지 호스팅에 대한 방법을 설명드릴 예정입니다.

 

 

구글 드라이브의 특징이라고 한다면

 

먼저 구글 드라이브와 연동되는

강력한 뷰어 기능의 구글 문서도구를 통해

다양한 파일을 손쉽게 열어볼 수 있다는 점으로

 

 

 

가장 많이 사용하는 MS OFFICE(엑셀, 워드, PPT)와 더불어 각종 이미지, 영상파일, 포토샵, 일러스트레이터 파일로 확인이 가능합니다.

 

 

엑셀, 워드, PPT를 비롯한

일러스트레이터와 포토샵 등에서 사용하는 파일도

 

구글 문서도구로 구글 드라이브에서

열어 보실 수 있습니다.

(가끔 필요 프로그램이 설치 안된 컴퓨터에서도 파일 확인할 수 있다는게 큰 장점이죠!)

 

 

 

PC, 스마트폰, 태블릿 등 다양한 환경에서 내 파일들을 확인할 수 있습니다.

 

 

구글 드라이브가 가신 두 번째 특징은,

 

대부분 클라우드 스토리지가 그렇듯

 

언제, 어디서든 온라인 네트워크만 있다면

PC / 스마트폰 / 태블릿 등의 다양한 플랫폼으로

내 파일을 확인하고, 편집할 수 있다는 점으로

 

다양한 기기로 파일을 관리할 수 있습니다!

 

 

 

손 쉽게 다른 사람과 공동 작업을 할 수 있다는 점이야 말로 가장 큰 장점이 아닐까 생각되네요!

반응형

 

그리고 가장 중요한 특징인

 

다른 사람들과 파일을 공유하고

공동으로 파일을 편집/수정하는 등

공동작업이 손 쉽게 가장하다는 점이야 말로

 

많은 클라우드 스토리지 서비스 중

제가 구글 드라이브를 쓰는 가장 큰 이유가 아닐까 생각합니다 :)

(잘만 활용한다면 정말 훌륭한 공동 작업 툴이라고 생각됩니다.)

 

 

오늘은 구글 드라이브를 통한 이미지 호스팅에 대한 포스팅이니,

구글 드라이브에 대한 설명은 여기까지 하고,

 

실제 이미지 호스팅하는 방법에 대해서 설명드리도록 하겠습니다!

 

 

 


 

 

 

 [ STEP - 2 ] 

 구글 드라이브를 통한 이미지 호스팅을 위한 준비 사항 

 

 

구글 드라이브로 이미지 호스팅을 하기 위해서는

 

당연하게도 가장 먼저

구글 계정을 생성하셔야 합니다!

 

구글 드라이브 홈페이지 링크

 

개인용 클라우드 스토리지 및 파일 공유 플랫폼 - Google

다른 사용자와 콘텐츠를 공유할 수 있도록 안전한 개인용 클라우드 스토리지 옵션이 제공되는 Google Drive의 파일 공유 플랫폼에 대해 알아보세요.

www.google.com

반응형

 

위 링크로 구글 드라이브 홈페이지 접속하셔서

구글 계정을 새로 생성하셔도 되나,

 

만약 안드로이드 스마트폰을 사용 중이시라면,

 

일반적으로 구글 플레이스토어 이용을 위해

구글 계정을 이미 생성하셨을테니

그 계정을 사용하셔도 무방 합니다!

 

 

 

구글 드라이브 우측 상단의 "구글 드라이브로 이동" 클릭 하시면 나타나는 로그인 창에서 계정을 만드시거나, 로그인 하시면 됩니다.

 

 

구글 계정은 한 사람이 여러 개를 만드실 수 있으니,

클라우드 전용 계정을 따로 만들어서 사용하셔도 됩니다만

 

개인적으로는 하나의 구글 계정으로 활용하시는게 좋다고 생각됩니다 :)

(구글 서비스 간, 강력한 연동 기능을 사용하기 편리하기 때문이죠!)

 

 

구글 계정을 생성하셨다면,

 

하기의 구글 드라이브 HTML 소스 변환기 파일을 다운로드 해 주세요!

(SOMANET님의 블로그에서 발췌 / http://www.somanet.xyz/2017/06/blog-post_21.html)

 

 

구글드라이브 HTML 소스 변환기.html
0.00MB

반응형

 

구글 드라이브 HTML 소스 변환기 / 출처 : somanet.xyz

 

 

구글 드라이브의 파일들은 구글 문서도구로만

파일을 확인할 수 있는데

html 소스에서 링크로는 사용할 수 없기에

 

구글 드라이브에서의 이미지 공유 링크 주소를

html 소스로 사용할 수 있도록 변환 해 주는 것이라 보시면 될 듯합니다!

(이 자리를 빌어 만들어 주신 능력자분께 감사 말씀드립니다!)

 

 

여기까지

구글 드라이브 사용을 위한 구글 계정

포스팅에 첨부한 HTML 변환 파일을 다운받으셨다면

 

이미지 호스팅을 위한 사전 준비는 마쳤다고 생각하시면 됩니다 :)

 

 

 


 

 

 

 [ STEP - 3 ] 

 본격적으로 구글 드라이브로 이미지 호스팅을 해보자! 

 

 

자~! 이제 사전 준비도 끝났으니

본격적으로 이미지 호스팅을 위한 방법을

같이 살펴보도록 하겠습니다!

 

 

복잡 해 보일 수 있기에

단계별로 요약을 먼저 하자면,

 

 

1. 구글 드라이브에 이미지 호스팅할 온라인 상세페이지 업로드

 

2. 구글 드라이브(웹 버전)에 접속하여 호스팅할 온라인 상세페이지 우클릭 후,

"공유 가능한 링크 가져오기"로 공유 링크 복사

 

3. 다운받은 HTML 변환 파일의 "Google Drive path" 부분에 링크 주소 붙여넣기

 

4. HTML 변환 파일의 "Make Google Drive Path Linkable" 클릭하여 html 변환시작

 

5. HTML 변환 파일의 "Image Tag" 부분에 있는 html 소스 복사하기(또는 "Save to clipboard" 클릭)

 

6. html소스를 지원하는 온라인 쇼핑몰의 상품등록란에 html 소스를 붙여 넣으면 끝!

 

 

꽤 복잡해 보일 수 있으나,

차근차근 저와 함께 해보시면 그리 어려우시지 않으실테니

함께 살펴보도록 하겠습니다!

반응형

 

 


 

 

 

 [ STEP - 3-1 ] 

 1. 구글 드라이브에 이미지 호스팅할 온라인 상세페이지(이미지) 업로드 

 

 

이미지 호스팅을 위해서

구글 드라이브에 호스팅할 온라인 상세페이지 이미지를

업로드 해 주시는 것을 먼저 해주셔야 합니다!

 

 

구글 드라이브 홈페이지 접속하셔서 이미지를 업로드 해주시면 되며,

 

 

페이지 좌측 상단의 "새로만들기->파일 업로드"나

 

그냥 이미지 파일을 드래그 해서 웹페이지 가져다 놓는 방법으로도

 

구글 드라이브에 이미지 업로드가 가능하오니

편하신 방법으로 이미지를 업로드 해주시면 됩니다!

 

 

반응형

예시 : 꽃 이미지를 업로드 한 상태

 

 

이미지 업로드를 마무리 하셨다면 1단계 완료!

 

 

 


 

 

 

 [ STEP - 3-2 ] 

 2. 구글 드라이브(웹 버전)에 접속하여 "공유 가능한 링크 가져오기"로 이미지 공유 링크 복사 

 

 

구글 드라이브에 이미지 호스팅할

온라인 상세페이지 이미지를 업로드 하셨다면

 

이미지를 우클릭하여

 

"공유 가능한 링크 가져오기"를 클릭 해주세요!

 

 

 

예시 : 구글 드라이브(웹 버전)에서 이미지 우클릭 후, 공유 가능한 링크 가져오기 클릭!

 

 

웹 버전의 구글 드라이브를 통하셔야만

 

이미지 우클릭 시,

 

공유 가능한 링크 가져오기가 나타나니 유의 해 주세요!

 

 

"공유 가능한 링크 가져오기"를 클릭하시면,

자동으로 클립보드에 링크 주소가 복사되어 있습니다!

(메모장 등에 붙여넣기(컨트롤+V)하시면 링크가 복사된 걸 확인하실 수 있습니다!)

 

 

링크 복사까지 완료 하셨다면 2단계 완료!

 

 

 


 

 

 

 [ STEP - 3-3 ] 

 3. 다운받은 HTML 변환 파일의 "Google Drive path" 부분에 복사한 링크 주소 붙여넣기 

 

 

2단계에서 링크 주소를 복사한 채로

 

다운받으신 "HTML 소스 변환 파일"을 실행 해 주세요 :)

(크롬이나 익스플로러 등 웹으로 실행 해 주시면 됩니다)

 

그리고 "Google Drive path" 부분에

 

복사하셨던 2단계 링크 주소를 붙여넣어 주세요!

 

 

 

예시 : 구글 드라이브에서 복사한 이미지 파일의 공유 링크 주소를 붙여넣은 상태

반응형

 

위에 이미지처럼

 

구글 드라이브에서 복사하셨던

이미지 공유 링크 주소를 넣주시면 3단계 완료!

 

 

 


 

 

 

 [ STEP - 3-4 ] 

 4. HTML 변환 파일의 "Make Google Drive Path Linkable" 클릭하여 html 소스 변환 

 

 

공유 링크 넣으셨던 부분 바로 밑에

 

"Make Google Frive Path Linkable" 부분을 클릭 해 주세요!

 

 

 

예시 : 변환 버튼을 클릭 해 html 소스로 변환된 모습

 

 

버튼을 클릭하시면

 

위에 이미지처럼

 

html로 링크 가능한 이미지 주소(Linkable Image path)와

이미지 태그까지 걸린 html 주소가 

 

짜잔하고 자동으로 변환됩니다!

 

그리고 변환된 이미지의 프리뷰까지

한 번에 확인하실 수 있습니다!

 

 

위의 이미지 처럼 html 변환이 완료되면 4단계 완료!

 

 

 


 

 

 

 [ STEP - 3-5 ] 

 5. HTML 변환 파일의 "Image Tag" 부분의 html 소스를 복사하기 

 

 

우리는 이미지 태그까지 걸린 html 소스를 사용하기 때문에

 

우측 최하단에 있는 두 번째 "Image Tag" 칸에 있는

 

"Save to Clipboard"를 클릭 해 주세요!

 

 

 

예시 : 이미지 태그에 있는 img src가 걸린 html 주소를 복사 해 주세요.

반응형

 

여기까지 이미지 태그된

 

html 주소를 복사하시면

 

사실상 이미지 호스팅을 위한

html 주소를 확보하신 것으로

 

 

이후에는 html을 지원하는 온라인 쇼핑몰에

상품등록으로 가셔서

복사하신 html 주소를 붙여 넣기 하시면

 

구글 드라이브를 통한 이미지 호스팅이 완료가 됩니다!

 

 

제 경우에는 이렇게 확보한

온라인 상품 상세페이지 html 주소를

 

바로 온라인 쇼핑몰에 가서 상품등록을 하는 것이 아니라

 

엑셀에 상품별로 기록하여 사용 중입니다 :)

(상품별 이미지 호스팅 주소를 따놓고 관리하는 것 이지요!)

 

 

 


 

 

 

 [ STEP - 3-6 ] 

 6. html 소스를 지원하는 온라인 쇼핑몰에 상품등록을 해보자 

 

 

마지막으로는

html 소스를 지원하는

 

온라인 쇼핑몰에 상품등록을 같이 해보도록 할까요~?

 

 

대표적인 온라인 쇼핑몰인

네이버 스마트스토어(구 스토어팜)에서 테스트 해보겠습니다!

 

상품등록으로 가셔서 상품 상세설명에

 

위에서 만들어진 이미지 태그가 붙은 html 주소를 붙여 넣었습니다.

 

 

 

예시 : 네이버 스마트스토어 상품등록에 html 주소를 붙여 넣은 모습

 

 

이렇게 HTML 작성으로 바꾸고

 

우리가 위에서 확보한 html 주소를 붙여 넣으시면!

 

 

 

예시 : PC버전 상세내용 미리보기 모습

 

 

PC버전 미리보기를 눌렀을 때도,

 

 

 

예시 : 모바일 상세내용 미리보기 모습

 

 

모바일 버전으로 미리보아도

 

이미지가 잘 적용되는 모습을 보실 수 있습니다!

반응형

 

 


 

 

 

 [ STEP - 4 ] 

 굳이 구글 드라이브를 통해 이미지 호스팅을 했을 때 이점은? 

 

 

제가 구글 드라이브를 온라인 상세페이지

이미지 호스팅으로 추천드리는 가장 큰 이유는

 

위와 같이 상품의 html 코드를 한 번 따놓으면

 

이후 상품 수정 시,

 

수정 이미지를 기존의 동일 파일명으로만 바꾸어 주시면(덮어씌우기)

 

대부분 온라인 쇼핑몰에 등록된 html 코드의 수정없이

이미지만 일괄적으로 수정할 수 있다는 점으로

 

(html로 작성해도 쇼핑몰 자체 서버에 이미지를 저장하는 경우는 불가 합니다/예 : 쿠팡)

 

 

단순히 수정 이미지를 덮어씌우는 것은

ESMplus의 FTP 서비스에서도 가능하나

 

 

구글 드라이브는 여기에 한 가지 강점이 더 있으니...!!

 

 

바로 구글 드라이브 PC버전을 함께 사용하시면

상품 수정이 매우 편해 진다는 점 입니다!

 

 

풀어서 설명드리면,

 

바로 위에서 설명드린바와 같이

 

구글 드라이브에 업로드된 이미지는

파일 이름이 바뀌지 않는 이상

다른 이미지로 바꾸어도 따놓은 html 코드가 변하지 않는데,

 

구글 드라이브 PC버전을 사용해

 PC에 동기화시킨 구글 드라이브 폴더에 수정된 이미지를 바로 작업 해

상품 이미지 수정 등이 가능하다는 점 입니다.

 

 

 

예시 : PC버전 구글 드라이브에서 웹 버전과 동일하게 업로드 파일 확인 가능

 

 

위에 이미지를 보시면

 

앞서 우리가 함께 테스트한 이미지가

PC버전 구글 드라이브 폴더에 똑같이 있는 걸 확인하실 수 있습니다!

 

 

방법을 설명드리자면

 

 

PC에서 포토샵 등 프로그램으로 상세페이지를 수정 후,

 

바로 저 구글 드라이브 PC버전의 폴더에 들어가서

수정된 이미지로 덮어 씌우면

 

알아서 온라인 쇼핑몰에 등록된 상품 상세페이지가

수정된 이미지로 바뀌는 모습을 보실 수 있으실 겁니다~!

 

 

비단 PC뿐만 아니라,

 

 

모바일에서도

구글 드라이브 APP이나 웹 버전 접속으로

 수정이 가능하다는 점!!

 

 

즉,

 

 

구글 드라이브로 이미지 호스팅을 하면

 

언제, 어디서든 PC나 스마트폰이 있으면

 

상품 상세페이지 이미지를

손쉽게 일괄 수정할 수 있다는 말이 됩니다!

 

 

또한, 저는 회사 PC와 노트북에 모두 구글 드라이브를 설치해

 

어디서든 바로 수정이 가능하게 해두었고

 

상세페이지 폴더 공유를 통해 다른 작업자와 공동 작업도 가능하도록 해두었습니다 :)

반응형

 

 


 

 

 

자~! 이렇게

 

구글 드라이브에 대한 간력한 설명과

구글 드라이브를 통한

온라인 상품 상세페이지 이미지 호스팅 방법에 대해 알아보왔습니다 :)

 

제 경우에는 여러모로 구글 드라이브를

다양하게 사용하고 있기

정말정말 편리한 클라우드 스토리지라 생각하며,

 

앞으로도 구글 문서 공동작업 등

구글 드라이브 관련 다양한 기능에 대해

포스팅을 작성할 예정이니 자주 찾와주시면 감사하겠습니다!

 

 

감사합니다.

따남 드림

반응형