기존 블로그테마를 보면 본문영역이 좁아서 좀 답답하게 느껴집니다.
사이드바 영역을 제외한 글이 들어가는 부분의 폭을 좌우로 늘려주고자 html 수정을 하였습니다.
이 스킨의 경우 흰색 바탕 부분인 '배경영역'과 본문이 들어가는 '영역+사이드바' 두군데의 영역을 수정해야합니다.
 |
| ▲기존 레이아웃: 글 영역이 좁아서 답답해 보인다 |
아래 보이는 코드부분이 배경영역을 키우는 곳 입니다.
기존보다 200px 정도 크게 수정하였습니다. 블로그 화면을 새로고침하면서 적당한 크기로 맞춰 주면 됩니다.
아래는 본문글 영역과 사이드바 내용이 들어가는 공간의 폭을 지정하는 값입니다.
배경보다 조금 작게 조절해 주면됩니다. 마찬가지로 수치를 넣으면서 블로그 화면을 새로고침하면서 적당한 값을 넣어줍니다.
아래는 글영역과 사이드바 크기를 비율로 조절하는 값입니다. 좌우로 벌어졌기 때문에 사이드바의 값을 낮추어야 기존의 사이드바 폭과 비슷해집니다. 28%정도로 수정해 주었습니다.
아래는 블로그 좌측 상단에 있는 블로그 제목 영역의 폭을 지정하는 값입니다. 좌우로 넓어진 만큼 기존보다 100px 더해서 300px로 넓혀주었습니다. 블로그 제목이 짧다면 의미가 없지만 블로그 제목이 긴 경우 두줄로 나오는 데 길게 해주면 한줄로 나오기 때문에 보기 좋습니다.
구글블로그 HTML편집으로 본문 폰트 키우기
수정하는김에 본문폰트도 1px 키워주었습니다. 기존 값 16을 17로 수정하니 가독성이 좋아졌습니다.
행간이 좁아서 답답하여 행간도 기존 1.5em을 1.8em으로 수정하여 넓혀 주었습니다.
수정된 블로그를 보면 글 영역이 좌우로 넓어져서 시원한 느낌이 듭니다. 좌우로 넓어져서 애드센스 광고도 더 넓고 크게 들어가서 눈에 잘 띄고 그리드도 딱 맞는 느낌이라 정리가 잘 되어 보입니다.
 | |
|
다른 구글블로그 테마들도 비슷한 구조를 가졌다면 수정하는데 크게 어렵지 않을것 같습니다. 티스토리는 CSS를 따로 열어서 수정해야 했는데 구글블로그는 하나의 파일로 수정하니 수정은 좀 더 빠르게 진행 할 수 있는 장점이 있습니다.
0 댓글