CSS 초보의 티스토리 카테고리 다른 글 꾸미기 도전

현재 이 블로그에 사용하는 스킨은 블로그카우 프로그램을 운영하는 분께서 만드신 스킨입니다. 배포만 하지 않으면 자유롭게 수정 가능하다고 하여 일부 수정해서 사용하고 있는 중이죠.

이렇게 수정하기 위해서는 CSS라는 것을 좀 알아야 합니다. 그런데, 저는 사실 이 부분에 있어 그냥 남의 것을 보고 살짝 이해하는 정도의 수준이지, 매우 초보입니다.

그럼에도 이렇게 고칠 수 있는 방법은 무엇일까요? 그건 다른 사람 블로그에서 적당히 코드 가져와서 사용해서 입니다.

카테고리 다른 글 모양 바꾸기

'카테고리 다른 글'은 티스토리 관리자 메뉴의 플러그인에서 설정하는 것입니다. 기본 모양은 엄청 못생겼습니다. 그리고 폰트도 지나치게 작습니다. 요즘과 같은 디자인 트렌드로 바뀌기 한참 이전에 만들어진 플러그인이라 그런 것이라 생각합니다.

티스토리에서 조금만 신경을 써 준다면, 이 모양을 조금 업데이트 해 줄만도 하지만, 절대 그렇게 해 줄리가 없지요? 기대도 안 합니다. 

하지만, 능력자들이 만들어 놓은 코드를 잘 베낀다면 아래와 같이 (본문 하단에도 보여지겠지만) 만들 수 있습니다.

어떻게 만들었을까요? 

'카테고리 다른 글' 부분이 예쁘게 잘 꾸며진 블로그의 style.css 파일을 연 이후에 관련된 CSS 코드를 긁어 와서 조금씩 수정을 하면 가능합니다.

다른 블로그 style.css 파일 보는 방법

그럼, 우선 다른 블로그의 style.css를 어떻게 해서 파일을 열수 있는지 궁금하시죠? 

우선 모양이 이쁘게 잘 꾸며진 블로그에 들어갑니다. 마음에 드는 디자인이 있으면 CTRL+U 키를 눌러서 페이지 소스 보기로 들어갑니다. 

해당 페이지를 구성하고 있는 html 파일의 소스가 열리게 됩니다. 여기서 우리가 찾아야 할 것은 바로 style.css 파일의 위치입니다. CTRL+F를 누르고 style.css 를 입력하고 검색합니다.

그럼 보통 하나 또는 2개가 검색이 되는데, 하나씩 클릭해서 열어봅니다. 그리고 열어본 파일에서 찾기로 '.another'를 검색합니다. 이곳이 바로 카테고리 다른 글에 대해서 꾸며주는 것을 넣은 코드가 있는 것입니다.

관련된 것을 다 복사해 와서, 내 블로그의 편집 메뉴로 가서 해당 코드를 붙여 넣습니다. 미리 보기 등을 이용해서 잘 작동하는지 확인하면서 적용을 하면 됩니다.

CSS코드 생각보다 쉬움

CSS를 제대로 후벼파려면 디자인 감각도 있어야 할 수 있겠지만, 대략적으로 이게 뭐다 정도를 이해하는 것에는 크게 어렵지 않습니다. 거의 자연어처럼 보여지는 코드들로 이루어져 있기 때문이죠.

관련된 내용은 구글에서 검색하면 수도 없이 많은 자료가 있습니다. 저처럼 CSS 잘 모르는 사람도 저렇게 꾸미는데까지 성공을 했으니, 그리 어렵지 않습니다.

티스토리를 제대로 다뤄보기 위해서는 HTML 태그와 CSS 태그 등에 대해서는 기본 정도 지식은 갖고 있는 것이 좋습니다. 어렵다고 외면하면 다른 블로그보다 못생긴 블로그, 사용하기 불편한 블로그 운영 밖에 못합니다.

기왕하는 것, 조금 더 멋진 블로그로 운영해 보시는 것을 원한다면 공부를 해야 합니다.

이상으로 CSS 에 대해 조금씩 감을 잡고 있는 어느 한 블로거의 이야기를 마칩니다. 감사합니다.