#탭 – 03

이야기에 앞서

이 템플릿은 이전 #탭 – 02의 업그레이드 버전입니다.

1. 인디케이터(지시자: 언더라인 / 어퍼라인 등)가 DOM 변화에 반응하여 탭과 동일한 너비를 가지도록 개선되었습니다.
2. 이 템플릿은 여러 바리에이션을 가지고 있으므로 원하는 위젯만 복사/붙여넣기로 사용합니다.
3. 특정한 탭을 URL이나 링크를 통해 활성화 시킬 수 있습니다. 자세한 내용은 블로그에서 다루고 있습니다.

유의사항

1. 엘리멘터에서 제공하는 탭 위젯은 기본적으로 많은 버그를 가지고 있습니다. 예를들어, 사용자가 탭 색상을 변경해도 위젯의 기본 스타일의 명시도가 높아 변경되지 않거나, Template 위젯을 사용해서 불러온 탭 위젯의 스타일이 기본값으로 돌아간다거나.
2. 이 템플릿에서 발생할 수 있는 일부 오동작은 위젯 자체의 문제입니다. 대부분의 경우, Hacky 한 트릭을 써서 이러한 버그를 감추기보다는 엘리멘터의 향후 업데이트에서 고쳐지도록 그대로 놔둔 경우도 있습니다.
3. 특정 상황에서 스타일이 심하게 훼손된다면 엘리멘터 관리자 → Elementor → Tools → General 탭에서 Clear Files & Data로 캐시를 삭제하세요.
4. 디자인과 작동방식의 특성 상 수직 정렬 레이아웃(Vertical Layout)은 고려하지 않습니다. 

시작하기

엘리멘터 편집 화면에서 키보드의 Control + i 혹은 Command + i 키를 눌러 Structure 패널을 항상 열어두세요.

핵심레이어

원하는 페이지에 붙여넣을 때 반드시 복사해야 할 레이어는 다음과 같습니다. 

※ 링크를 통한 특정 탭 활성화 기능을 원하면 Settings - Expanding tab with anchor 레이어도 복사하세요.