From 23ca91eda88b5552c4e2f9fc5ee646715ce06cae Mon Sep 17 00:00:00 2001 From: Iyyafi Qolbi Date: Mon, 7 Oct 2024 15:33:16 +0700 Subject: i18n(id): Update customization.mdx and configuration.mdx translation (#2437) Co-authored-by: HiDeoo <494699+HiDeoo@users.noreply.github.com> --- docs/src/content/docs/id/guides/customization.mdx | 95 +++++--- .../content/docs/id/reference/configuration.mdx | 244 +++++++++++++++++---- 2 files changed, 267 insertions(+), 72 deletions(-) diff --git a/docs/src/content/docs/id/guides/customization.mdx b/docs/src/content/docs/id/guides/customization.mdx index 0ff665d4..26a131ab 100644 --- a/docs/src/content/docs/id/guides/customization.mdx +++ b/docs/src/content/docs/id/guides/customization.mdx @@ -3,8 +3,7 @@ title: Mengkustomisasi Starlight description: Pelajari cara membuat website Starlight menjadi milik Anda sendiri dengan logo, font custom, desain halaman utama, dan lain-lain. --- -import { Tabs, TabItem } from '@astrojs/starlight/components'; -import { FileTree } from '@astrojs/starlight/components'; +import { Tabs, TabItem, FileTree, Steps } from '@astrojs/starlight/components'; Starlight menyediakan styling dan fitur bawaan yang disesuaikan, sehingga Anda dapat memulai dengan cepat tanpa ada konfigurasi diperlukan. Ketika Anda ingin mulai menyesuaikan tampilan dan nuansa website Starlight Anda, panduan ini akan membantu Anda. @@ -13,6 +12,8 @@ Ketika Anda ingin mulai menyesuaikan tampilan dan nuansa website Starlight Anda, Menambahkan logo custom ke header website adalah cara cepat untuk menambahkan branding individu Anda ke website Starlight. + + 1. Tambahkan file gambar logo Anda ke direktori `src/assets/`: @@ -27,7 +28,7 @@ Menambahkan logo custom ke header website adalah cara cepat untuk menambahkan br 2. Tambahkan path logo Anda sebagai opsi [`logo.src`](/id/reference/configuration/#logo) di `astro.config.mjs`: - ```js + ```diff lang="js" // astro.config.mjs import { defineConfig } from 'astro/config'; import starlight from '@astrojs/starlight'; @@ -37,18 +38,20 @@ Menambahkan logo custom ke header website adalah cara cepat untuk menambahkan br starlight({ title: 'Website Dokumentasi dengan Logo Saya', logo: { - src: './src/assets/logo-saya.svg', + + src: './src/assets/logo-saya.svg', }, }), ], }); ``` + + Secara default, logo akan ditampilkan bersama dengan `title` website Anda. Jika gambar logo Anda sudah mencakup judul website, Anda dapat menyembunyikan teks judul dengan mengatur opsi `replacesTitle`. Teks `title` tetap disertakan untuk pembaca layar agar header tetap dapat diakses. -```js +```js {5} starlight({ title: 'Website Dokumentasi dengan Logo Saya', logo: { @@ -62,6 +65,8 @@ starlight({ Anda dapat menampilkan logo Anda dalam versi mode terang dan gelap. + + 1. Tambahkan file gambar untuk masing-masing varian ke `src/assets/`: @@ -77,21 +82,23 @@ Anda dapat menampilkan logo Anda dalam versi mode terang dan gelap. 2. Tambahkan path ke varian logo Anda sebagai opsi `light` dan `dark` di `astro.config.mjs` dan bukan di `src`: - ```js + ```diff lang="js" starlight({ title: 'Website Dokumentasi dengan Logo Saya', logo: { - light: './src/assets/logo-terang.svg', - dark: './src/assets/logo-gelap.svg', + + light: './src/assets/logo-terang.svg', + + dark: './src/assets/logo-gelap.svg', }, }), ``` + + ## Aktifkan sitemap Starlight memiliki dukungan bawaan untuk menghasilkan sitemap. Aktifkan pembuatan sitemap dengan mengatur URL Anda sebagai `site` di `astro.config.mjs`: -```js +```js {4} // astro.config.mjs export default defineConfig({ @@ -100,6 +107,8 @@ export default defineConfig({ }); ``` +Pelajari cara [menambahkan tautan sitemap ke `robots.txt`](https://docs.astro.build/en/guides/integrations-guide/sitemap/#sitemap-link-in-robotstxt) di Dokumentasi Astro. + ## Tata letak halaman Secara default, halaman Starlight menggunakan tata letak dengan bilah navigasi global dan daftar isi yang menunjukkan judul halaman saat ini. @@ -107,7 +116,7 @@ Secara default, halaman Starlight menggunakan tata letak dengan bilah navigasi g Anda dapat menerapkan tata letak halaman yang lebih lebar tanpa bilah samping dengan mengatur [`template: splash`](/id/reference/frontmatter/#template) di frontmatter halaman. Ini sangat cocok untuk halaman utama dan Anda dapat melihatnya secara langsung di [halaman utama website ini](/id/). -```md +```md {5} --- # src/content/docs/index.md @@ -123,10 +132,10 @@ Anda dapat menyesuaikan — atau bahkan menonaktifkan — daftar isi secara glob Secara default, heading `

` dan `

` akan dimasukkan ke dalam daftar isi. Ubah tingkat heading yang akan dimasukkan di seluruh website menggunakan opsi `minHeadingLevel` dan `maxHeadingLevel` dalam konfigurasi [global `tableOfContents`](/id/reference/configuration/#tableofcontents). Timpa pengaturan default ini pada masing-masing halaman dengan menambahkan properti [frontmatter `tableOfContents`](/id/reference/frontmatter/#tableofcontents) yang sesuai. - + -```md +```md {4-6} --- # src/content/docs/example.md title: Halaman dengan hanya H2 di dalam daftar isi @@ -139,13 +148,13 @@ tableOfContents: -```js +```js {7} // astro.config.mjs defineConfig({ integrations: [ starlight({ - title: '', + title: 'Dokumen dengan konfigurasi daftar isi kustom', tableOfContents: { minHeadingLevel: 2, maxHeadingLevel: 2 }, }), ], @@ -157,10 +166,10 @@ defineConfig({ Nonaktifkan daftar isi sepenuhnya dengan mengatur opsi `tableOfContents` ke `false`: - + -```md +```md {4} --- # src/content/docs/example.md title: Halaman tanpa daftar isi @@ -169,9 +178,9 @@ tableOfContents: false ``` - + -```js +```js {8} // astro.config.mjs defineConfig({ @@ -195,7 +204,7 @@ Starlight memiliki dukungan bawaan untuk menambahkan tautan ke akun media sosial Anda dapat menemukan daftar lengkap ikon tautan yang didukung di [Referensi Konfigurasi](/id/reference/configuration/#social). Beritahu kami di GitHub atau Discord jika Anda memerlukan dukungan untuk layanan lain! -```js +```js {9-12} // astro.config.mjs import { defineConfig } from 'astro/config'; import starlight from '@astrojs/starlight'; @@ -231,7 +240,7 @@ Jika proyek Starlight Anda tidak berada di root repositori Anda, sertakan path p Contoh ini menunjukkan tautan untuk mengedit yang dikonfigurasi untuk website dokumentasi Starlight, yang berada dalam subdirektori `docs/` pada branch `main` dari repositori `withastro/starlight` di GitHub: -```js +```js {9-11} // astro.config.mjs import { defineConfig } from 'astro/config'; import starlight from '@astrojs/starlight'; @@ -266,8 +275,9 @@ Anda dapat menyesuaikannya dengan menambahkan file `404.md` (atau `404.mdx`) ke Anda dapat menggunakan semua teknik tata letak dan penyesuaian halaman Starlight dalam halaman 404 Anda. Sebagai contoh, halaman 404 default menggunakan [template `splash`](#tata-letak-halaman) dan komponen [`hero`](/id/reference/frontmatter/#hero) di frontmatter: -```md +```md {4,6-8} --- +# src/content/docs/404.md title: '404' template: splash editUrl: false @@ -277,6 +287,25 @@ hero: --- ``` +### Menonaktifkan halaman 404 default + +Jika proyek Anda memerlukan tata letak 404 yang sepenuhnya disesuaikan, Anda dapat membuat rute `src/pages/404.astro` dan menyetel opsi konfigurasi [`disable404Route`](/id/reference/configuration/#disable404route) untuk menonaktifkan rute default Starlight: + +```js {9} +// astro.config.mjs +import { defineConfig } from 'astro/config'; +import starlight from '@astrojs/starlight'; + +export default defineConfig({ + integrations: [ + starlight({ + title: 'Dokumen Dengan 404 Kustom', + disable404Route: true, + }), + ], +}); +``` + ## Font custom Secara default, Starlight menggunakan font sans-serif yang tersedia di perangkat lokal pengguna untuk semua teks. @@ -291,6 +320,8 @@ Untuk menggunakan Google Fonts, ikuti [panduan penyiapan Fontsource](#panduan-pe #### Menyiapkan file font lokal + + 1. Tambahkan file font Anda ke direktori `src/fonts/` dan buat file kosong `font-face.css`: @@ -322,7 +353,7 @@ Untuk menggunakan Google Fonts, ikuti [panduan penyiapan Fontsource](#panduan-pe 3. Tambahkan path ke file `font-face.css` Anda ke dalam array `customCss` Starlight di `astro.config.mjs`: - ```js + ```diff lang="js" // astro.config.mjs import { defineConfig } from 'astro/config'; import starlight from '@astrojs/starlight'; @@ -332,26 +363,30 @@ Untuk menggunakan Google Fonts, ikuti [panduan penyiapan Fontsource](#panduan-pe starlight({ title: 'Website Dokumentasi dengan Tipe Font Kustom', customCss: [ - // Path relatif ke file CSS `@font-face` Anda. - './src/fonts/font-face.css', + + // Path relatif ke file CSS `@font-face` Anda. + + './src/fonts/font-face.css', ], }), ], }); ``` + + #### Panduan penyiapan Fontsource Proyek [Fontsource](https://fontsource.org/) mempermudah penggunaan Google Fonts dan font open-source lainnya. Proyek ini menyediakan modul npm yang dapat Anda pasang untuk font yang ingin Anda gunakan dan termasuk file CSS siap pakai untuk ditambahkan ke proyek Anda. + + 1. Temukan font yang ingin Anda gunakan di [katalog Fontsource](https://fontsource.org/). Contoh ini akan menggunakan [IBM Plex Serif](https://fontsource.org/fonts/ibm-plex-serif). 2. Install package untuk font yang Anda pilih. Anda dapat menemukan nama package dengan cara mengklik "Install" pada halaman font Fontsource. - + @@ -381,7 +416,7 @@ Proyek ini menyediakan modul npm yang dapat Anda pasang untuk font yang ingin An 3. Tambahkan file CSS Fontsource ke dalam array `customCss` Starlight di `astro.config.mjs`: - ```js + ```diff lang="js" // astro.config.mjs import { defineConfig } from 'astro/config'; import starlight from '@astrojs/starlight'; @@ -391,9 +426,9 @@ Proyek ini menyediakan modul npm yang dapat Anda pasang untuk font yang ingin An starlight({ title: 'Website Dokumentasi dengan Jenis Font Custom', customCss: [ - // File Fontsource untuk font dengan ketebalan reguler dan semi-bold. - '@fontsource/ibm-plex-serif/400.css', - '@fontsource/ibm-plex-serif/600.css', + + // File Fontsource untuk font dengan ketebalan reguler dan semi-bold. + + '@fontsource/ibm-plex-serif/400.css', + + '@fontsource/ibm-plex-serif/600.css', ], }), ], @@ -402,6 +437,8 @@ Proyek ini menyediakan modul npm yang dapat Anda pasang untuk font yang ingin An Fontsource menyediakan beberapa file CSS untuk setiap font. Lihat [dokumentasi Fontsource](https://fontsource.org/docs/getting-started/install#4-weights-and-styles) untuk memahami file mana yang harus digunakan. + + ### Menggunakan font Untuk menerapkan font yang Anda siapkan untuk website Anda, gunakan nama font pilihan Anda dalam [file CSS custom](/id/guides/css-and-tailwind/#custom-css-styles). Sebagai contoh, untuk mengganti font default Starlight di seluruh website, atur properti custom `--sl-font`: diff --git a/docs/src/content/docs/id/reference/configuration.mdx b/docs/src/content/docs/id/reference/configuration.mdx index 469f9d31..22e6adf2 100644 --- a/docs/src/content/docs/id/reference/configuration.mdx +++ b/docs/src/content/docs/id/reference/configuration.mdx @@ -21,14 +21,26 @@ export default defineConfig({ }); ``` -Anda dapat meneruskan opsi-opsi berikut ke integrasi starlight. +Anda dapat meneruskan opsi-opsi berikut ke integrasi `starlight`. ### `title` (wajib) -**type:** `string` +**type:** `string | Record` Atur judul untuk website Anda. Akan digunakan dalam metadata dan di judul tab browser. +Nilainya dapat berupa string, atau untuk situs multibahasa, objek dengan nilai untuk setiap bahasa yang berbeda. +Saat menggunakan bentuk objek, nama propertinya harus berupa tag BCP-47 (misalnya `en`, `ar`, atau `zh-CN`): + +```ts +starlight({ + title: { + en: 'My delightful docs site', + de: 'Meine bezaubernde Dokumentationsseite', + }, +}); +``` + ### `description` **type:** `string` @@ -88,14 +100,18 @@ Dengan konfigurasi ini, halaman `/introduction` akan memiliki tautan untuk menge Konfigurasikan item navigasi sidebar website Anda. Sidebar adalah array dari tautan dan grup tautan. -Setiap item harus memiliki `label` dan salah satu properti berikut: +Kecuali item yang menggunakan `slug`, setiap item harus memiliki `label` dan salah satu properti berikut: - `link` — tautan tunggal ke URL tertentu, misalnya `'/home'` atau `'https://example.com'`. +- `slug` — referensi ke halaman internal, misalnya `'guides/getting-started'`. + - `items` — array yang berisikan lebih banyak tautan sidebar dan sub-grup. - `autogenerate` — objek yang menentukan direktori mana di website dokumentasi Anda yang akan digunakan untuk secara otomatis menghasilkan grup tautan. +Tautan internal juga dapat ditentukan sebagai string, bukan objek dengan properti `slug`. + ```js starlight({ sidebar: [ @@ -105,8 +121,12 @@ starlight({ { label: 'Mulai dari Sini', items: [ - { label: 'Pengantar', link: '/intro' }, - { label: 'Langkah Selanjutnya', link: '/next-steps' }, + // Menggunakan `slug` untuk tautan internal. + { slug: 'intro' }, + { slug: 'installation' }, + // Atau menggunakan singkatan untuk tautan internal. + 'tutorial', + 'next-steps', ], }, // Sebuah grup yang menghubungkan ke semua halaman di direktori referensi. @@ -129,16 +149,13 @@ Grup tautan dilebarkan secara default. Anda dapat mengubah perilaku ini dengan m Sub-grup yang dihasilkan secara otomatis akan mengikuti properti `collapsed` dari parent group-nya secara default. Atur properti `autogenerate.collapsed` untuk mengganti pengaturan ini. -```js +```js {5,13} sidebar: [ - // Grup yang terlipat + // Grup tautan yang terlipat { - label: 'Grup yang Terlipat', + label: 'Grup tautan yang Terlipat', collapsed: true, - items: [ - { label: 'Pengantar', link: '/intro' }, - { label: 'Langkah Selanjutnya', link: '/next-steps' }, - ], + items: ['intro', 'next-steps'], }, // Grup yang dilebarkan yang berisi autogenerated sub-grup yang terlipat. { @@ -155,7 +172,7 @@ sidebar: [ Jika website Anda mendukung banyak bahasa, `label` dari setiap item dianggap berada dalam bahasa default. Anda dapat mengatur properti `translations` untuk menyediakan label dalam bahasa-bahasa lain yang didukung: -```js +```js {5,9,14} sidebar: [ // Contoh sidebar dengan label-label yang diterjemahkan ke Bahasa Portugis Brasil. { @@ -180,21 +197,37 @@ sidebar: [ #### `SidebarItem` ```ts -type SidebarItem = { - label: string; - translations?: Record; - badge?: string | BadgeConfig; -} & ( - | { - link: string; - attrs?: Record; - } - | { items: SidebarItem[]; collapsed?: boolean } - | { - autogenerate: { directory: string; collapsed?: boolean }; - collapsed?: boolean; - } -); +type SidebarItem = + | string + | ({ + translations?: Record; + badge?: string | BadgeConfig; + } & ( + | { + // Tauntan + link: string; + label: string; + attrs?: Record; + } + | { + // Tautan internal + slug: string; + label?: string; + attrs?: Record; + } + | { + // Group tautan + label: string; + items: SidebarItem[]; + collapsed?: boolean; + } + | { + // Grup tautan yang dibuat secara otomatis + label: string; + autogenerate: { directory: string; collapsed?: boolean }; + collapsed?: boolean; + } + )); ``` #### `BadgeConfig` @@ -202,7 +235,8 @@ type SidebarItem = { ```ts interface BadgeConfig { text: string; - variant: 'note' | 'tip' | 'caution' | 'danger' | 'success' | 'default'; + variant?: 'note' | 'tip' | 'caution' | 'danger' | 'success' | 'default'; + class?: string; } ``` @@ -215,7 +249,6 @@ interface BadgeConfig { Setiap entri harus menggunakan direktori di mana file-file bahasa tersebut disimpan sebagai nama propertinya. ```js -// astro.config.mjs import { defineConfig } from 'astro/config'; import starlight from '@astrojs/starlight'; @@ -280,7 +313,7 @@ Arah penulisan bahasa ini; `"ltr"` untuk kiri-ke-kanan (default) atau `"rtl"` un Anda dapat serve bahasa default tanpa direktori `/lang/` dengan mengatur bahasa `root`: -```js +```js {3-6} starlight({ locales: { root: { @@ -346,6 +379,94 @@ starlight({ }); ``` +### `expressiveCode` + +**type:** `StarlightExpressiveCodeOptions | boolean` +**default:** `true` + +Starlight menggunakan [Expressive Code](https://github.com/expressive-code/expressive-code/tree/main/packages/astro-expressive-code) untuk merender blok kode dan menambahkan dukungan untuk menyorot bagian contoh kode, menambahkan nama file ke blok kode, dan banyak lagi. +Lihat [panduan “Blok kode”](/id/guides/authoring-content/#code-blocks) untuk mempelajari cara menggunakan sintaksis Expressive Code dalam konten Markdown dan MDX Anda. + +Anda dapat menggunakan salah satu [opsi konfigurasi Expressive Code](https://github.com/expressive-code/expressive-code/blob/main/packages/astro-expressive-code/README.md#configuration) standar serta beberapa properti khusus Starlight, dengan mengaturnya dalam opsi `expressiveCode` Starlight. +Misalnya, gunakan opsi `styleOverrides` Expressive Code untuk mengganti CSS default. Ini memungkinkan kustomisasi seperti memberi blok kode Anda sudut membulat: + +```js ins={2-4} +starlight({ + expressiveCode: { + styleOverrides: { borderRadius: '0.5rem' }, + }, +}); +``` + +Jika Anda ingin menonaktifkan Expressive Code, gunakan `expressiveCode: false` dalam konfigurasi Starlight Anda: + +```js ins={2} +starlight({ + expressiveCode: false, +}); +``` + +Selain opsi Expressive Code standar, Anda juga dapat mengatur properti khusus Starlight berikut dalam konfigurasi `expressiveCode` Anda untuk lebih menyesuaikan aturan tema untuk blok kode Anda: + +#### `themes` + +**type:** `Array` +**default:** `['starlight-dark', 'starlight-light']` + +Mengatur tema yang digunakan untuk memberi gaya pada blok kode. +Lihat [Dokumentasi Expressive Code `themes`](https://github.com/expressive-code/expressive-code/blob/main/packages/astro-expressive-code/README.md#themes) untuk detail format tema yang didukung. + +Starlight menggunakan varian gelap dan terang dari [tema Night Owl](https://github.com/sdras/night-owl-vscode-theme) Sarah Drasner secara default. + +Jika Anda menyediakan setidaknya satu tema gelap dan satu tema terang, Starlight akan secara otomatis menjaga tema blok kode aktif tetap sinkron dengan tema situs saat ini. +Konfigurasikan aturan ini dengan opsi [`useStarlightDarkModeSwitch`](#usestarlightdarkmodeswitch). + +#### `useStarlightDarkModeSwitch` + +**type:** `boolean` +**default:** `true` + +Jika `true`, blok kode secara otomatis beralih antara tema terang dan gelap saat tema situs berubah. +Jika `false`, Anda harus menambahkan CSS secara manual untuk menangani peralihan antara beberapa tema. + +:::note +Saat mengatur `themes`, Anda harus menyediakan setidaknya satu tema gelap dan satu tema terang agar sakelar mode gelap Starlight dapat berfungsi. +::: + +#### `useStarlightUiThemeColors` + +**type:** `boolean` +**default:** `true` jika `themes` tidak diatur, kalau tidak `false` + +Jika `true`, variabel CSS Starlight digunakan untuk warna elemen UI blok kode (latar belakang, tombol, bayangan, dll.), yang sesuai dengan [tema warna situs](/id/guides/css-and-tailwind/#tema). +Jika `false`, warna yang disediakan oleh tema penyorotan sintaksis aktif digunakan untuk elemen-elemen ini. + +:::note +Saat menggunakan tema khusus dan menyetelnya ke `true`, Anda harus menyediakan setidaknya satu tema gelap dan satu tema terang untuk memastikan kontras warna yang tepat. +::: + +### `pagefind` + +**type:** `boolean` +**default:** `true` + +Tentukan apakah penyedia pencarian situs default Starlight [Pagefind](https://pagefind.app/) diaktifkan. + +Atur ke `false` untuk menonaktifkan pengindeksan situs Anda dengan Pagefind. +Ini juga akan menyembunyikan UI pencarian default jika digunakan. + +Pagefind tidak dapat diaktifkan saat opsi [`prerender`](#prerender) diatur ke `false`. + +### `prerender` + +**type:** `boolean` +**default:** `true` + +Tentukan apakah halaman Starlight harus dirender terlebih dahulu ke HTML statis atau dirender sesuai permintaan oleh [adaptor SSR](https://docs.astro.build/en/guides/server-side-rendering/). + +Halaman Starlight dirender terlebih dahulu secara default. +Jika Anda menggunakan adaptor SSR dan ingin merender halaman Starlight sesuai permintaan, tetapkan `prerender: false`. + ### `head` **type:** [`HeadConfig[]`](#headconfig) @@ -369,6 +490,9 @@ starlight({ }); ``` +Entri dalam `head` dikonversi langsung ke elemen HTML dan tidak melewati pemrosesan [skrip](https://docs.astro.build/en/guides/client-side-scripts/#script-processing) atau [gaya](https://docs.astro.build/en/guides/styling/#styling-in-astro) Astro. +Jika Anda perlu mengimpor aset lokal seperti skrip, gaya, atau gambar, [ganti komponen Head](/id/guides/overriding-components/#menggunakan-data-halaman). + #### `HeadConfig` ```ts @@ -414,18 +538,18 @@ Jika Anda perlu mengatur varian tambahan atau favicon cadangan, Anda dapat menam ```js starlight({ - favicon: '/images/favicon.svg'. - head: [ - // Tambahkan favicon ICO cadangan untuk Safari. - { - tag: 'link', - attrs: { - rel: 'icon', - href:'/images/favicon.ico', - sizes: '32x32', - }, - }, - ], + favicon: '/images/favicon.svg', + head: [ + // Tambahkan favicon ICO cadangan untuk Safari. + { + tag: 'link', + attrs: { + rel: 'icon', + href: '/images/favicon.ico', + sizes: '32x32', + }, + }, + ], }); ``` @@ -439,6 +563,13 @@ Atur pemisah antara judul halaman dan judul website di tag `` halaman, ya Secara default, setiap halaman memiliki `<title>` berupa `Judul Halaman | Judul Website`. Sebagai contoh, halaman ini berjudul "Referensi Konfigurasi" dan website ini berjudul "Starlight", sehingga `<title>` untuk halaman ini adalah "Referensi Konfigurasi | Starlight". +### `disable404Route` + +**type:** `boolean` +**default:** `false` + +Menonaktifkan penyuntikan [halaman 404](https://docs.astro.build/en/core-concepts/astro-pages/#custom-404-error-page) bawaan Starlight. Untuk menggunakan kustom rute `src/pages/404.astro` di proyek Anda, tetapkan opsi ini ke `true`. + ### `components` **type:** `Record<string, string>` @@ -454,3 +585,30 @@ starlight({ ``` Lihat [Referensi Penggantian](/id/reference/overrides/) untuk rincian semua komponen yang dapat Anda ganti. + +### `plugins` + +**type:** [`StarlightPlugin[]`](/id/reference/plugins/#quick-api-reference) + +Perluas Starlight dengan plugin khusus. +Plugin menerapkan perubahan pada proyek Anda untuk mengubah atau menambah fitur Starlight. + +Kunjungi [pajangan plugin](/id/resources/plugins/#plugins) untuk melihat daftar plugin yang tersedia. + +```js +starlight({ + plugins: [starlightPlugin()], +}); +``` + +Lihat [Referensi Plugin](/id/reference/plugins/) untuk detail tentang cara membuat plugin Anda sendiri. + +### `credits` + +Aktifkan tampilan tautan “Built with Starlight” di footer situs Anda. + +```js +starlight({ + credits: true, +}); +``` -- cgit