매스너리 레이아웃과 스페셜 메뉴

높이가 다른 블록을 열에 깔끔하게 쌓거나, 카테고리마다 패널이 있는 카테고리 목록을 표시합니다.

사용 가이드 Pro Navigation 2 분 소요

일반 메가 메뉴에서는 블록마다 자체 열이 있어서 짧은 링크 목록 아래에 빈 공간이 생깁니다. 매스너리는 여러 블록을 한 열로 묶어 쌓습니다. 예를 들어 짧은 브랜드 목록 두 개가 첫 번째 열을 함께 쓸 수 있습니다.

템플릿

둘 다 템플릿 선택의 스페셜 메뉴 그룹에 있습니다.

매스너리 레이아웃: 네 개의 열(항목 그룹 블록)이 있고 각 열 안에 링크 목록이 쌓입니다.
스페셜 메뉴: 왼쪽에 카테고리 목록이 있고, 대형 마켓플레이스 메뉴처럼 카테고리마다 오른쪽에 링크 목록과 이미지로 된 자체 패널이 있습니다.

템플릿 추가하기

편집기의 요소 트리에서 최상위 항목 아래의 하위 메뉴 추가를 클릭합니다. 스페셜 메뉴 (1)를 가리킨 다음 매스너리 레이아웃 (2)의 선택을 클릭합니다.

(1) 스페셜 메뉴 그룹을 가리키기, (2) 매스너리 레이아웃 선택
샘플 콘텐츠 편집하기

템플릿은 너비 25%의 항목 그룹 블록 4개와 그 안의 링크 목록을 추가합니다. 각 제목이나 링크에 마우스를 올리고 항목 편집을 클릭해 제목과 링크를 변경하세요.
열에 블록 추가 또는 제거하기

그룹 안에서 블록 추가를 클릭해 링크 목록이나 이미지 같은 블록을 하나 더 쌓습니다. 제거하려면 블록에 마우스를 올리고 항목 삭제를 클릭합니다.
저장 및 게시하기

저장을 클릭한 다음 게시를 클릭합니다.

빈 메가 메뉴 추가하기

하위 메뉴 추가를 클릭하고 메가 메뉴를 가리킨 다음 빈 템플릿의 선택을 클릭합니다. 기존 메가 메뉴를 사용해도 됩니다.
열마다 항목 그룹 추가하기

블록 추가를 클릭하고 멀티 블록을 선택한 다음 항목 그룹을 선택합니다. 그룹 하나가 한 열입니다. 요소 트리에는 항목 그룹(매스너리 그리드 레이아웃) 으로 표시됩니다.

(1) 탭 선택, (2) 레이아웃에 마우스를 올리고 선택 클릭.
그룹 너비 설정하기

새 그룹의 너비는 50%입니다. 열이 한 줄에 들어가도록 각 그룹의 너비를 설정하세요. 예: 4열이면 25%, 3열이면 33.33%.
각 그룹 채우기

각 그룹 안에서 블록 추가를 클릭해 그 열의 블록을 추가합니다. 블록이 나란히 놓이지 않고 쌓이도록 안쪽 블록의 너비를 100%로 설정하세요.
저장 및 게시하기

저장을 클릭한 다음 게시를 클릭합니다.

템플릿 추가하기

하위 메뉴 추가를 클릭하고 스페셜 메뉴를 가리킨 다음 스페셜 메뉴 템플릿의 선택을 클릭합니다.

(1) 스페셜 메뉴 그룹을 가리키기, (2) 매스너리 레이아웃 선택
카테고리와 패널 편집하기

왼쪽의 각 카테고리는 탭입니다. 이름을 바꾼 다음 블록 추가로 패널을 채우세요. 탭 메뉴를 참고하세요.
저장 및 게시하기

저장을 클릭한 다음 게시를 클릭합니다.

두 템플릿 모두 메가 메뉴 패널에서 열리므로, 패널의 너비, 정렬, 배경은 상위 항목의 하위 메뉴 섹션에서 설정합니다. 메가 메뉴 패널 레이아웃을 참고하세요.

블록이 쌓이지 않고 나란히 놓여요

요소 트리에서 안쪽 블록이 항목 그룹 안에 있는지, 너비가 100%인지 확인하세요.

그룹이 두 번째 줄로 넘어가요

그룹 너비의 합이 100%를 넘습니다. 한 줄에 들어가도록 너비를 줄이세요.

도움이 되었나요?