페이지 이동 만들기

페이지 이동은 앵커 링크 또는 점프 링크라고도 하며, 링크를 클릭했을 때 즉시 긴 페이지 위나 아래로 이동하는 위치입니다. 오른쪽의 목차는 페이지 이동의 예시입니다.

페이지 이동은 페이지의 섹션에 연결하는 좋은 방법입니다. 사이트 방문자는 클릭하여 긴 페이지의 한 부분에서 같은 페이지의 다른 부분으로 이동할 수 있습니다.

예를 들어, 페이지 상단에 섹션 이름 목록이 있다고 가정해 보겠습니다. 각 이름과 페이지 아래에 있는 해당 섹션을 연결하면 방문자가 관심이 있는 특정 정보에 관한 섹션으로 바로 이동할 수 있습니다. 이후 독자를 페이지 시작 부분에 있는 모든 섹션의 원래 목록으로 다시 연결할 수 있습니다.

영어 비디오입니다.
YouTube의 자동 번역 기능을 사용하면 원하는 언어로 시청할 수 있습니다.

자동 번역 자막을 켜는 방법:

1. 비디오를 재생합니다.
2. 비디오 오른쪽 하단의 ⚙️ 설정 아이콘을 클릭합니다.
3. 자막/CC를 선택합니다.
4. 자동 번역을 선택합니다.
5. 원하는 언어를 선택합니다.

자동 더빙(실험 기능)으로 시청하는 방법:

1. ⚙️ 설정 아이콘을 클릭합니다.
2. 오디오 트랙을 선택합니다.
3. 시청하려는 언어를 선택합니다.

ℹ️ 번역과 더빙은 Google에서 자동 생성되므로 정확하지 않을 수 있으며, 자동 더빙 기능은 현재 테스트 중이라 모든 언어에서 사용할 수 있는 것은 아닙니다.

첫 번째 단계는 독자가 페이지 이동을 클릭할 때 도달해야 하는 섹션을 선택하는 것입니다. 이를 위해 이동하려는 블록에 “앵커”를 만들 수 있습니다.

1. 앵커를 추가할 블록을 클릭합니다. 문단, 제목, 이미지, 열, 버튼을 포함한 많은 공통 블록에서 앵커를 지원합니다.
2. 오른쪽 사이드바에서 블록의 설정을 봅니다. 오른쪽에 사이드바가 표시되지 않는 경우 오른쪽 상단 모서리의 설정 아이콘을 클릭하면 설정이 표시됩니다. 이 아이콘은 열 2개가 균등하지 않은 정사각형 모양입니다.

3. 블록 설정의 하단에서 고급을 클릭합니다.
4. HTML 앵커 상자에 단어를 입력합니다. 이제 이것이 앵커가 됩니다. 페이지의 다른 곳에서 이미 앵커로 사용되지 않는 고유한 단어를 사용해야 합니다. 둘 이상의 단어를 사용하려는 경우 단어 사이에 하이픈(-)이 자동으로 삽입됩니다(예: two-words).

다음으로 페이지 이동 링크를 만들겠습니다. 방문자가 이 버튼을 클릭하면 1단계에서 만든 섹션에 도달합니다.

1. 독자가 클릭할 텍스트를 입력하거나 이미지, 버튼 또는 탐색 메뉴 항목을 추가합니다.
2. 텍스트/이미지/버튼/메뉴 항목을 선택하고 블록의 도구 모음에서 링크 옵션을 클릭합니다. 링크 옵션은 여기에 강조 표시된 것처럼 실제 체인 링크와 유사한 아이콘입니다.
   
3. 해시태그(#) 기호로 시작하는 1단계에서 만든 HTML 앵커를 입력합니다. 예를 들어, create-a-page-jump라는 앵커를 만든 경우 링크 입력은 #create-a-page-jump가 됩니다.
4. 편집기의 오른쪽 상단에서 저장/업데이트/공개를 클릭하여 변경 사항을 저장합니다.

끝났습니다! 이제 공개 페이지에서 링크를 테스트하고 2단계에서 만든 링크가 1단계에서 만든 앵커로 연결되는지 확인할 수 있습니다. 페이지 또는 글을 미리 볼 때 페이지 이동 링크가 작동하지 않으므로 공개된 버전을 테스트하세요.

탐색 메뉴에서 페이지의 특정 부분으로 연결되는 페이지 이동을 생성할 수 있습니다. 이는 스크롤이 긴 홈페이지가 있는 사이트에 일반적입니다. 페이지 이동을 통해 방문자는 원하는 홈페이지 섹션을 더 편하게 볼 수 있습니다.

1. 첫 번째 단계는 이동할 위치로 앵커를 생성하는 것입니다.
2. 메뉴에서 사용자 정의 링크인 새 항목을 추가합니다.
3. 텍스트 필드에 호출될 메뉴 항목을 작성합니다. 이는 페이지 이동에 영향을 미치지 않습니다.
4. URL 필드에서 앞에 해시태그(#) 기호를 붙여 앵커를 작성합니다.

#my-anchor와 같은 페이지 이동은 앵커와 동일한 페이지에서만 작동합니다. 다른 페이지의 섹션으로 이동하려면 이 가이드의 다음 섹션을 참조하세요.

페이지 이동을 같은 페이지 내에 있는 섹션과의 연결에만 사용할 필요는 없습니다. 페이지 이동을 사용하여 한 페이지에서 다른 페이지의 특정 영역에 연결할 수 있습니다.

차이점은 2단계에서 링크를 #create-a-page-jump로 작성한 것처럼 앵커에만 연결하는 대신에 전체 페이지 URL과 앵커를 연결한다는 것입니다.

예를 들어, 페이지에 다음 URL이 있는 경우:

https://yourgroovydomain.com/example/

그리고 해당 페이지에 unique-identifier라는 앵커를 생성하면 전체 이동 링크는 다음과 같습니다.

https://yourgroovydomain.com/example/#unique-identifier

페이지 상단으로 돌아가는 이동 링크 생성:

1. 페이지 시작 부분의 블록에 앵커를 추가합니다.
2. 페이지를 내리고 “맨 위로 돌아가기” 또는 “시작 부분으로 이동”과 같은 텍스트를 입력합니다.
3. 해당 텍스트를 앵커에 연결합니다.