워드프레스 PC, 모바일 가독성 높이는 방법 테마 꾸미기 사이드바 나눔선

PC에서 볼때 글자가 이미지 밖으로 나오거나 이미지의 크기가 애드센스 크기랑 맞지 않으면 글을 읽을때 거슬리게 되는데요. 테마를 변경해서 글자와 애드센스를 이미지와 나란히 적용해보겠습니다. (테마가 달라도 본 글의 내용을 보시면 다른 테마에도 비슷 하게 따라서 적용하실 수 있습니다.)

PC가독성 높이기 글자와 이미지 나란히 적용하기

우선 테마를 조절 하면 이미지와 같이 이미지 내에 글자와 애드센스가 나란히 선에 맞춰서 적용된 모습을 볼 수 있습니다.

워드프레스로 로그인되어 있는 상태에서 내 블로그를 들어가보면 위에 검은 메뉴가 나옵니다. 여기서 사용자 정의하기를 통해서 테마 꾸미기를 할 수 있습니다.

그 다음 사이드바 메뉴(Side bar)로 넘어간 다음 사이드바 갭을 (Sidebar Gap)을 조절 해주시면 됩니다.

사이드바 갭을 조절한 후 위에있는 공개 버튼을 누른후 내 블로그로 가서 본문에 잘적용 되었는지 확인하면 됩니다.

꾸미기 창의 내 홈페이지 화면과 실제 내 홈페이지 화면과 다르니 실제로 내 홈페이지로 가서 어떻게 적용되었는지 확인하고 글자가 이미지로 들어가 있지 않다면 사이드바 갭을 (Sidebar Gap)을 조금씩 조절해본 후 간격이 맞을때 까지 조금씩 조절해줍니다.

모바일 화면 가독성 높이기

모바일 화면 가독성 높이는 방법은 간단한데요. 싱글 포스트(Single Post)에 들어가 준뒤 밑에있는 휴대폰 모양 클릭후 콘텐츠 아리아 스타일(Content Area Style)을 와이드(Wide)로 변경해주면 됩니다.

실제로 모바일 화면을 가보면 사진과 글자 간격이 같으며 광고도 넓직하게 잘 나오는 것을 확인할 수 있습니다.

사이드바 나눔선 설정하기

사이드바 나눔선은 본문과 사이드바가 좀더 구분되게 하여 본문에 집중할 수 있게 구분선을 두었습니다. 꼭 필요한 설정은 아닙니다.

이전과 같이 사이드바 옵션으로 가서 디자인(Design)에서 디바이더(Divider) 부분을 설정해시면 됩니다. 구분선의 색상과 선의 굵기를 조절할 수 있습니다.