블로그 사용법: 그림.이미지 상자 만들기와 그림.이미지 주소 찾기
블로그 로고 등과 같이 그림(이미지)을 온라인상의 공간에 올려두고 그림 주소를 링크해야 할 필요가 있을 때가 있다. 온라인상에는 그림을 저장해 둘 수 있는 곳이 여러군데 있지만, 많은 수의 이미지가 아니라면, 블로그 자체에 올려두는 것이 여러모로 편한 것 같다.
블로그 자체에 올려두면, 블로그가 열리는 이상 그림도 이상없이 불려지고, 관리하기도 편리한 장점이 있다. 블로그에 그림상자를 만들고 활용하는 방법은 아래와 같이 간단하다.
1. 새로 글쓰기 창을 열어서 적당한 글제목을 붙인다.
예컨데, 그림통, 그림상자, 이미지박스.....
2. 그림을 올린다.
3. 글의 발행시각을 조절한다.
그냥 저장을 하여 발행을 하면, 현재의 날짜와 시각 즉 가장 최근의 글이 되어, 보기에 안 좋을 수도 있으므로 글의 발행날짜를 블로그 글 가운데 가장 빠른 날짜로 지정해 준다.
4. 글을 저장하고, 그림을 넣은 페이지를 연다.
5. 그림의 주소를 얻는다.
앞에서 올려놓은 그림 가운데, 그림주소를 가져올 그림위에 마우스를 올려놓고, 오른쪽 버튼을 누른다. 그러면, 아래 그림과 같이 그림의 주소를 얻을 수 있는 기능창이 열린다.
구글 크롬의 경우에는 "그림 주소 복사: Copy image URL"을 선택하면 되고
모질라 파이어폭스의 경우에는 "그림 위치 복사: Copy Image Location"을 선택하면 된다.
그러면, 클립보드에 해당 그림의 주소가 복사된다.
6. 그림주소를 붙여 넣는다.
이제 그림주소를 붙여 넣을 곳으로 가서, 마우스의 왼쪽버튼을 한 번 눌러 마우스의 포인트를 놓은 다음에,
마우스의 오른쪽버튼을 눌러 "붙여넣기(Paste)"를 선택하면된다. 또는
키보드의 [컨트롤 + P]키를 눌러도 된다.
참고: 아래의 주소는 구글 블로그 글쓰기 페이지에 그림을 올린 뒤 위와 같은 방법으로 얻은 그림 주소이다.
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKXhyphenhyphenDypAwxOTAEKr-RuYXYXytHyYsaoo31kBPVMGBO14lnwIxnw6P7X7ByiHGVxiS6JfUVMous9Sxs21oDuyp4ym2Eg-AxKSrY25RZHfGPnvGWgKI6IccgpGqF2SzUV2yP7yvXHSrTbrK/s1600/howways-logo-94x94.png
이 그림주소를 글쓰기의 HTML편집 모드에서 붙여 넣으면 아래와 같이 그림이 불려지게 된다.
그림을 붙여 넣는 태그는 <img src="그림주소" height="45" width="45" />이며, 높이(height)와 너비(width)는 적지 않아도 된다.
위의 그림주소를 <img />태그 속에 넣으면 아래와 같이 된다.
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKXhyphenhyphenDypAwxOTAEKr-RuYXYXytHyYsaoo31kBPVMGBO14lnwIxnw6P7X7ByiHGVxiS6JfUVMous9Sxs21oDuyp4ym2Eg-AxKSrY25RZHfGPnvGWgKI6IccgpGqF2SzUV2yP7yvXHSrTbrK/s1600/howways-logo-94x94.png" height="45" width="45" />
블로그 자체에 올려두면, 블로그가 열리는 이상 그림도 이상없이 불려지고, 관리하기도 편리한 장점이 있다. 블로그에 그림상자를 만들고 활용하는 방법은 아래와 같이 간단하다.
1. 새로 글쓰기 창을 열어서 적당한 글제목을 붙인다.
예컨데, 그림통, 그림상자, 이미지박스.....
2. 그림을 올린다.
3. 글의 발행시각을 조절한다.
그냥 저장을 하여 발행을 하면, 현재의 날짜와 시각 즉 가장 최근의 글이 되어, 보기에 안 좋을 수도 있으므로 글의 발행날짜를 블로그 글 가운데 가장 빠른 날짜로 지정해 준다.
4. 글을 저장하고, 그림을 넣은 페이지를 연다.
5. 그림의 주소를 얻는다.
앞에서 올려놓은 그림 가운데, 그림주소를 가져올 그림위에 마우스를 올려놓고, 오른쪽 버튼을 누른다. 그러면, 아래 그림과 같이 그림의 주소를 얻을 수 있는 기능창이 열린다.
모질라 파이어폭스의 경우에는 "그림 위치 복사: Copy Image Location"을 선택하면 된다.
그러면, 클립보드에 해당 그림의 주소가 복사된다.
6. 그림주소를 붙여 넣는다.
이제 그림주소를 붙여 넣을 곳으로 가서, 마우스의 왼쪽버튼을 한 번 눌러 마우스의 포인트를 놓은 다음에,
마우스의 오른쪽버튼을 눌러 "붙여넣기(Paste)"를 선택하면된다. 또는
키보드의 [컨트롤 + P]키를 눌러도 된다.
참고: 아래의 주소는 구글 블로그 글쓰기 페이지에 그림을 올린 뒤 위와 같은 방법으로 얻은 그림 주소이다.
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKXhyphenhyphenDypAwxOTAEKr-RuYXYXytHyYsaoo31kBPVMGBO14lnwIxnw6P7X7ByiHGVxiS6JfUVMous9Sxs21oDuyp4ym2Eg-AxKSrY25RZHfGPnvGWgKI6IccgpGqF2SzUV2yP7yvXHSrTbrK/s1600/howways-logo-94x94.png
이 그림주소를 글쓰기의 HTML편집 모드에서 붙여 넣으면 아래와 같이 그림이 불려지게 된다.
그림을 붙여 넣는 태그는 <img src="그림주소" height="45" width="45" />이며, 높이(height)와 너비(width)는 적지 않아도 된다.
위의 그림주소를 <img />태그 속에 넣으면 아래와 같이 된다.
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKXhyphenhyphenDypAwxOTAEKr-RuYXYXytHyYsaoo31kBPVMGBO14lnwIxnw6P7X7ByiHGVxiS6JfUVMous9Sxs21oDuyp4ym2Eg-AxKSrY25RZHfGPnvGWgKI6IccgpGqF2SzUV2yP7yvXHSrTbrK/s1600/howways-logo-94x94.png" height="45" width="45" />