틀:히어로슬라이드

{{히어로슬라이드
|제목1=|부제1=|꼬리표1=|배경1=|링크1=|링크문구1=
|제목2=|부제2=|꼬리표2=|배경2=|링크2=|링크문구2=
|제목3=|부제3=|꼬리표3=|배경3=|링크3=|링크문구3=
|간격=6000|높이=340px}}

{{히어로슬라이드|꼬리표1=CHAPTER 01|제목1=제로셀|부제1=도시가 잠든 뒤에 시작되는 이야기|링크1=제로셀|제목2=아일랜드버스|부제2=바다 너머의 기록}}

1. 처음 만들기[편집]§

한 번도 안 써 봤다면 1단계부터 순서대로 따라 하세요. 각 단계의 상자를 편집 화면에 그대로 붙여 넣고 저장하면 됩니다. 앞 단계에 한 줄씩 더해 가는 방식이라 외울 것이 없습니다.

1단계 — 한 장부터 띄우기

{{히어로슬라이드|제목1=제로셀}}

어두운 배너에 제로셀이라는 큰 글자가 뜨면 성공입니다. 아직 넘길 장이 없으니 화살표와 아래 점은 일부러 숨어 있습니다. 여기서 제목1의 1은 첫째 장이라는 뜻입니다.

2단계 — 설명 한 줄 붙이기

{{히어로슬라이드|제목1=제로셀|부제1=도시가 잠든 뒤에 시작되는 이야기}}

제목 아래에 작은 설명이 붙습니다. 부제는 한두 줄이 가장 보기 좋고, 길면 화면에서 잘립니다.

3단계 — 두 장으로 늘리기 (여기서부터 넘어갑니다)

{{히어로슬라이드
 |제목1=제로셀|부제1=도시가 잠든 뒤
 |제목2=아일랜드버스|부제2=바다 너머의 기록}}

번호만 2로 바꿔 한 줄 더 썼을 뿐인데 좌우 화살표와 아래 점이 생기고 6초마다 저절로 넘어갑니다. 같은 방식으로 제목3·제목4… 6장까지 늘릴 수 있습니다. 줄이 길어지면 위처럼 장마다 줄을 나눠 써도 똑같이 동작합니다. 읽기 훨씬 편하니 2장부터는 이렇게 쓰는 것을 권합니다.

4단계 — 배경 그림 넣기 먼저 그림을 올려야 합니다. 특수:파일올리기에서 그림을 올린 뒤, 올릴 때 쓴 파일 이름을 그대로 적습니다.

{{히어로슬라이드
 |제목1=제로셀|부제1=도시가 잠든 뒤|배경1=제로셀_대문.jpg
 |제목2=아일랜드버스|부제2=바다 너머의 기록|배경2=아일랜드_대문.jpg}}

바깥 사이트의 그림을 쓸 때는 https://부터 시작하는 주소를 통째로 넣습니다. ※ 배경이 안 보이면 파일 이름이 틀린 것입니다. 이때 글자는 그대로 나오고 배경만 비어 보이므로, 오타부터 확인하세요.

5단계 — 눌러서 문서로 가게 만들기 장마다 버튼을 하나씩 달 수 있습니다.

{{히어로슬라이드
 |제목1=제로셀|부제1=도시가 잠든 뒤|배경1=제로셀_대문.jpg|링크1=제로셀|링크문구1=세계관 보기
 |제목2=아일랜드버스|부제2=바다 너머의 기록|배경2=아일랜드_대문.jpg|링크2=아일랜드버스}}

링크1에는 문서 이름을 씁니다(주소가 아닙니다). 링크문구1을 빼면 버튼 글자는 자세히 보기가 됩니다.

6단계 — 꼬리표로 분위기 내기 제목 위에 작은 라벨을 얹으면 게임 포털 느낌이 납니다.

|꼬리표1=CHAPTER 01

CHAPTER 01·WORLD ARCHIVE처럼 짧은 영문 대문자가 가장 잘 어울립니다.

7단계 — 속도와 높이 다듬기

|간격=4000|높이=420px

