vitepress/v1/assets/fa_reference_default-theme-layout.md.BYHnut1Y.js

import{_ as s,c as e,ag as i,o as t}from"./chunks/framework.C1C4sYC0.js";const c=JSON.parse('{"title":"طرح بندی","description":"","frontmatter":{},"headers":[],"relativePath":"fa/reference/default-theme-layout.md","filePath":"fa/reference/default-theme-layout.md","lastUpdated":1734087948000}'),l={name:"fa/reference/default-theme-layout.md"};function n(o,a,h,p,d,r){return t(),e("div",null,a[0]||(a[0]=[i(`<h1 id="layout" tabindex="-1">طرح بندی <a class="header-anchor" href="#layout" aria-label="Permalink to &quot;طرح بندی {#layout}&quot;">​</a></h1><p>می‌توانید طرح صفحه را با تنظیم گزینه <code>layout</code> در <a href="./frontmatter-config">frontmatter</a> صفحه انتخاب کنید. سه گزینه طرح وجود دارد، <code>doc</code>، <code>page</code> و <code>home</code>. اگر هیچ چیز مشخص نشده باشد، صفحه به عنوان صفحه <code>doc</code> در نظر گرفته می‌شود.</p><div class="language-yaml vp-adaptive-theme"><button title="کپی کد" class="copy"></button><span class="lang">yaml</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">---</span></span>
<span class="line"><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">layout</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">doc</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">---</span></span></code></pre></div><h2 id="doc-layout" tabindex="-1">طرح Doc <a class="header-anchor" href="#doc-layout" aria-label="Permalink to &quot;طرح Doc {#doc-layout}&quot;">​</a></h2><p>گزینه <code>doc</code> طرح پیش‌فرض است و تمام محتوای Markdown را به &quot;نمایشگاه&quot; درست می‌کند. این با پوشاندن کل محتوا در داخل کلاس css <code>vp-doc</code> کار می‌کند و استایل‌های لازم را بر روی عناصر زیرش اعمال می‌کند.</p><p>تقریباً همه عناصر عمومی مانند <code>p</code> یا <code>h2</code> استایل‌های خاصی دارند. بنابراین، به یاد داشته باشید که اگر HTML سفارشی‌ای درون محتوای Markdown اضافه کنید، این استایل‌ها روی آن‌ها هم اعمال خواهند شد.</p><p>این طرح ویژگی‌های خاص مستندسازی زیر را فراهم می‌کند. این ویژگی‌ها فقط در این طرح فعال هستند.</p><ul><li>پیوند ویرایش</li><li>پیوند قبلی و بعدی</li><li>ساختار</li><li><a href="./default-theme-carbon-ads">تبلیغات Carbon</a></li></ul><h2 id="page-layout" tabindex="-1">طرح Page <a class="header-anchor" href="#page-layout" aria-label="Permalink to &quot;طرح Page {#page-layout}&quot;">​</a></h2><p>گزینه <code>page</code> به عنوان &quot;صفحه خالی&quot; در نظر گرفته می‌شود. Markdown همچنان تجزیه و تحلیل می‌شود و تمامی <a href="./../guide/markdown">توسعه‌های Markdown</a> به عنوان طرح <code>doc</code> کار می‌کنند، اما هیچ استایل پیش‌فرضی به آن اعمال نمی‌شود.</p><p>طرح صفحه به شما این امکان را می‌دهد که همه چیز را به دلخواه خود شخصی‌سازی کنید بدون این که طرح ویت‌پرس بر روی مارک‌آپ تاثیر بگذارد. این کار بسیار مفید است زمانی که می‌خواهید صفحه سفارشی خود را ایجاد کنید.</p><p>توجه داشته باشید که حتی در این طرح، نوار کناری نیز نمایش داده می‌شود اگر صفحه دارای پیکربندی نوار کناری مطابق باشد.</p><h2 id="home-layout" tabindex="-1">طرح Home <a class="header-anchor" href="#home-layout" aria-label="Permalink to &quot;طرح Home  {#home-layout}&quot;">​</a></h2><p>گزینه <code>home</code> صفحه &quot;خانه&quot; قالب‌بندی می‌کند. در این طرح، می‌توانید گزینه‌های اضافی مانند <code>hero</code> و <code>features</code> را برای دلخواه‌سازی محتوا تنظیم کنید. لطفاً <a href="./default-theme-home-page">صفحه پیش‌فرض: صفحه خانه</a> را برای اطلاعات بیشتر مشاهده کنید.</p><h2 id="no-layout" tabindex="-1">بدون طرح <a class="header-anchor" href="#no-layout" aria-label="Permalink to &quot;بدون طرح {#no-layout}&quot;">​</a></h2><p>اگر نمی‌خواهید هیچ طرحی داشته باشید، می‌توانید با گذراندن <code>layout: false</code> از frontmatter، از این گزینه استفاده کنید. این گزینه مفید است اگر صفحهٔ نخستی کاملاً قابل تنظیم (بدون هیچ نوار کناری، نوار ناوبری یا پاورقی به صورت پیش‌فرض) را می‌خواهید.</p><h2 id="custom-layout" tabindex="-1">طرح سفارشی <a class="header-anchor" href="#custom-layout" aria-label="Permalink to &quot;طرح سفارشی {#custom-layout}&quot;">​</a></h2><p>همچنین می‌توانید از یک طرح سفارشی استفاده کنید:</p><div class="language-md vp-adaptive-theme"><button title="کپی کد" class="copy"></button><span class="lang">md</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">---</span></span>
<span class="line"><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">layout</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">foo</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">---</span></span></code></pre></div><p>این دستور به دنبال یک کامپوننت به نام <code>foo</code> ثبت شده در محیط است. به عنوان مثال، می‌توانید کامپوننت خود را به صورت گلوبال در <code>.vitepress/theme/index.ts</code> ثبت کنید:</p><div class="language-ts vp-adaptive-theme"><button title="کپی کد" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> DefaultTheme </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;vitepress/theme&#39;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> Foo </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;./Foo.vue&#39;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">export</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> default</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  extends: DefaultTheme,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">  enhanceApp</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({ </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">app</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }) {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">    app.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">component</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;foo&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, Foo)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">  }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div>`,21)]))}const u=s(l,[["render",n]]);export{c as __pageData,u as default};