ابتدائی رسائی کی درخواست کریں

اپنا پہلا نام اور دفتری ای میل پتہ درج کریں۔ ہم Tajo تک رسائی کی درخواست کی تصدیق کے لیے ایک لنک ای میل کریں گے۔

اس صفحہ پر

موجودہ تھیم کے ساتھ انٹیگریشن

Set Noa

وضاحتی خاکہ · نمونہ ڈیٹا

سنک کی مثال

ایک ریکارڈ کا جائزہ لیں

ماخذ

Shopify

کنیکٹر کی حیثیت: زیرِ تیاری

منزل

Brevo

کنیکٹر کی حیثیت: فعال

فیلڈ میپنگ

ماخذ فیلڈ	منزل فیلڈ	نمونہ قدر
`record.id`	`source_id`	`record_1042`
`record.updated_at`	`updated_at`	`2026-10-18T08:00:00Z`
`record.value`	`value`	`sample_value`

مسودہ
ایک ریکارڈ کا جائزہ لیں
یہ ورژن منظور کریں

حیثیت ہر کنیکٹر کی الگ ہے؛ اس سے یہ سنک تیار ہونے کی ضمانت نہیں ملتی۔ یہ فیلڈز صرف مثال ہیں۔ سنک چلنے سے پہلے اصل اسکیما اور اجازتیں چیک کریں۔

یہ تھیم اس طرح ڈیزائن کیا گیا ہے کہ وہ دیگر Tailwind CSS v4 پروجیکٹس کے ساتھ بغیر کسی رکاوٹ کے کام کرے۔

لازمی اقدامات

اس تھیم سے src/docs فولڈر اپنے موجودہ پروجیکٹ میں کاپی کریں۔

اس تھیم کی زیادہ تر اشیاء src/docs فولڈر کے تحت موجود ہیں۔ چنانچہ پہلا قدم صرف یہ ہے کہ اس پورے فولڈر کو اپنے موجودہ پروجیکٹ میں کاپی کر دیا جائے (تاکہ src/docs پر وہی فولڈر ساخت برقرار رہے)۔
دستاویزات کے اسٹائلز اپنی گلوبل css فائل میں امپورٹ کریں۔

یہ کام اپنی global.css فائل میں tailwind تھیم امپورٹ کے بعد درج ذیل لائن شامل کر کے کیا جا سکتا ہے:
src/styles/global.css
```
/* theme definition import */
@import "./tailwind-theme.css";

/* docs styles */
@import "@/docs/styles/docs-global.css";
```

دستاویزات کا content collection اپنی سائٹ کی content collection کنفیگ فائل میں شامل کریں۔

// other collections...

const docsCollection = defineCollection({
  loader: glob({ pattern: "**/[^_]*{md,mdx}", base: "./src/docs/data/docs" }),
  schema: () =>
    z.object({
      title: z.string(),
      description: z.string().optional(),
      sidebar: z
        .object({
          label: z.string().optional(),
          order: z.number().optional(),
          badge: z
            .object({
              text: z.string(),
              variant: z.enum(["note", "tip", "caution", "danger", "info"]).default("note"),
            })
            .optional(),
        })
        .optional(),
      tableOfContents: z
        .object({
          minHeadingLevel: z.number().min(1).max(6).optional(),
          maxHeadingLevel: z.number().min(1).max(6).optional(),
        })
        .optional(),
      pagefind: z.boolean().optional(),
      mappingKey: z.string().optional(),
      draft: z.boolean().optional(),
    }),
});

export const collections = {
  // other collection....
  docs: docsCollection,
};

mdx کمپونینٹس کو AutoImport انٹیگریشن میں شامل کریں

export default defineConfig({
  // other config options...
  integrations: [
    AutoImport({
      imports: [
        // other imports...
        "@/docs/components/mdx-components/Aside.astro",
        "@/docs/components/mdx-components/Badge.astro",
        "@/docs/components/mdx-components/Button.astro",
        "@/docs/components/mdx-components/Steps.astro",
        "@/docs/components/mdx-components/Tabs.astro",
        "@/docs/components/mdx-components/TabsContent.astro",
        "@/docs/components/mdx-components/TabsList.astro",
        "@/docs/components/mdx-components/TabsTrigger.astro",
      ],
    }),
  ],
});

دستاویزات کے صفحات اپنی سائٹ میں شامل کریں۔

Tajo تھیم سے پورا src/pages/docs فولڈر اپنی سائٹ کے src/pages/docs فولڈر میں کاپی کریں۔

اختیاری اقدامات

فونٹس

یہ تھیم بطور ڈیفالٹ Inter فونٹ استعمال کرتا ہے۔ تجویز کیا جاتا ہے کہ فونٹ کو fontsource سے مقامی طور پر انسٹال کیا جائے۔

پھر اپنی fonts.css فائل میں درج ذیل شامل کریں:

/* inter-latin-wght-normal */
@font-face {
  font-family: "Inter Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(@fontsource-variable/inter/files/inter-latin-wght-normal.woff2)
    format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
    U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF,
    U+FFFD;
}

متبادل فونٹس

آپ مختلف فونٹس بھی استعمال کر سکتے ہیں۔ بس یہ یقینی بنائیں کہ آپ ضروری فونٹس اپنی fonts.css فائل میں شامل کریں، اور اپنی src/docs/styles/docs-global.css فائل میں font-family پراپرٹی اپ ڈیٹ کریں۔

Info

آپ کو اپنا فونٹ src/docs/layouts/BaseHead.astro کمپونینٹ میں بھی پری لوڈ کرنا چاہیے، بالکل Inter فونٹ کی طرح۔

---
import InterVariable from "@fontsource-variable/inter/files/inter-latin-wght-normal.woff2";
---

<link rel="preload" href={InterVariable} as="font" type="font/woff2" crossorigin="anonymous" />