섹션 ID를 사용해 특정 섹션으로 이동시키기

시작에 앞서 섹션 ID란, 각 섹션이 가진 고유의 ID를 말합니다. 이 섹션 ID를 링크시킬 주소(URL) 대신 삽입하면, 특정 섹션으로 화면을 이동시킬 수 있습니다. '섹션 링크'는 흔히 원페이지(1-Page) 사이트에서 많이 쓰이며, 필요한 경우 다른 메뉴의 특정 섹션으로 이동시키는 것도 가능합니다. 이번 팁에서는 같은 페이지에 존재하는 섹션으로 이동시키는 방법에 대해 알아보겠습니다.

기능 미리보기 1)  섹션 이동 예시 보기에 접속하여, 페이지 가운데에 있는 [문의하기] 버튼을 눌러보세요. 2) 같은 페이지 아래 문의하기 입력폼이 있는 섹션으로 이동하는 것을 확인할 수 있습니다.

제작방법 1단계, 이동하고자 하는 섹션의 설정 창 켜기 1) 이동하고자 하는 섹션의 오른쪽 기둥에 마우스 커서를 놓고, 마우스 오른쪽 버튼을 클릭해주세요.  2) 보조 메뉴가 나타나면, [섹션 설정]을 클릭합니다.

2단계, 섹션 ID 복사하기 설정 창 우측 중간쯤 위치한, 섹션 ID를 #을 포함해, 마우스로 드래그합니다. 다음으로 키보드에서 CTRL + C를 눌러 섹션 ID를 복사합니다.

3단계, 링크를 걸고자 하는 위젯의 설정 메뉴 열고, 링크 걸기 1) 링크를 걸고자 하는 위젯([문의하기] 버튼)을 우클릭하여 [버튼 설정]을 누릅니다. 그러면 아래와 같은 [버튼 설정] 창이 열립니다.   2) 작동 방법을 [링크]로 선택하고, 주소란에  / 이후, 이동하고자 하는 섹션이 있는 페이지의 URL과 섹션 ID 를 붙여 넣습니다. 섹션 ID는 #을 포함해, 띄어쓰기 없이 붙여넣기 해주세요.

• 링크 삽입 예시  /section#s202007238589ce9e8b623 

  • 이동할 섹션이 있는 페이지 url이 section이기 때문에 링크 예시에 section을 넣었습니다. 

  • 이동할 섹션의 페이지 url 가져오는 방법 : 디자인 모드 > (왼쪽 위) 메뉴 관리 > 해당 메뉴 우클릭 > 메뉴 설정 > url 복사 

[게시하기]를 눌러 반영을 완료합니다.