:namucat

분류:
:namucat
사용문서
새로고침
넘겨주기
이동하기

틀 업데이트 노트
[ 펼치기 · 접기 ]
  • 2022.09.23
    • 틀이 처음 생성되었습니다.
  • 2022.09.25
    • 분류 글자를 가릴 수 있는 블러 기능이 추가되었습니다.
  • 2023.03.30
    • 마우스를 올려도 분류 문서 제목이 뜨지 않도록 변경되었습니다.
  • 2023.04.23
  • 2023.05.14
    • 분류 제한 개수가 20개에서 40개로 확장되었습니다.
  • 2023.05.18
    • 모바일(0.6rem)과 PC(1rem)의 본문 padding에 대응하여 하단 여백을 따로 지정하였습니다.
  • 2023.06.21
    • 모바일에서 링크를 누를 때 0.5초 동안 파란 박스가 생성됩니다.
  • 2023.07.07
    • 리스트가 나무위키 형식으로 변화하였습니다.
  • 2023.07.09
    • 목차가 나무위키 형식으로 변화하였습니다.
  • 2023.07.10
    • 문단이 나무위키 형식으로 변화하였습니다.
  • 2023.07.15
    • 다크 모드에 대응하는 변수가 추가되었습니다. (불완전)
  • 2023.07.19
    • border 변수 이미지의 테두리 색이 변경되었습니다.
  • 2023.11.16
    • 수평줄(<hr>)의 색상이 #e1e8ed에서 #ccc로 변경되었습니다.
  • 2023.11.24
    • 테이블 셀 테두리의 색, 하이퍼링크들의 글씨 색이 나무위키와 동일하게 변경되었습니다.
  • 2024.01.26
    • '분류' 글자를 누르면 문서 새로고침, 넘겨주기 목록, 이동하기 버튼들이 나타나는 기능들이 추가되었습니다.
  • 2024.01.27
    • 문서 제목 이름 공간에 #d4f0e3 색깔의 굵은 밑줄이 추가되었습니다. 다크모드에서는 #545c5b입니다. (나무위키 신규 스킨 espejo 기능)
  • 2024.01.28
    • 문서 제목의 볼드체가 해제되었습니다. (나무위키 신규 스킨 espejo 기능)
    • 각 분류 간 구분선 디자인이 변경되었습니다. (나무위키 신규 스킨 espejo 기능)
  • 2024.03.17
    • 2024년 1월 26일의 업데이트 내용이 롤백되었습니다.
      [ 내용 ]
      '분류' 글자를 누르면 문서 새로고침, 넘겨주기 목록, 이동하기 버튼들이 나타나는 기능들이 추가되었습니다.
  • 2024.03.28
    • 문서 제목 및 DISPLAYTITLE 기능이 일부 변경되었습니다. (사용법에는 차이가 없습니다.)
  • 2024.05.14
    • 글씨 크기가 15px로, 글씨 색이 #212529로, 줄바꿈 기준이 break-all로 변경되었습니다. 모두 나무위키 기본 값과 동일합니다.
      (글꼴도 바꾸긴 했는데 적용이 됐는지는 불명입니다.)
      • 여기에서, 웬만하면 테이블 각 셀의 내부 여백(padding)도 나무위키와 같이 상하 5px 좌우 10px로 변경하고 싶었습니다. 기술적으로 가능은 하지만 그럴 경우 틀:펼치기 접기와 여백 값이 꼬이는 바람에 시도조차 하지 못합니다!
    • {{#css}} 특수명령문을 이용해 일부 코드가 수정되었습니다. 이에 따라 type 변수만으로 더욱 안정적인 다크 모드 구현이 가능해졌습니다.
  • 날짜 미상
    • 분류 문서에서 분류에 속한 문서들을 ABC가나다 순으로 나열할 때 문단 번호가 보이지 않도록 변경되었습니다.
  • 2024.05.16
    • 문서 제목에 마우스를 올리면 마치 링크처럼 커서가 포인터로 바뀌고 밑줄이 쳐집니다. (물론 진짜 링크는 아니라서 눌러도 반응은 없습니다...!)
  • 2024.05.16
    • 각주 말풍선의 디자인이 나무위키와 유사하게 변경되었습니다. (opcaity가 서서히 바뀌는(=서서히 나타나고 사라지는) 효과도 건드려 보려 했지만 개같이 실패했습니다!)
    • 각주가 볼드체나 이탤릭체 내부에 있을 때 버튼이 이를 따라가도록 변경되었습니다. (기존 각주 버튼은 반드시 볼드체와 이탤릭체가 아닌 글꼴로만 나타났었습니다.)
  • 2024.05.17
    • 문서의 제목 부분과 본문 부분의 경계가 사라졌습니다. (구분하는 테두리를 없애고 배경색을 같게 만들었습니다.)
    • 사이트 최상단 내비게이션 바의 색상이 나무위키와 동일하게 변경되었습니다.
  • 2024.05.29
    • 문서의 제목 아래에 나무위키처럼 문서의 최근 수정 날짜를 '년-월-일' 형식으로 보여줍니다. '시:분'까지는 기술적으로 구현이 불가능합니다.[!][!] '년월일시분'이 일련의 숫자로 모두 뜨게 하는 타임스탬프 방식은 가능하지만 그 일련의 숫자들 사이에 날짜와 시간을 구분하는 기호를 넣을 수가 없습니다.
  • 2024.05.30
    • 테이블의 캡션(|+캡션) 텍스트가 본문과 같이 크기 15px에 볼드체 미적용으로 변경되었습니다.
  • 2024.06.02
    • 모바일에서 링크나 접기(애니메이션이 추가된 버전 한정) 제목을 꾹 누를 때 0.5초 간 생성되는 파란 박스의 색 표현법을 기존 rgba() 형식에서 hsla() 형식으로 변경하였습니다. 즉 기존 방식의 문제점이었던 명도가 낮거나 파란색에 가까운 배경 내에서 파란 박스가 잘 보이지 않던 현상이 해결되었습니다.
  • 2024.06.03
    • 위 업데이트를 롤백했습니다. 생각보다 모바일에서 작동을 잘 안 하더군요...
  • 2024.06.04
    • 글씨 색을 #212529로 바꾸는 업데이트를 롤백했습니다. 즉 글씨 색은 다시 기존 제이위키 기본 색인 #373a3c와 동일하게 표시됩니다. 다크모드에서의 색상을 따로 코딩할 수 없어서 다크모드 유저에게는 #212529라는 글씨 색이 검은 배경에서 거의 보이지 않았음이 이유입니다. (그래도 역시 링크 색은 포기 못 하겠습니다!!)
  • 2024.06.05
    • 이제 테이블이나 div 안이 아닌 본문에 바로 사용된 리스트는 맨 뒤에 {{brbr}}을 덧붙이지 않아도 하단 여백이 자동으로 생겨납니다. 이제 더 이상 귀찮게 리스트 맨 뒤에 일일이 {{brbr}}을 써넣지 않아도 됩니다! 이쪽 틀의 업데이트 사항은 아니지만 같은 시기에 틀:나무위키 접기2에도 똑같은 업데이트가 이루어졌습니다.
  • 2024.06.06
    • 모바일(가로 520px 이하의 환경)에서 너비를 따로 지정하지 않은 표의 기본 너비 100%가 해제되었습니다. 이제 모바일에서도 PC처럼 콘텐츠 너비에 따라 표의 너비가 정해집니다. (즉 {{MT}}를 더이상 쓰지 않아도 됩니다!) 또한 모바일에서는 표의 float 속성이 먹히지 않으니 주의하세요.
  • 2024.06.09
    • 운영자님과 협력한 틀의 완벽한 다크모드 호환이 시작되었습니다. 이에 따라 틀에 사용된 색상 일부가 var(--변수) 구문으로 변경되었습니다. 그래서 쓰는 입장에서 뭐가 바뀐 거냐면, 이제 틀에서 다크모드 변수를 쓰지 않고 제이위키를 다크모드로만 변경해도 여러 가지 색상들이 그에 맞춰 함께 변화합니다. 앞으로 차차 본 틀 외에도 자주 함께 쓰이는 인용문 등의 틀과 요소도 이처럼 바뀌어 갈 예정입니다.
  • 2024.06.10
    • 1차 다크모드 완벽 호환이 끝났습니다. 이로써 라이트모드 중심으로 만들어졌던 {{namucat}}이 사용된 문서를 다크모드 유저들도 다크모드에 알맞은 색상으로 눈이 편하게 열람할 수 있습니다. 일단 운영자님과 협력하여 당장 눈에 보이는 큼직한 부분들은 모두 호환을 마쳤는데, 혹시 아직 호환이 부족한 부분이 있다면 저에게 꼭 말씀해 주세요.
  • 2024.09.01
    • 이제 문서 제목에 마우스를 올려도 밑줄이 쳐지거나 커서 모양이 바뀌지 않습니다. 기존 제이위키처럼 롤백된 겁니다...!
  • 2024.11.03
    • 마우스 드래그의 배경 색이 #00a495가 됩니다. 사실 이건 나무위키와 전혀 다른 업데이트지만 원인 불명으로 마우스 드래그의 배경 색이 너무 연해지는 바람에 해결하지 못해 아예 나무위키의 색으로 통일한 것입니다.
  • 2024.11.04
    • 분류 제한 개수가 40개에서 100개로 확장되었습니다.
  • 2025.01.08
    • nopad 클래스가 추가되었습니다.

 이 틀은 {{나무분류}}로도 사용할 수 있습니다.

 리브레 위키 디자인의 분류 틀에 대한 내용은 틀:librecat 문서를 참고하십시오.
 하위 문서: 업데이트 노트, blur, legacy, css

틀 본문

설명

김찬의 기술력의 집대성이자 최대 걸작.
음, 조금 오글거리나요? 그래도 그만큼 자부한다는 뜻입니다!

나무위키 형태의 분류를 삽입하는 틀입니다. 문서 맨 위에 사용하면 분류 목록이 문서 최상단에 나타납니다. 문서 맨 위가 아닌 곳에 사용하면 그 위치에 분류가 생성되니 반드시 맨 위에 사용해야 합니다. 분류 위치 외에도 이 틀은 하단에만 1rem(모바일에서는 0.6rem)의 여백을 가지므로 이 틀 위에 다른 내용이 있을 경우 그 내용과 이 틀이 딱 붙어 버리는 현상이 있을 수 있습니다. 이를 방지하기 위해서라도 반드시 문서의 맨 위에 사용해 주십시오.

사용법

{{namucat|분류1|분류2|분류3|…|분류100}}

분류는 총 100개까지 입력할 수 있으며, 입력할 땐 분류:라는 이름공간 없이 해당 분류 페이지의 제목만 입력하면 됩니다. 이 틀은 세로로 사용할 수 없는데, 세로로 사용하면 띄어쓰기가 생기는 탓에 링크가 제대로 적용되지 않고 깨지기 때문입니다.

올바른 사용법 잘못된 사용법 대체 가능
{{namucat|제이위키|위키위키|위키미디어}}
{{namucat
|제이위키
|위키위키
|위키미디어
}}
{{namucat<!--
-->|제이위키<!--
-->|위키위키<!--
-->|위키미디어<!--
-->}}

이와 같이 해당 분류 문서가 존재하는 경우 파란색, 존재하지 않는 경우 빨간색으로 표시됩니다.

틀만 삽입하고 아무 분류도 넣지 않으면 아래와 같은 미분류 박스가 나타나며 해당 문서는 분류:namucat/미분류에 추가됩니다. 이 틀의 문서 디자인은 사용하고 싶은데 미분류 박스가 나타나거나 미분류에 추가되는 것이 싫다면 {{namucat}} 대신 {{namucat/css}}로 사용하시면 됩니다.

이 문서는 분류가 되어 있지 않습니다. 특수:분류에서 적절한 분류를 찾아 문서를 분류해 주세요!

숨은 분류는 이 틀로 분류하지 말고 기존 분류 문법으로 분류할 것을 권장합니다.

어떤 틀 내에 분류 문법이 있어 틀을 삽입하면 분류도 함께 삽입될 때, 당연하게도 그 분류는 이 틀에 포함되지 않습니다. 이 경우 직접 그 분류를 추가해 주어야 합니다.

blur 변수

blur숫자=라는 이름의 변수가 있습니다. 이 변수를 선언하면 숫자에 해당하는 순서의 분류가 블러 처리됩니다. 예를 들어 blur3=on처럼 입력하면 세 번째에 입력한 분류가 블러 처리됩니다. 나무위키의 분류 블러처럼 마우스를 올려 원래 글자를 볼 수 있습니다. 모바일에서는 일정 시간 꾹 누르면 링크로 이동되지 않고 원래 글자를 볼 수 있습니다.

{{namucat|제이위키|blur1=on|위키위키|위키미디어|blur3=on}}

블러된 각 분류에 마우스를 올리면 본래 글자를 볼 수 있습니다. 모바일에서는 일정 시간 꾹 누르면 링크로 이동되지 않고 원래 글자를 볼 수 있습니다.

부가 기능

단순히 나무위키와 동일한 디자인의 분류라는 기능 외에, 이 틀을 사용한 문서에는 다음과 같은 부가 기능들이 함께 적용됩니다.

음, 사이트 1.41.243 업데이트 이후로 제이위키의 기본 분류 창도 나무위키처럼 바뀌었으니 이제 이 틀의 핵심은 사실상 이 부가 기능들이 되지 않았나 싶기도 합니다.

그리고 이제는 단순히 '나무위키처럼 편집하고 싶다'를 넘어서 구상한 부가 기능들을 CSS로 구현하는 것이 제작자 스스로에 대한 도전이자 목표가 된 것 같기도 합니다(...).

  • 모바일에서 링크를 꾹 눌렀을 때 0.5초 동안 링크에 파란 박스가 생겼다가 사라집니다. 비슷하게 나무위키를 모방한 {{나무위키 접기2}}와 {{펼치기 접기}}도 마찬가지로 접기 제목에 같은 효과가 적용됩니다.
  • 모든 하이퍼링크의 색이 나무위키와 동일하게 바뀝니다. 아마 제이위키의 다른 문서들과 비교해 보면 링크의 파란색이 다소 진하다는 것을 체감하실 겁니다.
  • 리스트가 나무위키 디자인과 레이아웃으로 바뀝니다. 나무위키 형식의 리스트만 사용하고 싶다면 틀:namulist를 참고할 수 있습니다. 자세한 변경 내용도 위 틀을 참고하세요.
  • 문단과 목차가 나무위키 디자인으로 바뀝니다. 이 문서에서 직접 확인해 보세요.
    [ 문단 변화 상세 ]
    • 번호와 글씨가 볼드체로 변경
    • 제목 아랫줄이 실선의 #ccc 색으로 변경
    • 시각 편집기 버튼이 사라지고, 위치가 오른쪽으로 쏠림
  • 이미지 문법에 border 변수를 추가했을 때 나타나는 이미지의 테두리 색이 #eaecf0에서 테이블 기본 테두리 색인 #ddd로 변경됩니다.
  • 기본 글씨 크기가 15px로 바뀝니다. 기존 제이위키의 글씨 크기는 14.4px이므로, 눈으로 보기에도 조금은 커졌을지도 모르겠습니다. 이외 글꼴과 글씨 색도 다소 변경되었습니다.
  • 사이트 최상단 내비게이션 바의 색상이 제이위키의 상징색에서 나무위키의 상징색(그라데이션)으로 바뀝니다.
  • 문서의 제목 부분과 본문 부분의 경계가 사라집니다.
  • <pre> 태그의 디자인이 (나무위키와 동일하도록) 다소 바뀝니다. 음, 조금 어색한가요?
  • 테이블 셀에 nopad라는 클래스를 입력하면 그 셀은 내부 여백이 사라집니다. 틀:이미지 여백 제거처럼 이미지를 표에 꽉 차게 넣을 때 사용할 수있습니다. 이 기능은 나무위키의 <nopad>에서 모방하였습니다.

주의

  • 이 틀을 사용한 문서에는 {{DISPLAYTITLE:보일 제목}}을 사용할 수 없습니다. 이미 틀 안에 보일 제목이 사용되어 있기 때문에 새로 보일 제목을 사용하면 오류가 나 버립니다. 보일 제목을 사용해야겠다면 DISPLAYTITLE 변수로 대신 가능합니다. {{namucat|DISPLAYTITLE=보일 제목|분류1|분류2|…}} 이렇게 사용할 수 있습니다. 하지만 |DISPLAYTITLE=none으로 입력할 경우 틀 바깥에서 {{DISPLAYTITLE:보일 제목}}을 원래처럼 사용할 수 있게 됩니다.
    • 틀 문서, 분류 문서 등 이름 공간이 있는 문서에서 DISPLAYTITLE 변수를 사용한다면 이름 공간이 유지된 채 변수에 넣은 값은 그 뒤에 출력됩니다. 예를 들어 분류:제이위키 문서에서 {{namucat|DISPLAYTITLE=Jwiki|…}}를 사용한다면 보이는 제목은 'Jwiki'가 아니라 '분류:Jwiki'가 됩니다.
  • 이름 공간이 있는 문서에서 문서의 제목이 영어로 시작하는 문서일 경우 첫 글자 알파벳이 반드시 소문자로 입력됩니다. 이는 미디어위키에서 첫 글자 알파벳을 반드시 대문자로 출력하는 현상을 방지하기 위함입니다. 하지만 대문자로 출력해야 하는 글자라면 |pagename=default라는 변수를 추가로 넣어 해제할 수 있습니다.
  • 이 틀을 사용한 문서는 각주 말풍선의 디자인이 나무위키처럼 변하게 되는데, 어떤 이유에서인지 말풍선의 디자인이 바뀌지 않을 때가 있습니다. 그럴 때는 디자인이 바뀔 때까지(...) 페이지를 새로고침하면 됩니다. 심하면 5번이 넘도록 새로고침해야 하는 경우도 있으니 인내심을 가져보세요.

위상

[전략] … 특히, 틀:namucat은 역대 제이위키의 모든 틀을 통틀어, 가장 범용성 있고 유용한 틀로 인지하고 있습니다. … [후략]
멋진신세계
[전략] … 나무위키 분류의 경우 사용자가 굉장히 많아 이러한 지원을 할 예정이지만 다른 틀들은 그렇지 않을 예정입니다. … [후략]
모니터링

제작자의 수많은 보급형 틀들 중에도 가장 많은 사용자가 가장 널리 사용하는 틀이며, 근거 없는 추측이지만 사이트 1.41.243 업데이트에서 사이트의 많은 디자인이 나무위키처럼 변화하게 된 데에도 적잖은 영향을 끼쳤을 것으로 추측됩니다. 이에 따라 일부 사용자들은 이 틀의 원리와 코드를 참고하여 자신만의 디자인과 형식대로 새로운 분류(+문서 디자인 변경) 틀을 만들어 내기도 했습니다. 대표적으로 윤마토군이 만든 틀:namucat-dark2, 리반이 만든 틀:namucat-liban, 멋진신세계가 만든 틀:노르웨이 왕국/테마 등이 있습니다. 이외에 틀:OEU 분류와 같은 것도 있습니다. namucat 틀의 생성 이후 이러한 "분류를 기존과 다른 방식 및 디자인으로 삽입하기 위한" 목적의 틀들이 크고 작은 유행을 만들어 냈습니다.

또한 이 틀을 시작으로 틀 스타일 CSS에서 새로운 클래스를 만들고 스타일을 적용하는 것이 아닌 사이트에 원래 존재하는 기존 클래스의 스타일을 새로 정의함으로써 레이아웃을 바꾸어 내는 방식도 널리 확산되게 되었습니다.이 부분은 다소 우려도 되는 것이, namucat 틀은 사이트의 기본 골자를 크게 해치지 않고 거의 유지한 채 일부 색상이나 디자인만 손보는 정도지만, 이러한 방식이 확산되면서 사이트의 기본 골자마저 아예 사용자의 입맛에 맞게 새로운 사이트인 것처럼 변형시키는 틀이나 사용자도 등장하기 시작했다는 것입니다. 디자인적으로 다양성을 표방할 수는 있겠지만 과연 그것이 '창작'을 지향하는 국내 최대 규모 창작위키인 이곳에서 어느 정도까지 받아들여질지는 앞으로 주의깊게 두고봐야 할 부분입니다.

틀이 생성된 지 약 1년 9개월 정도가 지난 2024년 6월경이 시기 틀 제작자인 저는 다크모드 대응을 위해 온갖 노력 중이었습니다.에는 운영자님으로부터 틀의 다크모드 지원을 위해 틀에 쓰이는 색상들을 var(--변수) 구문으로 받고 서버의 css 및 php 파일을 직접 열어 적용해 주겠다는 제안까지 받았습니다.말이 좀 어렵지만, 쉽게 말하자면 틀에서 변경한 링크 색상이나 글씨 색상 등을 다크모드에 대응하여 함께 변화하도록 할 수 있다는 뜻입니다. 적어도 제가 아는 한에선 운영자님께 직접 서버 간섭의 도움까지 받은 틀은 위키 최초이며, 운영자님 본인도 틀의 사용자가 많아 지원해 주는 것이고 다른 틀들은 이러한 지원이 없을 예정이라고 합니다.

둘러보기

+
나무위키 형식 틀 모음
[ 펼치기 · 접기 ]

나무위키 분류 틀
와샤 제작 김찬 제작
나무위키 분류 틀 made by KimChan
[ 펼치기 · 접기 ]
+
김찬 제작 틀
[ A~Z & etc. ]
[ ㄱ~ㅅ ]
[ ㅇ~ㅎ ]
※ 더 이상 사용하지 않거나 사용할 필요가 없는 경우 취소선 처리
※ 일부 극히 단순한 틀은 본 틀 목록에 미포함
KimChan Template
BEST TOP 3
[ 🥈 ]
틀:font awesome 5
편의성 기술성 혁신성
제이위키에 설치된 아이콘 웹 폰트를 100% 활용해 폰트의 모든 아이콘을 간편하게 사용할 수 있게 만든 틀. 사용 가능한 아이콘이 생각보다 훨씬 많고 심플한 디자인이 범용성 좋음.
[ 🥇 ]
틀:namucat
편의성 기술성 혁신성
나무위키 디자인의 분류 틀. 분류 목록을 문서 최상단에서 볼 수 있으며, 분류를 블러 처리하여 가리는 기능이나 문서 전체의 일부 디자인을 나무위키처럼 바꾸는 기능까지 있음.
[ 🥉 ]
틀:펼치기 접기
편의성 기술성 혁신성
나무위키 둘러보기 틀 디자인을 더 쉽게 만들 수 있게 해 주는 틀. 틀 자체를 직접 제작한 것은 아니지만 이 틀의 전신이 제작자의 틀이며 JS로 접기 애니메이션만을 추가했기 때문.
제작자 개인이 생각하기에 편의성, 기술성, 혁신성 등 여러 면에서 다른 틀에 비해 뛰어난 틀을 선정함.
이 문서의 내용 중 전체 또는 일부는 틀:namucat/설명문서 문서의 385513판에서 가져왔습니다. 문서 역사 보러가기