글에서 원하는 위치로 스크롤 이동하는 링크 만들기

예시 사이트 보기

위 예시 사이트를 보면 목차가 있다. 목차에서 1~4번 링크를 누를 수 있는데 이 링크를 누르면 해당 스크롤 위치로 이동하게 된다. 내용이 긴 콘텐츠들의 가독성을 향상시키기 매우 좋은 기능이다. 예를 들어 내용이 많은 나무위키에서 이런 기능을 많이 사용한다. html 수정 기능과 하이퍼링크 태그만 외우고 있으면 언제든지 사용할 수 있다.

• 위 기능을 사용하려면 html로 태그를 작성해야 해서 에디터에 html 수정 기능이 있어야 한다. 티스토리 블로그를 기준으로 설명하니 참고.

기능 사용 방법

1. 링크를 추가할 문장을 찾는다. 문장을 “나는 할 수 있다”로 가정하겠다.

   ---

2. 문장을 사이에 두고 하이퍼링크 태그를 입력한다.

   <a href=”no1”>나는 할 수 있다</a>

   • 여기서 no1은 ID로 생각하면 된다. 본인이 알기 쉬운 단어 아무거나 정하면 된다.

   ---

3. 이동할 문장을 찾으면 맨 앞에 <h2 data-ke-size="size26"> 이런 형식의 태그가 있을 것이다. 그곳 h2 태그 앞에 id=”no1”을 입력하면 된다.

   <h2 id="no1" data-ke-size="size26">

   ---

4. 예시 사이트처럼 여러 개의 링크를 걸 것이라면 ID를 각각 따로 지정하여 1~3번을 반복하면 된다.

• 필자는 ID를 1번으로 사용하였다.