도움말:

산수유 (토론 | 기여)님의 2015년 6월 28일 (일) 05:26 판

개요

노가다의 세계에 오신 위키러님을 환영합니다!

위키 작성, 당신도 할 수 있다! 문서에도 나와 있듯이, 간단한 표는 표 생성기에서 만들어 가져올 수 있습니다. 아니면 편집창 상단의 "고급"을 누르고 제일 오른쪽에 있는 Toolbar insert table.png 아이콘을 클릭해서 만들 수도 있어요. 하지만 위키작성을 하다보면 당연히 표를 좀 더 예쁘게 꾸미고 싶은 욕구가 들기 마련입니다.

여기가 파란색으로 되어있으면 더 보기 좋을 것 같아.

이 항목을 따라서 오름차순으로 정렬할 수 있으면 진짜 완벽할텐데...

흰 바탕에 회색 테두리의 표는 더 이상 지겹습니다. 하지만 표를 꾸미는 방법을 검색해보니 이상한 말만 잔뜩 나와있습니다. 이해도 안 되고 복잡합니다. 영어 사이트는 들어가기도 전에 울렁증부터 납니다.

고민하는 여러분들을 위해 리브레 위키에 도움말이 준비되어 있습니다. 도움말을 차근차근 따라오면서 문법을 익혀봅시다. 어느새 도움말을 열어보지 않고도 척척 표를 만들어내는 훌륭한 위키니트달인이 되어있을 것입니다.

간단한 표부터 만들어 보자!

이 문단에서는 표를 작성하는데 필요한 기본적인 문법을 알아봅니다. 설명할 내용을 크게 나누면 다음의 세 가지가 됩니다.

  • {|, |}, |, |-의 네 가지 필수 기호
  • |+, !의 두 가지 옵션 기호
  • ||, !!를 사용하는 모니위키스러운 작성 방법

{|, |}, |, |-와 익숙해지기

표는 기본적으로 {|, |}, |, |-의 네 가지 기호로 만들 수 있습니다.

  • {| : 표의 시작을 나타냅니다.
  • |} : 표의 마침을 나타냅니다. 즉, {||} 사이가 표의 내용이 됩니다.
  • | : 한 칸을 나타냅니다. 그 칸에 들어갈 내용은 | 오른쪽에 적습니다.
  • |- : 행과 행 사이를 구분하는 구분선 기호입니다.


이렇게만 설명하면 잘 와닿지 않으니, 바로 만들어 살펴보겠습니다.

이렇게 입력하면.. 이렇게 나옵니다!
{| class="wikitable"
| ㄱ
| ㄴ
| ㄷ
|-
| A
| B
| C
|-
| 1
| 2
| 3
|-
| 사과
| 오렌지
| 포도
|}
A B C
1 2 3
사과 오렌지 포도

히, 히익! 무서워! 여기서 나가야 겠어!


