+ )
+}
+```
+
+위의 예시는 슬러그가 제공되지 않으면 블로그 게시물 목록을 표시하고, 슬러그가 제공되면 특정 블로그 게시물의 내용을 표시하는 플러그인을 위한 [동적 라우트](https://docs.astro.build/ko/guides/routing/#동적-라우트)를 정의합니다.
+
+## 그리드 항목 예시
+
+`src/dashboard-grid-items/MyPluginGridItem.astro` 파일에서 플러그인의 그리드 항목을 정의합니다. 다음은 플러그인의 그리드 항목을 정의하는 방법의 예시입니다.
+
+```astro title="MyPluginGridItem.astro"
+---
+import { StudioCMSRoutes } from 'studiocms:lib';
+import sdk from 'studiocms:sdk';
+
+// 여기서 'my-plugin'은
+// 플러그인 정의에서 가져온 `pageType`의 식별자로 사용됩니다.
+const pages = await sdk.GET.packagePages('my-plugin');
+
+// 지난 30일 동안 가장 최근에 업데이트된 5개의 페이지를 가져옵니다.
+const recentlyUpdatedPages = pages
+ .filter((page) => {
+ const now = new Date();
+ const thirtyDaysAgo = new Date(now.setDate(now.getDate() - 30));
+ return new Date(page.updatedAt) > thirtyDaysAgo;
+ })
+ .sort((a, b) => new Date(b.updatedAt).getTime() - new Date(a.updatedAt).getTime())
+ .slice(0, 5);
+---
+
+
+```
+
+위의 예시는 지난 30일 동안 가장 최근에 업데이트된 5개의 페이지를 표시하는 플러그인용 그리드 항목을 정의합니다. 이 그리드 항목은 각 페이지의 콘텐츠 관리 편집 페이지로 연결되는 링크 목록을 포함합니다.
+
+## FrontendNavigationLinks 도우미와 통합
+
+프로젝트에서 `@studiocms/blog` 플러그인이 사용하는 방식과 유사하게, StudioCMS 내장 탐색 도우미를 사용하려면 다음과 같이 사용자 정의 `Navigation.astro` 컴포넌트를 생성할 수 있습니다.
+
+```astro title="Navigation.astro"
+---
+import { StudioCMSRoutes } from 'studiocms:lib';
+import studioCMS_SDK from 'studiocms:sdk/cache';
+import { frontendNavigation } from 'studiocms:plugin-helpers';
+
+// Navigation 컴포넌트의 props를 정의합니다.
+interface Props {
+ topLevelLinkCount?: number;
+};
+
+// props에서 최상위 링크 개수를 가져옵니다.
+const { topLevelLinkCount = 3 } = Astro.props;
+
+// 사이트 구성과 페이지 목록을 가져옵니다.
+const config = (await studioCMS_SDK.GET.siteConfig()).data;
+
+// 구성에서 사이트 제목을 가져옵니다.
+const { title } = config || { title: 'StudioCMS' };
+
+// 메인 사이트 URL을 가져옵니다.
+const {
+ mainLinks: { baseSiteURL },
+} = StudioCMSRoutes;
+
+// 탐색 메뉴의 링크 props를 정의합니다.
+type LinkProps = {
+ text: string;
+ href: string;
+};
+
+// 탐색 메뉴의 링크들을 정의합니다.
+const links: LinkProps[] = await frontendNavigation();
+---
+{/* 드롭다운 아이템이 없는 경우 */}
+{ ( links.length < topLevelLinkCount || links.length === topLevelLinkCount ) && (
+
+) }
+```
+
+위의 예시는 StudioCMS 내장 탐색 도우미를 사용하여 프로젝트의 탐색 메뉴를 생성하는 사용자 정의 `Navigation.astro` 컴포넌트를 정의합니다. 이 컴포넌트는 메인 사이트 URL, 인덱스 페이지 및 탐색 메뉴에 표시되도록 설정된 다른 모든 페이지로 연결되는 링크를 포함합니다.
+
+몇 가지 스타일만 추가하면 StudioCMS 내장 탐색 도우미와 연동되어 완벽하게 작동하는 탐색 메뉴를 갖게 됩니다.