Header Search

  • 0:12 min

  • 0 comments

태그 :

이 요소를 사용하면 헤더 내부에 검색 아이콘을 추가하여 헤더 오버레이, 헤더 아래로 슬라이딩/페이드 또는 전체 화면 등 다양한 방식으로 검색 양식을 열 수 있습니다. Force search open in builder 빌더에서…

이 요소를 사용하면 헤더 내부에 검색 아이콘을 추가하여 헤더 오버레이, 헤더 아래로 슬라이딩/페이드 또는 전체 화면 등 다양한 방식으로 검색 양식을 열 수 있습니다.

Force search open in builder

빌더에서 Search Form을 계속 열려있도록 강제합니다. 이 설정을 활성화하지 않으면 아이콘을 클릭할 때마다 열리고 닫힙니다.

Search Layout

Blow header

헤더 바로아래에 검색창이 나타납니다.

Overlay header

헤더 컨텐츠 또는 헤더내 컨테이너 위에 검색창이 나타납니다.

Full Screen

전체화면에 검색창이 나타납니다.

Form Height

Below header layout을 선택한 경우, 검색창의 높이를 설정할 수 있습니다.

Transition duration

Reveal animation의 transition speed를 변경할 수 있습니다.

Search max-width

모든 검색 레이아웃의 경우 너비는 콘텐츠 너비(테마 설정에서 지정한 컨테이너 너비), 전체 너비 또는 사용자 지정 너비로 ​​설정할 수 있습니다. (헤더의 나머지 패딩과 일치하도록 양식 패딩을 수정해야 할 수도 있습니다.)

Placeholder text

사용자가 입력을 시작하기 전에 검색 양식에 나타나는 텍스트를 사용자 지정합니다.

Form styles

양식과 검색 입력 모두 UI에서 완전히 스타일을 지정할 수 있습니다.

Icons

페이지 로드 시 나타나는 ‘열린 검색 아이콘’과 검색 양식 자체 내부에 위치한 ‘닫는 검색 아이콘’의 두 가지 아이콘이 있습니다. 둘 다 사용자 정의가 가능하며, 닫기 아이콘도 제거할 수 있습니다(열린 검색 아이콘을 다시 클릭하거나 ESC를 눌러도 검색 양식이 닫힙니다).

인기글

23

9월

BricksExtra의 이미지 핫스팟 요소를 사용하면 이미지를 보다 직관적이고 상호작용적으로 만들 수 있습니다. 이 요소는 이미지 위에 핫스팟(마커)을 추가하여 사용자에게 정보를 제공하거나 특정 콘텐츠를 강조할 수 있는 기능을 제공합니다. 핫스팟은 수동으로…

16

8월

BricksExtras는 헤더 템플릿에 더 많은 설정을 추가하고 새로운 'Header row' 요소를 추가하여 페이지/템플릿별로 다른 Breakpoints에서 오버레이 헤더 및 스티키 헤더를 조건부로 추가하는 지원으로 다중 행 헤더를 더 쉽게 빌드할 수…

16

8월

이 요소를 사용하면 헤더 내부에 검색 아이콘을 추가하여 헤더 오버레이, 헤더 아래로 슬라이딩/페이드 또는 전체 화면 등 다양한 방식으로 검색 양식을 열 수 있습니다. Force search open in builder 빌더에서…

Leave the first comment