끄적끄적

티스토리 본문 너비(폭) 넓히기 + 사이드바 끝으로 붙이기(글 쓸 공간 넓히기)

koh1018 2021. 1. 10. 16:47
반응형

처음 티스토리를 사용하게 됐을 때 불편한 점이 많았다.

타 블로그와 다르게 블로그의 레이아웃을 수정하려면 직접 html 이나 css를 수정해야한다는 것이 그랬다.

 

필자는 본문의 너비가 짧아 글을 작성할 때 형식을 맞춰 작성해도 형식이 무너지는 것이 너무 불편했다.

 

우선, 본문의 너비를 넓히기 위해서는 블로그 관리로 들어가야 한다.

그리고, 꾸미기 -> 스킨 편집 -> html 편집을 따라 들어간 후 수정을 시작하면 된다.

 

그런 후 CSS 탭에 들어간 후, 커서를 코드 아무대나 놓고 ctrl+F 를 누른 후 /* main */ 을 검색한다.

/* */ 는 주석 표시이다.(코드가 아니라 설명하는 줄글 같은 블럭처리 된 곳)

그러므로 /* main */ 부터 밑에 코드는 페이지의 main 부분에 대한 내용이라고 생각하면된다.

 

본문 너비를 넓혀 글 쓸 공간을 넓히기 위해서는 우선 .main의 전체적인 width를 넓혀야 한다.

이를 수정하기 위해서는 위 사진의 파란색 선이 가있는 곳의 max-width 값을 수정해주면 된다.

(수정 전에는 1000px 정도의 값일 것이다. 필자는 넉넉하게 1200px 정도로 수정하였다.)

 

그리고 그 밑에 /* area-main */ 부분부터는 우리가 수정하고 싶은 본문에 대한 부분이다.

여기도 똑같이 max-width 값을 수정해주면 된다.

(필자는 1200px로 했는데 어차피 위에서 한계를 1200px로 해놨기 때문에 1200px 만큼 넓어지지 않는다. 최대 한계점까지만 늘어날 것이다.)

 

이렇게 하면 전체 .main의 한계를 넓혀준 상태에서 본문 부분의 넓이를 최대점까지 넓혀줬기 때문에 사이드바는 기존보다 왼쪽으로 밀려나게 되고 본문도 너비가 넓어지고 더 오른쪽으로 길게 오게 된다.

 


 

결국 블로그의 전체 페이지를 가로로 더 넓게 사용할 수 있다.

실제 차이는 다음 사진과 같이 적용된다.

 

수정 전 메인화면

 

수정 후 메인화면


수정 전 글 본문

 

수정 후 본문

 

반응형

'끄적끄적' 카테고리의 다른 글

티스토리 Odyssey 오디세이 스킨 사이드바 위치 바꾸기  (2) 2021.01.09
기념적인 첫 글  (2) 2021.01.09