구글 블로그(Google Blogger)를 만지작 거리고 있는데 이게 참 손이 많이 가네요.
구글 블로그(Google Blogger)에 이미지를 올리다보면 자신이 지정한 본문 폭보다 넓이가 큰 이미지들이 있습니다.
이러한 이미지를 첨부하면서 보여지는 사이즈를 "원본 크기(original size)"를 선택하면 본문 크기에 상관없이 이미지 크기대로 화면에 보여 줍니다.
위 이미지를 참고하시면 쉽게 이해가 가실듯 하네요.
구글 블로그(Google Blogger) 이미지 본문 폭에 맞추기.
제 설명은 크롬브라우저를 이용한 한글 번역된 페이지를 이용하니 참고 하세요.^^
템플릿 -> HTML 편집을 클릭 하세요. (이미지 클릭시 원본으로 크게 보입니다.)
HTML 편집창이 열리면 윗줄에 "<b:skin>...</b:skin>"항목이 있는데 클릭해 주세요.
<b:skin>...</b:skin>항목을 클릭하면 위 이미지처럼 쫘~~악 열리는데 " </b:skin>"부분까지 내려 가세요.
참고로 맨처음 <b:skin>...</b:skin>항목을 클릭하기전에 숫자를 봐두시면 바로 스크롤 이동으로 찾을수 있습니다.
" </b:skin>"항목을 찾으셨다면 " ]]</b:skin>"를 엔터로 줄 바꿈 해 주세요.
위 이미지처럼 줄 바꿈 하셔서 공백을 만드셨다면 되었습니다.
max-width: 100%;
max-height: auto;
display: block;
margin: auto;
}
코드를 " ]]</b:skin>"위에 넣어 주세요.
코드를 넣으셨다면 상단에 "템플릿 저장"을 클릭하세요.
저장을 하셨으면 왼쪽 메뉴에서 다시 "템플릿"을 클릭하셔서 위 화면이 나오면 "맞춤설정"을 클릭하세요.
"맞춤설정" 을 누르면 위 화면이 나오는데 "고급"을 선택 하셔서 나오는 메뉴에서 "CSS 추가"를 선택 하세요.
위 화면이 나오는데 } 위에 아래 코드를 추가해 주세요.
border: none;
padding: 0px;
완성된 코드는 위 이미지와 같은데 이제 오른쪽 상단에 있는 "블로그에 적용"버튼을 클릭해 주시면 마무리 됩니다.
위에서 잠깐 언급했듯이 구글 블로그(Google Blogger)는 참 손이 많이 가는 블로그네요.
블로그를 하면서 수정할 부분들이 정말 많은데 사소한것들은 바로 수정해서 사용하고 좀 복잡하고 큼지만한것들은 이 블로그에 글 작성을 해 두고 있네요.