진정하고(...), 이게 어떻게 생겨먹었는지를 파악해봅시다. 생각보다 어렵지 않아요. 위에서부터 아래로 찬찬히 따라가보면 이렇습니다.

  1. 우선 {|를 적어서 표가 시작한다는 걸 알립니다.
    • class 어쩌구하는 녀석은 나중에 설명합니다. 지금은 그냥 {|와 같이 써야되는 구절이라 생각하고 넘어가주세요.
  2. 다음 줄에 |를 적으면 1번째 행의 1번째 칸이 만들어집니다. 그 칸에 들어갈 내용은 |의 오른쪽에 적으면 됩니다. 예시에서는 'ㄱ'을 적었군요.
  3. 그 다음 줄에 |를 적으면 이번에는 1번째 행의 2번째 칸이 만들어집니다. (아직 다음 행으로 넘어간게 아니에요!) 이번에도 |의 오른쪽에 그 칸에 들어갈 내용을 적습니다. 예시에서는 'ㄴ'을 적었습니다.
  4. 또 그 다음 줄에 |를 적으면 이젠 1번째 행의 3번째 칸이 만들어집니다. 역시 이번에도 |의 오른쪽에 그 칸에 들어갈 내용을 적습니다. 예시에서는 'ㄷ'을 적었네요.
    • 이런 방식으로 1번째 행의 4번째 칸, 5번째 칸, ... 을 만들어나가면 됩니다. 예시에서는 3번째 칸까지 만들었습니다.
  5. 1번째 행에 들어갈 칸과 내용들을 모두 작성했다면, 이제 두 번째 행을 작성해봅시다. 바로 다음 줄에 |-를 적어 1번째 행과 2번째 행을 구분할 구분선을 만들어 줍니다.
  6. 이제 그 다음 줄에 |를 적으면 이제 비로소 2번째 행의 1번째 칸이 만들어집니다. 그 칸에 들어갈 내용은 역시 위와 같은 방법으로 |의 오른쪽에 적으면 됩니다. 예시에서는 'A'을 적었군요.
  7. 1번째 행을 만들때와 마찬가지로 그 다음 줄에 |를 적으면 2번째 행의 2번째 칸이 만들어집니다. 역시 같은 방법으로 |의 오른쪽에 그 칸에 들어갈 내용을 적으면 됩니다. 예시에서는 'B'을 적었습니다.
    • 이런 방식으로, 1번째 행을 작성할 때 처럼 2번째 행의 3번째 칸, 4번째 칸, ... 을 만들어나가면 됩니다. 예시에서는 1번째 행을 칸 3개로 만들었으므로 2번째 행도 3번째 칸까지 만들었습니다.
  8. 2번째 행에 들어갈 칸과 내용들을 모두 작성했다면, 이제 세 번째 행을 작성합니다. 바로 다음 줄에 |-를 적어 2번째 행과 3번째 행을 구분할 구분선을 만들어 줍니다.
  9. 그 다음 줄에 |를 적으면 3번째 행의 1번째 칸이 만들어집니다. 그 칸에 들어갈 내용은 역시 위와 같은 방법으로 |의 오른쪽에 적으면 됩니다. 예시에서는 '1'을 적었군요.
    • 역시 아까와 같은 방법으로 3번째 행에 들어갈 칸과 내용들을 작성합니다.
  10. 3번째 행에 들어갈 칸과 내용들을 모두 작성했다면, 바로 다음 줄에 |-를 적어 3번째 행과 4번째 행을 구분할 구분선을 만들어 주고 네 번째 행을 작성합니다.
    • 이런 방식으로 5번째 행, 6번째 행, ... 을 만들어 나가면 됩니다. 예시에서는 4번째 행까지 만들었습니다.
  11. 표에 들어갈 칸과 내용을 전부 작성했다면, |}를 적어서 표를 마칩니다.

헥헥


다른 모습의 예시들도 살펴봅시다.

이렇게 입력하면.. 이렇게 나옵니다!
{| class="wikitable"
| ㄱ
| ㄴ
| ㄷ
| ㄹ
| ㅁ
|-
| ㅏ
| ㅑ
| ㅓ
| ㅕ
| ㅗ
|-
| A
| B
| C
| D
| E
|-
| 1
| 2
| 3
| 4
| 5
|}
A B C D E
1 2 3 4 5
{| class="wikitable"
| 강아지
| 고양이
|-
| 토끼
| 햄스터
|}
강아지 고양이
토끼 햄스터

알면 좋은 참고 사항들

필요하다면 {| 바로 다음 줄과 |} 바로 전 줄에 |-를 추가로 넣어도 상관 없습니다.

이렇게 입력하면.. 이렇게 나옵니다!
{| class="wikitable"
|-
| ㄱ
| ㄴ
| ㄷ
|-
| A
| B
| C
|-
| 1
| 2
| 3
|-
|}
A B C
1 2 3

앞으로의 설명에서, 특별한 경우가 아니면 {| 바로 다음 줄의 |-는 표기하고, |} 바로 전 줄의 |-는 표기하지 않겠습니다.


표 내용을 기입할 때, 띄어쓰기를 아무리 많이해도 실제 표의 표현에는 영향을 주지 않습니다.

이렇게 입력하면.. 이렇게 나옵니다!
{| class="wikitable"
|-
|                           ㄱ
|              ㄴ
| ㄷ
|-
| A
|      B
|              C
|-
| 1
|                            2
|              3
|}
A B C
1 2 3

만약 칸에 들어갈 내용을 입력하지 않는다면, 그 칸은 빈 칸으로 남게 됩니다.

이렇게 입력하면.. 이렇게 나옵니다!
{| class="wikitable"
|-
| ㄱ
|
| ㄷ
|-
| A
| B
|
|-
|
| 2
| 3
|}
A B
2 3

당연하다면 당연한 얘기지만, 표에는 텍스트 뿐만이 아니라 그림이나 수식 등 다른 미디어도 들어갈 수 있습니다.

이렇게 입력하면.. 이렇게 나옵니다!
{| class="wikitable"
|-
| [[파일:Libre_Wiki-Logo.png|150px]]
|-
| {{youtube|1a0WDHZuw4w|300px|200px}}
|}
Libre Wiki-Logo.png

표 문법에서는 엔터 입력, 즉 줄바꿈까지 문법의 일부로 인식하기 때문에 표 안에서 줄 바꿈을 하고 싶을 때는
태그를 이용해야 합니다. 엔터 입력 만으로는 표 안에서의 줄바꿈이 제대로 되지 않습니다.

이렇게 입력하면.. 이렇게 나옵니다!
{| class="wikitable"
|-
| 줄 바꿈을
쌩으로 하면
이렇게 됩니다.
|-
| 나·랏:말ᄊᆞ·미
中듀ᇰ國·귁·에달·아
|}
줄 바꿈을

쌩으로 하면 이렇게 됩니다.

나·랏:말ᄊᆞ·미

中듀ᇰ國·귁·에달·아

{| class="wikitable"
|-
| 줄 바꿈을</br>태그로 하면</br>이렇게 됩니다.
|-
| 나·랏:말ᄊᆞ·미</br>中듀ᇰ國·귁·에달·아
|}
줄 바꿈을
태그로 하면
이렇게 됩니다.
나·랏:말ᄊᆞ·미
中듀ᇰ國·귁·에달·아

표에 제목 넣기 : |+

|+를 사용하면 표의 제목('캡션'이라고도 합니다)을 표 위에 추가할 수 있습니다. 아래 예시처럼 행이 본격적으로 시작하기 전(={|와 첫 |- 사이)에 |+를 쓰고 원하는 내용을 작성하면 됩니다. 필수는 아니므로 꼭 쓰지는 않아도 됩니다.

이렇게 입력하면.. 이렇게 나옵니다!
{| class="wikitable"
|+ 한글과 숫자
|-
| ㄱ
| ㄴ
| ㄷ
| ㄹ
| ㅁ
|-
| 1
| 2
| 3
| 4
| 5
|}
한글과 숫자
1 2 3 4 5

머릿말 칸 넣기 : !

칸을 나타내는 기호인 |!로 바꾸면 그 행을 표의 머리말 칸으로 나타낼 수 있습니다. 쉽게 말해, 표의 메인 칸이 되는 거죠. 아래 예시처럼 맨 앞을 |대신 !로 작성하면 첫 번째 행의 1번째, 2번째, 3번째 칸이 머리말 칸이 되어 나타납니다. 이 기호도 필수는 아니므로 꼭 쓰지는 않아도 됩니다.

이렇게 입력하면.. 이렇게 나옵니다!
{| class="wikitable"
|-
! 한글
! 영어
! 숫자
|-
| ㄱ
| A
| 1
|-
| ㄴ
| B
| 2
|-
| ㄷ
| C
| 3
|}
한글 영어 숫자
A 1
B 2
C 3

꼭 첫 번째 행에 있는 칸만 강조할 수 있는 것은 아닙니다. 아래 예시처럼 작성하면 세 번째 행의 1번째, 2번째, 3번째 칸이 강조되어 나타납니다.

이렇게 입력하면.. 이렇게 나옵니다!
{| class="wikitable"
|-
! 한글
! 영어
! 숫자
|-
| ㄱ
| A
| 1
|-
| ㄴ
| B
| 2
|-
| ㄷ
| C
| 3
|}
한글 영어 숫자
A 1
B 2
C 3

자주 있는 상황은 아니지만, 행 전체가 아닌 특정 칸만 강조할 수도 있습니다.

이렇게 입력하면.. 이렇게 나옵니다!
{| class="wikitable"
|-
! 한글
| 영어
! 숫자
|-
| ㄱ
! A
| 1
|-
| ㄴ
| B
| 2
|-
| ㄷ
| C
! 3
|}
한글 영어 숫자
A 1
B 2
C 3

알아도 되고 몰라도 되는 참고 사항

  • 속성이 뭔지에 대해서는 앞으로 설명할 것이므로 아래 말이 무슨 말인지 모르겠다면 일단 넘어가셔도 좋습니다.

머리말 칸이 어떤 방법으로 강조 되는 지는 그 표가 어떤 속성을 가지고 있느냐에 따라 달라집니다. 예를 들어, class 속성의 속성 값을 wikitable로 준 표에서는 머리말 행이 '회색 배경볼드체+가운데 정렬' 되어 나타나고, 속성 값을 sortable로 준 표에서는 머리말 행에 오름차순/내림차순 정렬 스위치가 생성됩니다. 아래 예시에서는 class 속성 값을 wikitable과 sortable을 둘 다 주었으므로 아래처럼 '회색 배경볼드체+가운데 정렬'에 '스위치 추가'로 나타납니다.

이렇게 입력하면 이렇게 나옵니다
{| class="wikitable sortable"
|-
! 항목
! 데이터1
! 데이터2
|-
| A
| 200
| 1278
|-
| B
| 150
| 956
|-
| C
| 100
| 1034
|}
항목 데이터1 데이터2
A 200 1278
B 150 956
C 100 1034

모니위키'스럽게' 표 만들기 : ||, !!

그 동안 칸을 구분하기 위해 사용했던 '줄바꿈+|'를 ||로, '줄바꿈+!'를 !!로 한 번에 나타낼 수 있습니다. 이를 이용하면 아래 예시와 같이 모니위키의 테이블 문법과 꽤 유사하게 표를 작성할 수 있습니다.

이렇게 입력하면.. 이렇게 나옵니다!
{| class="wikitable"
|-
! 한글 !! 영어 !! 숫자
|-
| ㄱ || A || 1
|-
| ㄴ || B || 2
|-
| ㄷ || C || 3
|}
한글 영어 숫자
A 1
B 2
C 3

방법은 간단합니다. 위의 예시처럼 모두 한 줄에 쓰되, 처음은 |로 시작하고 내용과 내용 사이를 ||로 구분 시켜주면 됩니다. 이렇게 하면 한 행에 있는 칸을 텍스트에서도 한 줄에 한꺼번에 쓸 수 있습니다. 간단한 표의 경우, 이렇게 표시하는 것이 더 직관적입니다.


다만 모니위키의 문법과는 다소 차이가 있어 주의해야할 부분이 있습니다.

  1. 줄 마지막에 ||를 붙이는 것은 모니위키에서는 행이 끝남을 의미했지만, 미디어위키에서는 |- 기호로 행을 구분하기 때문에 줄 마지막에 ||를 붙이면 새 칸이 하나 더 늘어날 뿐입니다. 행을 끝내고 새 행으로 넘기려면 줄 마지막에 ||를 붙이지 마시고 바로 다음 줄로 줄바꿈해 |-를 입력해야 합니다.
  2. 모니위키에서는 |||| 사이를 비워두면 가로방향으로 칸이 합쳐졌지만, 미디어 위키에서는 그런 거 없고 그냥 빈 칸으로 남게 됩니다. 칸을 합치려면 따로 표에 뭔가를 더 써줘야 하지만, 이 부분은 나중에 설명합니다.

모니위키에서 넘어오신 분들은 이 점을 주의해주시면 되겠습니다.

정리

위의 내용을 정리하면 다음과 같습니다.

기본 기호 {| 표의 시작
|} 표의 마침
|
|- 행 구분선
선택적으로 사용가능 |+ 표의 제목
! 머릿말 칸
모니위키스럽게 작성할 때 ||
! 머릿말 칸

표를 예쁘게 꾸며보자!

작성중