آموزش طراحی قالب وردپرس استاندارد (بخش 1)

آموزش های زیادی برای طراحی قالب وردپرس در وب سایت های ایرانی وجود دارد اما قریب به اتفاق این آموزش ها، استانداردهای طراحی قالب وردپرس را در نظر نمی گیرند. از این رو تصمیم گرفتیم تا طی 20 پست آموزشی، نحوه طراحی قالب وردپرس استاندارد و ریسپانسیو را بررسی و یک قالب استاندارد طراحی کنیم. در پایان این مجموعه آموزش ها شما می توانید با استانداردهای طراحی قالب وردپرس آشنا شده و یک فریمورک کامل و جامع برای خودتان داشته باشید تا در طراحی هایتان فقط با تغییرات جزئی و استایل دهی قالب، طراحی را انجام دهید.

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

1فایل های لازم برای قالب وردپرس استاندارد

هر قالب استاندارد وردپرسی باید فایل ها و موارد زیر را داشته باشد.

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

2ساخت فولدر قالب

اولین کار و ساده ترین کار ساختن یک پوشه برای قالب وردپرسی شماست. داخل این پوشه همچنین می توانید چند پوشه دیگر، از جمله css برای قراردادن کدهای استایل، images، برای قراردادن تصاویر مورد استفاده در قالب، js برای قراردادن کدهای جاوااسکریپت و غیره نیز بسازید. فقط توجه نمایید که برای نامگذاری این پوشه ها از حروف کوچک لاتین استفاده نمایید.

پوشه قالب

3فایل style.css

فایل استایل وردپرس، اطلاعات قالب مثل نام و توضیحات قالب را در خود جای می دهد.

برای ساخت فایل استایل کافیست در ادیتور متن خود(مثلا Notepad Plus Plus) کد زیر را کپی نمایید و با نام style.css در داخل فولدر قالب ذخیرهنمایید.

در صورتی که آشنایی ابتدایی با زبان انگلیسی داشته باشید، قسمت عمده این کد برای شما قابل فهم خواهد بود. اطلاعاتی مثل نام قالب، آدرس قالب، نام طراح، آدرس سایت طراح، توضیحات قالب، نسخه، لایسنس و برچسب های قالب از جمله موارد اشاره شده در این قالب می باشند.

برای قالب های رایگان معمولا مطابق کد بالا از نسخه های مختلف لایسنس GPL استفاده می شود. برچسب های ذکر شده در این قالب برای قالب هایی که در مخزن وردپرس ثبت می شوند مفید خواهند بود و باعث جستجوی ساده تر قالب ها در مخزن وردپرس می شوند و برای قالب های تجاری علنا استفاده ای ندارد.

Text Domain برای قالب هایی که می خواهند از فایل زبان و ترجمه استفاده نمایند مورد استفاده قرار می گیرد و در آموزش های بعدی نحوه استفاده از آن توضیح داده می شود.

4تصویر اسکرین شات قالب

تصویر اسکرین شات قالب که در بخش مدیریت پوسته های پیشخوان وردپرس نمایش داده می شود باید ابعاد 4:3 داشته باشد اما اندازه استاندارد آن، همانطور که قالب های پیشفرض وردپرس از آن استفاده می کنند، 880 پیکسل عرض در 660 پیکسل ارتفاع می باشد.

اکنون فولدر قالب، فایل استایل و اسکرین شات قالب خود را ساخته اید.

محتویات فولدر قالب در پایان قسمت 1

جهت دریافت این فایل اینجاکلیک کنید.

برای مشاهده قسمت دوم این آموزش و نحوه ساخت فایل functions.php اینجا کلیک کنید.

سوال یا دیدگاه شما