내비게이션 사이드바
redesigned 내비게이션 사이드바에 추가하거나 변경할 때는 다음 가이드라인을 따르세요.
이 가이드라인은 현재 내비게이션 사이드바의 상태를 반영합니다. 그러나 사이드바는 진행 중인 작업이며 문서도 마찬가지입니다.
새로운 내비게이션 사이드바 활성화
새로운 내비게이션 사이드바를 활성화하려면 아바타를 선택한 다음 새 내비게이션 토글을 켜세요.
사이드바에 항목 추가
사이드바에 항목을 추가하기 전에 내비게이션 핸드북 페이지에 개요된 프로세스를 검토하고 따르도록 하세요.
페이지별 Vue 콘텐츠 추가
페이지는 SidebarPortal 컴포넌트를 사용하여 임의의 콘텐츠를 사이드바에 렌더링할 수 있습니다. 기본 슬롯에 전달된 콘텐츠는 해당 페이지의 내비게이션 항목 아래에 렌더링됩니다.
해당 페이지에서 이 컴포넌트의 인스턴스를 하나만 지원합니다. 이렇게 함으로써 순서 문제와 사이드바 혼잡을 피합니다.
임의의 콘텐츠를 사용할 수 있습니다.
::Sidebars::Panel을 서브클래싱하여 내비게이션 항목을 구현해야 합니다. Vue Router를 사용해야 하는 경우 (예: Vue를 사용하여 내비게이션 항목을 렌더링해야 하는 경우), 예외를 적용할 수 있습니다. 그러나 해당 panel.rb 파일에는 내비게이션 항목이 어떻게 렌더링되는지 설명하는 주석을 추가해야 합니다.SidebarPortalTarget 컴포넌트를 사용하지 마십시오. 이는 내비게이션 사이드바의 내부 요소입니다.Snowplow 추적
내비게이션 항목에서의 모든 클릭은 Snowplow에서 자동으로 추적되어야 하지만 추가 입력이 필요할 수 있습니다. 내비게이션의 모든 요소에는 데이터를 Snowplow로 보내기 위한 data-tracking 속성을 사용합니다. GDK에서 Snowplow를 설정하여 작동 여부를 확인할 수 있습니다(https://gitlab.com/gitlab-org/gitlab-development-kit/-/blob/main/doc/howto/snowplow_micro.md).
| 필드 | 데이터 속성 | 참고 | 예시 |
|---|---|---|---|
| 카테고리 | data-tracking-category
| 항목을 클릭한 사용자가 위치한 페이지입니다. | groups:show
|
| 동작 | data-tracking-action
| 취한 동작입니다. 대부분의 경우 click_link 또는 click_menu_item입니다.
| click_link
|
| 레이블 | data-tracking-label
| 클릭한 대상에 대한 서술자입니다. 대부분의 경우 항목의 ID로 유추되지만 item_without_id로 대체될 수도 있습니다. 이를 주의깊게 살펴보아야 합니다.
| group_issue_list
|
| 속성 | data-tracking-property
| 링크를 클릭한 내비의 위치를 설명합니다. 주로 메인 내비 패널에 있어야 하며, 패널을 설명해야 합니다. | nav_panel_group
|
도움말