구글 블로그(blogger) 이미지 업로드시 크기 조정하기

블로거에서 이미지를 업로드한 후 이미지를 클릭하면, 해당 이미지를 '작게', '중간', '크게', 'X 라지', '원본 크기' 로 설정할 수 있습니다.

만약, 이 다섯가지 설정 중 마음에 드는 크기가 없다면, HTML 모드에서 코드를 약간 수정해줌으로써 이미지를 원하는 크기로 설정할 수 있습니다.

이미지를 올린 후 글쓰기의 HTML 모드로 들어가면, 이미지는 다음과 같은 코드로 표시됩니다.

여기서 주목할 부분은 이미지의 주소 중 's1600'이라는 부분입니다. 이 s1600은 이미지의 최대 너비(width)를 의미합니다(높이는 너비에 따라 자동 변경). 예를 들어, 너비가 500px인 이미지의 s주소를 's400'으로 입력해주면, 이미지는 400px로 자동 축소됩니다. 이 s주소는

• 큰 이미지를 블로그에서 작게 표시할 때
• 이미지의 크기를 '작게', '중간', '크게', 'X 라지', '원본 크기' 외에 자신이 원하는 크기로 지정하고자 할 때
• 블로그의 이미지를 외부에 원하는 사이즈로 링크하고자 할 때

 특히 유용하게 쓰일 수 있습니다.

! 이미지를 원본 보다 작게 표시하려면 단순히 s를 줄이면 되지만, 이미지를 원본 보다 크게 표현하려면 <img> 태그에 width="***"를 추가적으로 입력해주어야 합니다.


s주소는 또한, 포토샵이나 기타 이미지 편집기 등에서 제공하는 잘라내기(crop) 기능을 지원합니다. s주소로 이미지의 사이즈를 줄인후 옆에 '-c'라고 입력하면, 이미지는 해당 사이즈의 정사각형 이미지로 표현되면서 동시에 정사각형을 벗어난 부분은 버려지게 됩니다. 위의 이미지에 크롭핑 주소를 적용한 예를 직접 보시기 바랍니다.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTtpoSjTURvQomLPnJwYxoN37CHfA-h04Pn62GMAj6w6cdKon4CLFOJZT5bWOpUAgjUhLPGooT0enA_ZFlDn6b5d7SiHg5-_Vk_OFITGCi2ej-8XoN8STo-0oNJgRlR3xvHqXQQt7ojKE/s200-c/car.jpg

또, s주소에 '-d'라는 옵션을 추가하면 다운로드로 연결되는 주소를 만들 수 있습니다. 아래 '-d' 옵션이 추가된 주소를 한번 클릭해보시기 바랍니다.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTtpoSjTURvQomLPnJwYxoN37CHfA-h04Pn62GMAj6w6cdKon4CLFOJZT5bWOpUAgjUhLPGooT0enA_ZFlDn6b5d7SiHg5-_Vk_OFITGCi2ej-8XoN8STo-0oNJgRlR3xvHqXQQt7ojKE/s1600-d/car.jpg

'-d' 옵션은 이미지 배포를 목적으로 하는 블로그에서 유용하게 쓰일 수 있겠죠.


※ 이미지를 개별적으로 설정하지 않고, 템플릿상에서 최대 크기를 제한하려면 다음의 글을 참고하시기 바랍니다.

이미지의 최대 폭 제한하기