[케이테마 v2] K-Sticky 상세 설정

예상 읽기 시간:1분 6 조회수
적용 대상최신 공개 케이테마
Elementor 표시명K-Sticky
작업 위치Elementor → K-Theme Widgets
권장 작업 시간20~30분

K-Sticky는 한쪽 안내 영역을 고정하고 반대쪽 내용을 스크롤하도록 구성합니다. 긴 서비스 설명·프로세스·제품 특징에 적합합니다.

시작하기 전에

준비물권장 기준
고정 제목한두 줄
스크롤 항목3개 이상
상단 오프셋실제 헤더 높이보다 약간 크게
모바일일반 세로 배치 확인

1. K-Sticky 추가하고 레이아웃 정하기

검색창에 K-Sticky를 입력해 추가합니다. LayoutSticky Position을 정한 뒤 Eyebrow·Title·Description·Button을 입력합니다.

Elementor 위젯 검색에서 확인한 K-Sticky
K-Sticky를 검색해 긴 설명 영역에 추가합니다.

2. 스크롤 항목과 링크 입력하기

Scroll Items에서 각 항목의 제목과 설명을 입력합니다. 실제로 스크롤 동작을 확인할 수 있도록 충분한 항목을 넣고 버튼 URL의 # 임시값은 공개 전에 교체합니다.

K-Sticky 고정 콘텐츠와 스크롤 항목 설정 화면
고정 제목·버튼과 스크롤 항목을 입력합니다.

3. 오프셋과 높이 설정하기

스타일 탭에서 Offset·Demo Height·Accent Color를 조정합니다. 오프셋은 고정 헤더에 가려지지 않을 정도로 정하고, 부모 섹션의 높이가 짧으면 sticky가 작동하지 않는다는 점을 기억하세요.

K-Sticky 오프셋 높이 스타일 설정 화면
헤더 높이에 맞는 오프셋과 부모 영역 높이를 조정합니다.

완료 확인

확인 항목완료 기준
고정 위치헤더와 겹치지 않음
스크롤부모 영역 안에서 자연스럽게 유지됨
링크버튼이 실제 페이지로 이동함
모바일고정 때문에 읽기 영역이 좁아지지 않음

기존 테마 사용자

기존 테마의 sticky 스크립트와 K-Sticky를 같은 영역에 중복 적용하지 않습니다. 커스텀 CSS의 position: sticky와 상단 오프셋도 함께 확인하세요.

페이지 공유

[케이테마 v2] K-Sticky 상세 설정

URL 주소 공유

목차