شناخت سلسله مراتب پوسته وردپرس به ما کمک میکند تا در توسعه و خطایابی قالب سایت سریعتر باشیم. در این آموزش ساختار فایلهای قالب وردپرس و سلسله مراتب اجرای آنها را بررسی میکنیم.
شاید یک وبمستر، توسعهدهنده وردپرس یا در ابتدای راه یادگیری ایجاد پوسته wordpress باشید. این آموزش بهنوعی یک اصول اولیه برای درک ساختار پوستهها و نحوه اجرای آنهاست.
وقتی درک مناسبی از این ساختار و سلسله مراتبش داشته باشید، علاوه بر توسعه، در خطایابی تغییر پوستهها مهارت پیدا میکنید.
فهرست محتوای آموزش
ساختار پایه پوسته وردپرس
اگر با نصب پوسته وردپرس آشنا باشید، میدانید که همه پوستهها در مسیر wp-content
در فولدر themes
قرار میگیرند. ساختاری که در این جلسه بررسی میکنیم، فایلهای موجود در فولدر هر پوسته هستند.
هر پوسته فایلهای زیادی دارد اما تنها ۲ تای آنها برای اجرای قالب ضروری است! index.php برای ساختار قالب و style.css که کدهای css درون آن قرار میگیرد.
اگر بخواهیم index.php
را به چهار فایل کوچکتر برای مدیریت بهتر کدها تقسیم کنیم، عموماً تقسیمبندی زیر استفاده میشود:
- درون index.php کدهای بدنه اصلی سایت قرار میگیرد. این بدنه معمولاً در هر صفحه محتوای جدید را تولید میکند.
- sidebar.php حاوی کدهای نوار کناری (یا همان سایدبار) سایت است.
- header.php کدهای هدر (سربرگ) نظیر تگ
<head>
و منوهای بالای سایت را شامل میشود. - در footer.php کدهای مربوط به فوتر سایت (نظیر لینکهای دسترسی سریع یا کپی رایت) قرار میگیرد.
احتمالاً حدس میزنید که سه فایل آخر معمولاً کدها و ساختارهای ثابتتری نسبت به index دارند. چون محتوایی از سایت را نمایش میدهند که ثابت یا شبیه به هم است. مثلاً منوها در تمام صفحات بهطور مشابه تکرار میشوند.
این فایلها مشابه فراخوانی فایل با include یا require در PHP با توابع مخصوص وردپرس در index.php فراخوانی میشوند.
فایلهای پوسته وردپرس
علاوه بر دو فایل اصلی، قالبهای وردپرس ممکن است بنا به نیاز، فایلهای دیگری نیز داشته باشند. این فایلها به واسطه نامشان مشخص میشوند.
برخی از این نامها در ساختار پوسته وردپرس استفاده میشوند اما برخی دیگر بهدلخواه توسعهدهنده ایجاد و استفاده میشوند.
فایلهای رایجی که در قالب وردپرس وجود دارند و کاربردشان را در جدول زیر برایتان آوردهام:
نام فایل در پوسته | کاربرد قالب یا کدهای آن |
---|---|
functions.php | قطعه کدهای PHP در آن قرار میگیرد. این قطعه کدها در همه صفحات اجرا میشوند. تعریف توابع PHP، فیلترها و اکشن وردپرس از جمله کدهایی است که در کد فانکشن قالب قرار میگیرند. |
home.php و front-page.php | پوسته صفحه اصلی (اگر مایلید صفحه اصلی ظاهر متفاوتی از index داشته باشد) |
single.php | ساختار و قالب نوشتههای وردپرس |
page.php | قالب صفحه برگهها |
category.php | قالب صفحههای نمایش دستهبندی |
tag.php | پوسته نمایش برچسبها |
comments.php | طراحی و ساختار دیدگاهها در انتهای نوشتهها |
author.php | بایگانی نویسندهها |
date.php | بایگانی زمانی نوشتهها |
search.php | قالب صفحه نتایج جستجو |
404.php | قالب صفحه خطای 404 |
سلسله مراتب قالب وردپرس
فایلهای قالب وردپرس دارای یک سلسله مراتب برای اجرا هستند.
مثلاً فرض کنید قرار است یک post در سایت نمایش داده شود. post میتواند هر نوع پست تایپی (نظیر رسانهها، نوشتهها، برگهها و …) باشد. وردپرس به ترتیب کارهای زیر را انجام میدهد:
- در ابتدا وردپرس سعی میکند قالبی (فایل حاوی کد صفحهای) که برای آن post خاص وجود دارد را بارگذاری کند. این مورد از روی نامک پست مشخص میشود.
- درصورتیکه این فایل وجود نداشت، به دنبال قالبی مخصوص آن پست تایپ میگردد؛ مثل قالب مخصوص صفحه محصول.
- اگر این فایل وجود نداشت تلاش میکند قالب عمومی برای postها را اجرا کند. (که آن را با نام
single.php
میشناسیم) - باز هم اگر چنین فایلی نبود، به دنبال
singular.php
میگردد. - در انتها اگر هیچ قالب مخصوصی وجود نداشت، از
index.php
برای نمایش محتوا استفاده میکند.
سلسله مراتب اجرای قالب post وردپرس
اگر توضیحات بالا را به اسم فایلهای ساختار پوسته وردپرس خلاصه کنم، به ترتیب میتوانیم فایلهایی با نامهای مشابه زیر داشته باشیم:
ساختار نام فایل php | محل کاربرد |
---|---|
single-{post-type}-{slug} | پست با نامک {slug} از نوع {post-type} |
single-{post-type} | پستهای نوع {post-type} مثلاً single-product.php برای صفحه نمایش محصول است. |
single.php | پوسته پیشفرض برای همه postها |
singular.php | قالب پیشفرض برای همه محتواهای تکی (وقتی مستقیماً در صفحه محتوا هستیم) |
index.php | ساختار قالب پیشفرض در وردپرس |
برای هر صفحه دیگری نیز روند مشابهی طی میشود. مثلاً یک سلسله مراتب برای نمایش صفحات بایگانی یا archive داریم. همچنین برای نمایش pageها، دستهبندیها و برچسبهای وردپرس.
همهٔ این سلسله مراتب و یک تصویر از آن را میتوانید در صفحه مستندات توسعه قالب وردپرس ببینید. (اینجا)
سلسله مراتب category پوسته وردپرس
برای اینکه یک مثال دیگر را با هم بررسی کرده باشیم، سلسله مراتب اجرای قالب برای نمایش دستهبندی وردپرس مشابه زیر است:
category-{slug}.php
: قالب مخصوص دستهبندی با نامک مشخص- فایل
category-{id}.php
: پوسته دستهبندی با id مشخص category.php
: قالب عمومی برای نمایش همهٔ دستهبندیهاarchive.php
: قالب عمومی برای صفحات بایگانی در سایتindex.php
نکات ایجاد فایل های پوسته وردپرس
اگر در حال طراحی پوسته وردپرس هستید، میتوانید هر کدام از این فایلهای پیشنهادی در سلسله مراتبها را ایجاد کنید. اینکه کدام فایل را ایجاد کنید، بستگی به نیازمندیهای شما دارد. مثلاً اگر بخواهید نمایش یکی از دستهبندیهایتان متفاوت شود، میتوانید از حالت slug استفاده کنید.
اگر در حال توسعه وردپرس هستید، پیشنهاد میکنم پوسته اصلی را تغییر ندهید! به جایش یک child theme ایجاد کرده و هر تغییر یا فایل اضافه را در آن انجام دهید. اگر فایلی که در فرزند ایجاد میکنید در قالب اصلی باشد، آن فایل بازنویسی خواهد شد. آموزش ایجاد پوسته فرزند در وردپرس ایدههای خوبی به شما میدهد.
امیدوارم این آموزش در درک ساختار فایلهای پوسته وردپرس به شما کمک کرده باشد. اگر سؤالی دارید یا فایلی هست که در این ساختار گفته نشده از بخش دیدگاهها با ما در میان بگذارید. مجدد پیشنهاد میکنم که صفحه مستندات wp theme structure را بررسی کوتاهی داشته باشید.
این آموزش برای همیشه رایگانه! میتونید با اشتراکگذاری لینک این صفحه از ما حمایت کنید یا با خرید یه فنجون نوشیدنی بهمون انرژی بدید!
میخوام یه نوشیدنی مهمونتون کنم
سلام دوستان،
با تشکر مطالب خوب و آموزنده شما
بنده از ووکامرس استفاده میکنم سایت فروشگاهی دارم از یک قالب استفاده میکنم چندین دمو داره،،،
متاسفانه دمو انتخابی من یک مشکل داره اونم اینکه قیمت تخفیف خورده و قیمت قبلی رو باهم نمایش میده یعنی قیمت قبلی رو خط خورده نمایش نمیده،،، مشتری همیشه با دوتا قیمت مواجه میشه نمیدونه کدوم قیمت اصلی کالاهستش،،، باید بعد از افزودن به سبد خرید رو بزنه بعدش داخل سبد بدونه کدوم قیمت بوده،،،
من این مطلب رو به سازنده نتونستم بفهمونم ، میگفت دسترسی هاست و پیشخوان بده،،،
همین قالب در دمو دیگه اون مشکل رو نداره،،،
حالا مهندس،،،
میشه بفرمایید کدام پوشه داخل قالب مربوط به قیمت هستش ؟ یعنی کدام پوشه مربوط به کد نویسی قیمت محصول هستش ..من از دمو دیگه قالب بردارم جایگزین پوشه قالبم در هاست کنم که قیمتها درستنمایش داده بشه،،
ممنون میشم راهنمایی کنید،،،
آیا مربوط به پوشه ووکامرس در قالب هستش،،،
یا پوشه style.css،،،یا پوشه های دیگه؟
منظورم در هاست هستش ها مهندس،،
با تشکر
سلام
احتمالاً مشکلتون از cssها باشه و نه مستقیماً خود کد. چون هر دو رو داره نمایش میده ولی در ظاهر مشکل داره. بنابراین بهنوعی مربوط میشه به styleها.
پیشنهاد اینه که یه screenshot از محصولات خودتون که مشکل دارن و دقیقاً از همون موقعیت در دمو بگیرید و برای سازنده بفرستید تا متوجه بشن.
سپاس برای توضیحاتتون
خوشحالم که برات کاربردی بوده جناب صفری عزیز 🙂