구글 블로그(Google blogger) 본문 폭보다 큰 이미지 맞춤 설정

구글 블로그(Google blogger) 본문 폭보다 큰 이미지 맞춤 설정

구글블로그는 기본적으로 본문 폭보다 넓은 이미지의 경우 밖으로 튀어나오게 되어있습니다.

지금부터 아무리 큰 사이즈라도 본문 폭 이내에 맞춤설정하는 방법을 알려드리겠습니다.

우선 디자인으로 들어가서 아래와 같은 화면이 나오면 우측에 HTML 편집을 클릭

 

그러면 상단부분에 <b:skin>...</b:skin>가 보입니다

가운데 '...' 부분을 클릭하면 코드가 확 펼쳐지는데 그러면 헷갈릴 수 있으니

조심해서 뒤의 </b:skin>만 조심스럽게 엔터를 쳐서 줄바꿈을 해주시고 

코드가 들어갈 수 있게 공백을 만들어 주세요

이때 ]] 부분이 있다면 포함해서 ]]</b:skin> 같이 줄바꿈해줍니다.(]]는 신경쓰지 마세요)

그 공백 즉 ]]</b:skin> 또는 </b:skin> 위에 아래 코드를 넣어주세요

.post-body img {

max-width: 100%;

max-height: auto;

display: block;

margin: auto; 

}

저장 클릭하시고 HTML 왼쪽에 있는 '맞춤설정'을 클릭하세요

아래 화면에서 고급에서 CSS추가를 클릭하면 우측의 화면이 나옵니다.

그러면 아래 코드를  } 위에 넣어주세요( ]] 는 신경쓰지마세요)

box-shadow: none;

border: none;

padding: 0px;

 

'블로그 적용' 버튼 눌러주시면 끝!

이미지 좌측 정렬도 자동으로 맞춰지게 됩니다.

SNSMEDIA