동일 페이지 스크롤 앵커 링크 추가하기
이 기능은 프리미엄 기능이며 버전 4.0.1 이상에서 사용할 수 있습니다.
동일 페이지 스크롤 앵커 링크는 동일한 페이지 내의 특정 위치를 가리키는 링크입니다. 동일 페이지 링크를 클릭하면 브라우저가 지정된 영역으로 스크롤됩니다.
동일 페이지 앵커 링크를 만들려면 두 가지가 필요합니다:
- 요소의 사용자 정의 클래스 또는 사용자 정의 ID, 그리고
- 해당 사용자 정의 클래스 또는 ID를 참조하는 링크나 버튼
1. 요소에 사용자 정의 클래스 또는 사용자 정의 ID 추가
페이지 하단 근처에 있는 요소를 선택한 다음 속성을 엽니다. 고급 영역에서 “go_here“
2. 사용자 정의 클래스 또는 ID를 참조하는 링크나 버튼
이제 페이지 상단 근처에 링크를 만들거나 버튼 요소를 추가합니다. 링크로 URL을 추가하는 대신, “go_here”를 사용자 정의 클래스로 추가한 경우 “.”을 포함하여 “.go_here“를 사용하고, 사용자 정의 ID로 추가한 경우 “#”을 포함하여 “#go_here“를 사용합니다.
페이지를 저장한 후 링크/버튼을 클릭하면 이제 페이지 하단의 요소를 향해 부드럽게 스크롤됩니다.
이 방법을 사용하여 명명된 앵커(Named Anchor)를 타겟팅할 수도 있습니다
다음과 같은 명명된 앵커는
<a name="go_here"></a>
“#”을 포함한 “#go_here“로 링크를 추가하여 타겟팅할 수도 있습니다.
기타 용도
클래스 이름이나 ID를 사용하여 타겟팅하는 한 편집기 영역 외부를 포함하여 페이지 내의 다른 모든 영역도 타겟팅할 수 있습니다.