간격은 밀리초입니다. 4000이면 4초마다 넘어갑니다(기본 6000). 높이는 배너 높이로 기본은 340px입니다. 글이 길어 답답하면 높이를 키우세요.

8단계 — 대문에 올리기 대문을 편집해 가장 첫 줄에 붙여 넣습니다. 첫 줄에 있으면 좌우 여백 없이 화면 끝까지 꽉 찬 배너가 됩니다. 그 아래에 {{요소그리드}}나 {{분류타일}}을 이어 붙이면 대문이 완성됩니다.

2. 양식 모음[편집]§

① 가장 간단한 양식 — 우선 띄워 보고 싶을 때

{{히어로슬라이드|제목1=|제목2=}}

② 표준 양식 — 실제 대문에 쓰는 형태

{{히어로슬라이드
 |제목1=|부제1=|꼬리표1=|배경1=|링크1=
 |제목2=|부제2=|꼬리표2=|배경2=|링크2=
 |제목3=|부제3=|꼬리표3=|배경3=|링크3=}}

③ 전체 양식 — 쓸 수 있는 값을 모두 편 것(6장)

{{히어로슬라이드
 |제목1=|부제1=|꼬리표1=|배경1=|링크1=|링크문구1=
 |제목2=|부제2=|꼬리표2=|배경2=|링크2=|링크문구2=
 |제목3=|부제3=|꼬리표3=|배경3=|링크3=|링크문구3=
 |제목4=|부제4=|꼬리표4=|배경4=|링크4=|링크문구4=
 |제목5=|부제5=|꼬리표5=|배경5=|링크5=|링크문구5=
 |제목6=|부제6=|꼬리표6=|배경6=|링크6=|링크문구6=
 |간격=6000|높이=340px}}

안 쓰는 줄은 지워도 되고 비워 둬도 됩니다. 비어 있는 번호는 자동으로 건너뜁니다.

3. 슬라이드 매개변수[편집]§

번호 1~6을 이름 뒤에 붙여 씁니다(제목1, 제목2…).

제목N이나 배경N 중 하나만 있어도 그 장이 켜집니다. 빈 번호는 건너뛰므로 1·3·5처럼 띄엄띄엄 채워도 되고, 가운데 번호를 지워도 나머지가 알아서 당겨집니다.

4. 전체 설정[편집]§

5. 저절로 되는 것[편집]§

따로 설정하지 않아도 이렇게 동작합니다.

• 마우스를 올리거나 키보드 초점이 들어가면 자동 넘김이 멈춥니다(읽는 도중에 넘어가지 않게)
• 모바일에서는 손가락으로 밀어 넘기고, 좁은 화면에서는 화살표가 숨습니다
• 다른 탭에 갔다 오면 멈췄다가 다시 시작합니다
• 운영체제에서 동작 줄이기를 켠 사람에게는 자동 넘김이 아예 꺼집니다(접근성)
• 장이 1장뿐이면 화살표와 점이 자동으로 사라집니다
• 아무것도 채우지 않으면 안내 슬라이드가 대신 보입니다

6. 자주 하는 실수[편집]§

• 배경이 안 보입니다 — 올린 파일 이름이 정확한지 확인하세요. 없는 파일이면 배경만 비고 글자는 그대로 나옵니다
• 안 넘어갑니다 — 장이 1장뿐이면 화살표·점이 일부러 숨습니다. 제목2까지 채웠는지 보세요
• 간격을 바꿨는데 그대로입니다 — 간격=6000처럼 숫자만 넣어야 합니다. 6초·6000ms는 무시됩니다
• 글자가 화살표에 가립니다 — 부제를 줄이거나 높이를 키우세요
• 링크를 눌러도 안 갑니다 — 링크1에는 주소가 아니라 문서 이름을 넣습니다

7. 완성된 모습[편집]§

아래는 3단계까지 따라 한 결과입니다.

디자인은 틀:히어로슬라이드/스타일에서 고칩니다. 다른 회전 배너와의 비교는 도움말의 '히어로 슬라이드 자세히' 문단에 있습니다.