فایل اصلی استایل قالب وردپرس یا style.css :

در این قسمت از آموزش های طراحی قالب وردپرس با فایل اصلی استایل قالب وردپرس یا همان style.css موجود در دایرکتوری اصلی یک قالب وردپرس، آشنا خواهیم شد.

شما با توضیحات هدر موجود در فایل style.css قالب وردپرس یا همان header comment و اجزا ضروری آن، آشنا می گردید و یاد می گیرید چگونه از آن در قالب وردپرس استفاده نمایید. بدون وجود فایل اصلی استایل قالب وردپرس، پوسته شما در هسته وردپرس لود نخواهد شد.

فایل اصلی استایل قالب وردپرس

فایل اصلی استایل قالب وردپرس  چیست؟

فایل اصلی استایل قالب وردپرس، جز ۲ فایل اصلی می باشد که در صورت موجود نبودن آن در قالب وردپرس، قالب شما در داخل هسته وردپرس لود نخواهد شد. فایل اصلی استایل قالب وردپرس که در به صورت اجباری در هر تم وردپرس باید قرار داده شود، با نام style.css شناخته می شود و هر قالب وردپرس برای راه اندازی، حتما به آن نیاز دارد.

کنترل نحوه نمایش صفحات سایت شما (اعم از نحوه چینش و همین طور طراحی ظاهری آن) بر عهده فایل اصلی استایل قالب وردپرس می باشد.

محل قرار گیری فایل اصلی استایل قالب وردپرس کجاست؟

به جهت اینکه هسته وردپرس بتواند کل مجموعه فایل های یک قالب یا همان Template File های یک قالب را شناسایی نماید، لازم است تا فایل اصلی قالب وردپرس یا همان style.css قالب وردپرس، دقیقا در روت اصلی دایرکتوری یک قالب، قرار بگیرد. در صورتی که این فایل در یک ساب دایرکتوری در داخل قالب شما قرار بگیرد، قالب شما لود نخواهد شد.

برای لود کردن سایر فایل های استایل در قالب وردپرس از تابع های wp_register_style و wp_enqueue_style استفاده می شود که برای نحوه انجام این کار، می توانید به آموزش “نحوه قرار دادن فایل استایل در قالب وردپرس” مراجعه نمایید.

ساختار پایه فایل اصلی استایل قالب وردپرس به چه صورتی است؟

وردپرس برای شناساندن قالب به هسته وردپرس، از یک بخش با نام header comment در ابتدای فایل style.css استفاده می کند. این بخش که به صورت comment شده در ابتدای فایل style.css گذاشته می شود، دارای اطلاعات مربوط به یک قالب می باشد.

وجود این اطلاعات در هدر فایل style.css الزامی بوده و وردپرس برای نمایش اطلاعات مربوط به یک تم یا قالب در بخش پنل کاربری سایت و بخش نمایش قالب ها، از آن ها استفاده می نماید.

مثالی از هدر مورد نیاز در فایل style.css

مثال زیر، نمونه ای از یک هدر در ابتدای فایل style.css می باشد که مربوط به قالب دو هزار و هفده وردپرس می باشد.

/*
Theme Name: Twenty Seventeen
Theme URI: https://wordpress.org/themes/twentyseventeen/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Seventeen brings your site to life with immersive featured images and subtle animations. With a focus on business sites, it features multiple sections on the front page as well as widgets, navigation and social menus, a logo, and more. Personalize its asymmetrical grid with a custom color scheme and showcase your multimedia content with post formats. Our default theme for 2017 works great in many languages, for any abilities, and on any device.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentyseventeen
Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

توضیح در مورد شماره ورژن هر قالب وردپرس در فایل style.css

مخزن قالب های وردپرس، برای اینکه تشخیص دهد که ورژن جدیدی از قالب در دسترس است یا خیر، از یک شماره بعد از قسمت Version استفاده می کند.

در این بخش، توضیحات کوتاهی در مورد هریک از این بخش ها، بیان خواهیم کرد. در نظر داشته باشید، استفاده از بخش هایی که با ستاره مشخص شده اند، در توضیحات هدر اجباری بوده و نمی توانند حذف شوند.

  • Theme Name (*): نام قالب

  • Theme URI : آدرس url صفحه ای که کاربران می توانند به اطلاعات تکمیلی در مورد قالب مورد استفاده، دسترسی داشته باشند.

  • Author (*): نام شخص حقیقی یا سازمان که قالب را توسعه داده است.پیشنهاد می شود که در این بخش برای اطلاعات Author ای، از اطلاعات نام کاربری استفاده شود که در سایت wordpress.org استفاده شده است.

  • Description (*): توضیحات کوتاهی در مورد قالب

  • Version (*):  ورژن قالب که با فرمت ها X.X یا X.X.X نمایش داده می شود

  • License (*): مجوز های استفاده قالب

  • License URI (*): لینک مجوزهای قالب

  • Tags : کلمات یا عبارت هایی که به کاربران اجازه می دهند تا قالب خود را با فیتلر کردن تگ های این بخش پیدا کنند.

  • Domain Path : برای این استفاده می شود تا به وردپرس نشان دهد کجا می تواند به فایل های ترجمه قالب دسترسی داشته باشد (زمانی که قالب غیر فعال است) دایرکتوری پیش فرض برای آن languages می باشد.

فایل style.css برای یک Child Theme

اگر شما از Child Theme برای قالب خود استفاده می کند، هدر فایل style.css موجود در این فایل، لااقل باید شامل تکه کدهای زیر باشد. برای اطلاعات بیشتر در مورد child theme ها می توانید به آدرس های پایین صفحه مراجعه نمایید.

/*
Theme Name: My Child Theme
Template: Twenty Seventeen
*/

راهنما برای مطالعه بیشتر:

شما می توانید از لینک های زیر برای مطالعه بیشتر استفاده نمایید:

راهنما برای خواندن سایر مقالات سایت به صورت دسته بندی شده:

شما می توانید از طریق لینک های کاربردی زیر به سایر مقالات سایت که کاملا بصورت طبقه بندی شده وجود دارد، مراجعه نموده و از آن ها استفاده کنید:

بازگشت به صفحه بلاگ وبمستر وردپرس