블로그를 시작하면서 주제와 성격을 정하다 보면 카테고리 설정은 필수적은 설정일 것입니다.
또 스킨을 설정하다 보면 카테고리의 모양에도 신경이 쓰이고요.
스킨에 기본적으로 설정된 모양은 이상하게 자신의 스킨과 잘 맞지 않게 보이고 또 수정을 하려 티스토리 가이드를
찾아보아도 별다른 설명들이 안나옵니다.
그럼 그다음은 무엇을 할까요? 검색을 하겠죠. 저 같은 경우 검색을 하여도 딱 이거다 라는 결론을 내기기 힘들어 많은
시간을 소비하였네요. 그래서 전부는 아니지만 어느정도 효율적으로 사용할 수 있는 방법을 몇번에 걸쳐 설명하겠습니다.
일단 카테고리의 표현방법을 알아보기 전에 기본적으로 알아두면 이해하기 쉬운 내용을 설명하겠습니다.
위의 그림은 카테고리 설정 그림입니다. 카테고리는 리스트 구조입니다. 그래서 위에 그림 처럼 각각의 영역의 속성을
수정하면 박스 안의 내용이 모두 수정됩니다. 노란색은 녹색과 파란색을 포함 하고 녹색은 파란색을 포함 하고 있듯이
각 요소의 위치 등을 수정할때 그위의 요소의 위치도 같이 생각해야 합니다.
녹색영역의 위치만 수정하고 싶어도 파란색영역의 위치까지 같이 수정되므로 처음부터 잘 생각해야합니다.
각 영역을 CSS 코드로 보면
노랑 : #category ul { }
#category ul li { }
녹색 : #category ul li ul { }
#category ul li ul li { }
파랑 : #category ul li ul li ul { }
#category ul li ul li ul li { }
입니다. 원하는 곳을 수정하고 싶을때 코드를 작성하시면 됩니다.
CSS 부분의 수정으로 아래 그림에 박스 부분의 스타일을 수정할 수 있습니다.
노랑 : 카테고리의 폴더 이미지를 포함하고 있는 셀의 스타일
.ib { } 를 수정하여 스타일을 정함.
녹색 : 카테고리의 텍스트를 포함하고있는 셀의 스타일
.branch3 { } 를 수정하여 스타일을 정함.
파랑 : 카테고리옆 갯수를 나타내는 숫자의 스타일
.c_cnt { } 를 수정하여 스타일을 정함.
치환자를 이용하여 폴더 형식과 리스트 형식의 2가지 표현 방법이 있습니다.
이것은 html 부분을 수정하여 설정할 수 있습니다.
폴더 형식 (치환자 :
|
리스트 형식 (치환자 :
)
여기까지 카테고리 스타일을 설정할 때 어느곳을 수정해야 어느곳이 바뀌는가에 대해 알아 보았습니다.
일단 카테고리 스타일에 변화를 주고 싶다면 위에 표시된 곳을 CSS와 HTML에서 찾아보고 조금식 바꿔가며
변하는 모양을 보고 수정하시면 될 것입니다.
만약 위의 항목이 없다면 추가 하시어 수정하시면 원하는 결과를 얻을수 있을것 입니다.
내용 중 잘못된 부분을 알려주세요. 수정하겠습니다.
티스토리 카테고리의 모든것
티스토리 카테고리의 모든것 - 카테고리의 기본사항
티스토리 카테고리의 모든것 - 카테고리의 응용(폴더형)
티스토리 카테고리의 모든것 - 카테고리의 응용(리스트형)
