nOo9ya DB Arichve 카테고리
하지만 카테고리 메뉴가 늘어나면서 트리메뉴가 항상 닫혀 있어서
열고 닫고 하기가 귀찮아 지기 시작했다
이 블로그는 자료 수집한걸 내가 보기 편하게 모아두는 곳이라
더더욱 누르기가 귀찮았다 ㅋㅋ
여튼 서론은 집어 치우고 ㅡ/.,ㅡ;;
티스토리를 예로 트리메뉴를 항상 펼침 상태로 만들기 위해서
스킨 수정에서 html / CSS 수정이 있는데
html에서 수정하면 된다.
그렇다고 펼쳐져 있는 트리를 다시 접을 수 없는건 아니기 때문에
큰 걱정 않고 도전해볼만하다 +/_+
첫번째 방법
텍스트큐브 스킨 수정이나 티스토리 스킨 수정을 보면
html 수정을 할 수가 있다.
html 기본 구조는
<html>
html 수정을 할 수가 있다.
html 기본 구조는
<html>
<head>
</head>
<body>
</body>
</html>
윗 처럼 당연히 구성되어있는데 본문이 보이는
<body>를 <body onload="expandTree()">로 수정한다.
onload="expandTree()" <- 이 문구는 블로그에 접속하면 자기혼자
펼쳐지게 하는 것이다 ㅡ/.,ㅡ;;
다른거 다 집어치우고 복사해서 붙여넣기 후에 저장만 제대로하면
티스토리 블로그는 다 된다 -/_-;;
윗 처럼 당연히 구성되어있는데 본문이 보이는
<body>를 <body onload="expandTree()">로 수정한다.
onload="expandTree()" <- 이 문구는 블로그에 접속하면 자기혼자
펼쳐지게 하는 것이다 ㅡ/.,ㅡ;;
다른거 다 집어치우고 복사해서 붙여넣기 후에 저장만 제대로하면
티스토리 블로그는 다 된다 -/_-;;
위의 방법으로 안된다면.....................아래 방법 처럼하면된다 -/_-;;
아래 방법은 자바스크립트로 expandTree시키는 방법이다.
트리구조는 그냥 팍팍 expand시키는 방법을 수단과 방법을 가리지 않고 해보는 것이다 ㅡ/.,ㅡ;;
두번째 방법
<s_sidebar_element>
<!-- 카테고리 모듈 -->
<div id="category">
<h3><img src="./images/s_category.jpg" alt="Category"></h3>
위의 소스는 당연히 스킨을 전담하는 html파일을 수정하면 되는 것이다.
텍큐는 없고 티스토리를 운영하기 때문에 티스토리 skin.html 파일을 예로 들어서 설명하겠다 ㅡ/.,ㅡ;;;
누구야 DB archive는 우측에 사이드바가 몰려있는데 그 사이드바에 Category(카테고리 = 트리메뉴)가 존재한다.
위의 소스가 예이다..ㅡ/.,ㅡ;;
자바스크립트 소스는 헤더건 바디건 아무곳에 넣어도 상관은 없지만 이왕이면 카테고리(트리메뉴)소스에 몰아넣으면
관리하기가 더 편할꺼같아서 넣어봤다..-/ㅁ-;;
여튼 저 위 스크립트만 넣어도 카테고리 하위 메뉴 펼침이 이루어진다-/ㅁ-;;
<!-- 카테고리 모듈 -->
<div id="category">
<h3><img src="./images/s_category.jpg" alt="Category"></h3>
</div>
<script language="JavaScript">try { expandTree(); } catch(e) { }</script>
</s_sidebar_element>위의 소스는 당연히 스킨을 전담하는 html파일을 수정하면 되는 것이다.
텍큐는 없고 티스토리를 운영하기 때문에 티스토리 skin.html 파일을 예로 들어서 설명하겠다 ㅡ/.,ㅡ;;;
누구야 DB archive는 우측에 사이드바가 몰려있는데 그 사이드바에 Category(카테고리 = 트리메뉴)가 존재한다.
위의 소스가 예이다..ㅡ/.,ㅡ;;
자바스크립트 소스는 헤더건 바디건 아무곳에 넣어도 상관은 없지만 이왕이면 카테고리(트리메뉴)소스에 몰아넣으면
관리하기가 더 편할꺼같아서 넣어봤다..-/ㅁ-;;
여튼 저 위 스크립트만 넣어도 카테고리 하위 메뉴 펼침이 이루어진다-/ㅁ-;;
위의 방법말고 노가다를 해도 될듯한데 ㅡ/.,ㅡ;;
내 블로그 트리 메뉴 펼침을 목표로 하기 때문에 위의 방법만 있으면 될듯하다 ㅋㅋㅋ
자 항상 닫혀있는 메뉴 펼치느라 귀찮아 하지 말고 쫙쫙 펴보는 일만 남았다 ㅋㅋㅋㅋㅋ
출처 : 구글 검색 해서 얻었는데.....기억이.........6개월전에 알아둔 힌트인데..ㅡ/.,ㅡ;; 참 난감;;
여튼 유용한 소스 공유는 좋은 것이여~~(이 소스를 전에 많이 알리신분 모두 출처)!!
이올린에 북마크하기
이올린에 추천하기'--- 나름 웹제작 팁 > JAVASCRIPT' 카테고리의 다른 글
| IE6 브라우저 PNG 투명 이미지 처리 방법 (2) | 2010/01/27 |
|---|---|
| 블로그(티스토리, 텍스트큐브 등) 카테고리 트리 메뉴 구조 항상 펼침 상태 만들기 (5) | 2009/11/27 |
댓글을 달아 주세요
안녕하세요, 카테고리 트리 검색하다가 찾아오게 되었습니다.
다름이 아니라 지금 제 블로그도 그렇고 이곳도 카테고리 트리가 끊어져서 나오는데요,
왜 그런걸까요?
오늘 스킨을 수정하고 있었는데 어느 순간 카테고리 트리의 넓이가 넓어지면서 카테고리 트리가 끊어져서 나오더라구요.
저는 카테고리 쪽은 손댄적이 없는데 어쩐일인지 모르겠습니다.
참고로 제 카테고리 html소스는
<!--카테고리 시작-->
<s_sidebar_element>
<!-- 카테고리 -->
<div class="sidename">category</div>
<div class="category">
</div>
</s_sidebar_element>
이고요, sidebar와 sidebarwrap 두개의 div로 둘러싸여있습니다.
아하 카테고리 줄끊기는 현상 말씀하시는 건가요?ㅋㅋ
|
|
이렇게 되는 현상요?
우선 카테고리는 카테고리트리의 모양만 하는 것에서 끝나는데요.
기본설정은 CSS설정 보시면
#category <- 요론게 있습니다.
티스토리 스킨 설정을 보시면 아시겠지만 간격이나 크기는 지정되어있지 않습니다.
그건 body {} CSS에서 폰트 크기와 간격을 지정하기 때문인데요.
줄이 끊겨 보이는건 폰트사이즈와 간격이 커서 background로 지정된 트리선의 간격도 떨어져서 발생되는 것입니다.
해결하시려면. CSS수정창에
#category <- 요길 찾아가셔서
#category {line-height:140%; } <- 간격수정 기본 160%로 되어있는데 140%로로 수정하셔서 추가로 넣어주세요.
#category li ul li <- 뭐 요론거 있는데 보시기만 하시고 걍 냅두세요 ㅋㅋ
폰트 사이즈 조절하시면 될듯합니다^^
저는 간격이 좁아지거나 폰트 사이즈가 적어지는게 싫어서 그냥 끊기는 채로 냅뒀어요 ㅋㅋ
그럼 해결하시길 빌어요~
nOo9ya님 안녕하세요. 너무 감사해서 인사드리려 왔습니다. 에효 컴에 무지한 상태로 블로그 열어 고생이란 고생은 다 해본 초보 블로거 소소한 일상1입니다. 다음에서 티스토리로 이사오고 거기서 또한번 스킨 바꾸고 광고 재설치하고 소소한 정비하느라 에고...^^
카테고리 펼침도 다음에서 여러 소스 알려 주셨는데도 여러 블로거님들의 친절한 방법을 이리 저리 다해보아도 안되어서 거진 일주일을 헤메다 오늘 포기하기 일보 직전에 누구야님의 바디 부분이 가장 쉬워 보여 이것도 안되면 그냥 살자 하는 마음으로 따라해 보았는데 드디어 성공하였습니다. 에고 하도 신경썼더니 지금 힘이 다 빠지네요.^^
다시 한번 감사드려요. 그런데 이런 유용한 글은 다음 뷰로 발행하셔도 좋을 것 같은데요. 분명 저같은 초보들이 있을거라 생각됩니다. 제가 추천 꽉꽉 눌러 드릴께요.^^
그리고 사이드바의 간격 조절을 하는 방법도 물론 있겠지요. 그걸 못해서 앰한 광고만 자꾸 집어 넣고 있습니다. 에효... 제 경우 최신 포스트를 조금 위로 올리고 싶고 맨 마지막 광고 두개 붙은 것도 사이를 띠고 싶은데 방법을 몰라서요. 혹시나 시간 되시면 제 블로그 한번 구경와 주세요.^^
연예 관련 블로그 제목은 - 노천카페에서 상상을 즐기며 - 입니다. 아직 한참 내공이 부족한 초짜 블로거에요.^^
누구야님 고맙고 오늘 좋은 하루 보내세요. 정말 많은 사람들에게 좋은 일 하고 계십니다. 복받으실 겁니다.^^
소소한 일상님 검색이 잘 안되네요 ㅠㅠ
블로그 주소를 남겨주시지 ㅠㅠ 너무하시네요 ㅠㅠ
혹시 모르니 다음에 오시면 블로그 주소 남겨주시길 바래요^^
그럼 즐블로깅요!!~