آموزش سفارشی سازی قالب وردپرس

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

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

با سفارشي سازي عملکرد و کارآیی قالب وردپرس بهبود مي يابد  و ویژگی های زائدي که زمان بارگذاری سایت را كند مي كند حذف مي شود.

ابتدايي ترين بخش سفارشي سازي وردپرس بسته به موضوعی دارد که انتخاب مي كنيد و تغییراتي كه از طریق آن پنل سايت وردپرسي خودرا سفارشی سازی مي كنيد.

برای شروع سفارشی سازی قالب وردپرس ، ابتدا به بخش  نمایش » سفارشی سازی (Appearance » Customize) بروید.

در صفحه باز شده ، می توانید قالب وردپرس خود را در ليستي از گزینه های موجود ويرايش كنيد و بعد از تغيير پیش نمایش زنده از سایت خود را مشاهده كنيد.

همچنين صفحه سفارشی سازی به شما امکان می دهد عنوان سایت خود را نيز اصلاح کنید برای انجام این کار ، وارد تنظیمات هویت سایت ( Site Identity ) شويد و عنوان خود را تغییر دهید سپس روي دكمه  انتشار کلیک کنید.

همچنين مي توانيد تصویر هدر ، رنگ ، CSS اضافی و موارد دیگر را نيز تغيير دهيد و  برای ذخیره تغییرات بر روی انتشار کلیک کنید.  

گزینه های سفارشی سازی قالب وردپرس

• اضافه كردن قابلیت هایی به طرح زمینه اي خود از طريق نصب پلاگین
• با استفاده از Customizer در صفحه مدیریت وردپرس مي توان  عنوان ، فونت ، رنگ ها و طرح كلي را سفارشی كرد.
• استفاده از ویژگی های  صفحه سازها برای شخصی سازی قالب سایت
• برای شخصی سازی سایت خود و همچنین گزینه های سفارشی سازی مناسب مي توانيداز تم های موجود وردپرس استفاده کنید.
• براي ويرايش كد قالب مي توان از طریق ویرایش فایل ها ، طراحي هاي جديدي خلق كرد.

روش هاي شخصی سازی قالب وردپرس

سفارشی سازی قالب از طریق وردپرس

بعضی اوقات اصلاً نیازی به سفارشی کردن قالب وردپرس نيست و تنها نصب  پلاگین كفايت مي كند. همانطور كه مي دانيد پلاگین های وردپرس قابلیت های اضافی سفارشي سازي از قبيل نحوه نمایش سايت و محتوا را دارند.

از طریق صفحه مدیریت وردپرس نيز مي توان قالب وردپرس را براساس طراحي مورد نظر شخصی سازی كرد،ساده ترین روش برای شخصی سازی قالب وردپرس استفاده از WordPress Customizer است كه از طريق دو روش زير قابل دسترسی است:

• هنگام مشاهده سایت خود (هنگام ورود به سیستم) ، روی پیوند سفارشی سازی  در نوار مدیریت در بالای صفحه کلیک کنید.
• در صفحه مدیریت ، روی Appearance > Customize یا همان مسیر نمایش و بعد گزینه سفارشی سازی در پنل مدیریت وردپرس کلیک کنید .

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

شخصی سازی پوسته وردپرس از طریق تم (theme)

اكثر تم هاي وردپرس داراي  گزینه های سفارشی سازی زیادی از قبيل تصویر هدر ، شبکه های اجتماعی ، رنگ دسته ها ، طراحي برگه ها و گزینه های طراحی ديگر است.

براي اين منظور از طریق Appearance> Theme Editor  گزینه Theme Editor را انتخاب كنيد و پرونده و فايل هاي قالب خود را مستقیماً ویرایش کنید.

توجه داشته باشيد به منظور تغيير فايل هاي قالب خود از طريق  نوشتن CSS یا PHP بايد از ویرایشگر کد و بهترین ویرایشگرهای HTML رایگان استفاده كرد.

همچنين قالب  Divi  دارای گزینه های سفارشی سازی است که به شما امکان می دهد به اساني  قالب را سفارشي سازي كنيد.

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

سفارشی کردن قالب وردپرس از طریق افزونه ها

افزونه های صفحه ساز رابط كاربري ساده اي دارند و امکان ايجاد طرح هاي ساده و زيبايي را به آساني ايجاد مي كنند.یکی از معروف ترین صفحه سازها Elementor است ، كه به شما این امکان را می دهد پست ها و صفحات خود را تنها با کشیدن و رها کردن ویرایش کنید و طراحي هاي منحصر به فردي ايجاد کنيد. ویژوال کامپوزر نیز یکی دیگر از این افزونه هاست که شما می توانید به سادگی قالب وردپرس خود را سفارشی و شخصی سازی کنید.  

ویرایش و سفارشی سازی با کد قالب

ویرایش كدهاي CSS و / یاPHP  راحت ترين گزينه سفارشی سازي قالب وردپرس است. اولین قدم برای ویرایش قالب وردپرس دانستن پرونده های قابل ويرايش تم است.

از طريق ابزارWordPress Chrome DevTools مي توانيد كدهاي سايت خود را مشاهده كنيد.

همچنين هر قالب وردپرس را مي توان از طريق كد  CSS  وphp طرح بندی ، فونت ها ، رنگ ها و موارد دیگر را به صورت حرفه اي سفارشي سازي كرد.

در پوشه wp-content  وردپرس پوشه ای به نام themes قرار دارد  این پوشه ها حاوی سه موضوعی هستند که وردپرس به طور پیش فرض با آنها قابل مشاهده مي شود.

  توجه داشته باشید پوشه ای به نام customtheme نیز وجود دارد كه مي توانيد تم وردپرس خود را از ابتدا ایجاد كنيد دو پرونده خالی در به نام هاي  index.php و style.css  ايجاد كنيد.

• style.css  فایلي كه در آن مي توانيد ظاهر تم خود را سفارشي سازي كنيد.
• index.php  از طريق اين فایل سفارشي سازي کلی موضوع صفحه اصلی سايت صورت مي گيرد.
• header.php  اين فابل به شما امکان می دهد مكاني را برای نگهداری اطلاعات مهم در مورد وب سایت خود در قسمت <head> و همچنین برچسب های <html> ، <body>  پيدا كنيد.
• footer.php  اين فايل تغييراتي در پاورقی سايت ايجاد مي كند.
• توابع php  به شما این امکان را می دهد تا به طور پیش فرض وردپرس را تغيير دهيد.

سفارشی سازی از طریق پرونده های قالب

هر قالبي داراي فایل archive.php است که برای ويرايش صفحات بایگانی در دسته ها و برچسب ها استفاده می شود ، باز هم تاكيد مي شود مراقب ویرایش فایل ها باشید و ابتدا اين تغييرات را بر روی یک سایت كاذب آزمایش كنيد.  

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

از طريق تم کودک (child theme) به راحتي مي توان قالب وردپرس را مستقیماً ویرایش و به روز كرد. ایجاد یک تم کودک شامل چهار مرحله زير است:

1. یک پوشه جدید در wp-content / themes ایجاد کنید .
2. در آن پوشه ، یک شیوه نامه ایجاد کنید كه به وردپرس بگوید این یک تم کودکانه یا child theme است.
3. نسخه هایی از پرونده هایی را که می خواهید ویرایش کنید به طرح زمینه کودک اضافه کنید و آنها را ویرایش کنید.
4. سپس طرح زمینه کودک را در سایت خود فعال کنید.

نكات مهم شخصی سازی پوسته وردپرس

سفارشی سازی بدون ویرایش کد

سفارشی سازی بدون كد ایمن تر خواهد بود زيرا در صورت آشنا نبودن با CSS و PHP سايت كلا دچار اخلال مي شود.

استفاده از سایت کاذب برای ایجاد تغییرات

اگر قصد سفارشي سازي از طريق ويرايش کد يا ايجاد تم کودک را داريد بهتر براي از بين نرفتن اطلاعات سايت اصلي سايت كاذبي را براي آزمون و خطا ايجاد كرده و ويرايش كدها را در آن انجام دهيد.

استفاده از سرویس های کنترلی برای ویرایش قالب

برای پیگیری تغییرات طرح قالب خود بهتر از سرويس هاي كدنويسي قالب استفاده كنيد، سرویس GitHub گزينه خوبي است .

بررسی سازگاری قالب با دسکتاپ و موبایل

هر تغییرو سفارش سازي باید روی تلفن همراه و دسک تاپ نيز قابل مشاهده شود.با توجه به اینکه تعداد افراد بیشتری به اینترنت از طریق تلفن همراه وصل مي شوند ، هر تغییری در طرح قالب باید سازگار با موبایل و دسك تاپ باشد تا بر رتبه بندی سايت درموتور جستجو  تأثیر منفی نگذارد.

براي اين منظور می توانید از ابزارهايي مانند BrowserStack استفاده کنید.

تاثیر سفارشی سازی بر قابلیت دسترسی افراد

هرگونه تغییر در طرح قالب باید برای کاربران دارای معلولیت یا اختلالات حسی قابل دسترسی باشد همانطور كه مي دانيد طرح های رنگی و اندازه فونت ممكنه بر روي افراد تاثير بگذارد و خواندن یا تعامل آنها با سایت را مشكل ساز کند.

پایبندی به استانداردهای کدگذاری وردپرس

اگر کدي را قالب ويرايش و شخصي می کنید و یا اگر تم کودک ایجاد كرديد ، باید مطمئن شوید کد با استانداردهای کدگذاری وردپرس مطابقت داشته باشد.

این استانداردها برای اطمینان از سازگاری و کیفیت کد و جلوگیری از بهم ریختگی سايت بايد درنظر گرفته شود. كدنويسي PHP ، CSS ; و JavaScript استانداردهایی دارد كه با کمی وقت و دانش بايد به درستي در سايت قرار گيرند.

شخصی سازی قالب وردپرس از طريق Live Customizer

روش های مختلفی برای شخصی سازی وب سایت وجود دارد كه يكي از آنها WordPress Live Customizer  مي باشد اين گزينه به شما امکان می دهد عناصر مختلف تم خود را تنها با یک کلیک شخصی سازی کنید.

Live Customizer  ساده ترین روش شخصي سازي است و به شما امکان می دهد بدون کدنويسي بسیاری از گزینه هاي قالب و طرح بندي وردپرس را تغییر دهید.

براي اين منظور در ابتدا با كليك روی دکمه سفارشی سازی یا Customize به صفحه داشبورد » نمایش » سفارشی سازی یا Dashboard > Appearance > Customize بروید.

با باز شدن گزينه WordPress Live Customizer  مي توانيد تنظیمات بصری اصلی وب سایت خود و همچنین منوها و ابزارک ها را ویرایش کنید و مواردي از قبيل زير را تغيير دهيد:

• هویت سایت

در این برگه می توانید عنوان و برچسب وب سایت خود را انتخاب کنید.

• رنگ پس زمینه

در این بخش می توانید رنگ پس زمینه سايت خود را تغيير دهيد.

• تصویر سربرگ

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

• تصویر پس زمینه

این گزینه به شما امکان می دهد پس زمینه وب سایت خود را با تصویر انتخابي ويرايش کنید.

• منوها و ابزارک ها

در اين گزينه می توانید سلسله مراتب منوها را تنظیم کرده و ابزارک ها را به صورت ویجت اعمال کنید.

همچنین می توانید منوها و ابزارک ها را در داشبورد وردپرس مدیریت کنید ( Appearance > Menus and Appearance > Widgets ).

• پیش فرض صفحه اول

این گزینه مشخص می کند که آیا درصفحه اول سايت آخرین پست های وبلاگ نمایش داده می شود ياخير این گزینه در بخش  تنظیمات> خواندن <داشبورد قابل مشاهده است.

• اطلاعات تماس

در این برگه می توانید آدرس ، ایمیل ، ساعات کار و سایر اطلاعات تماس خود را مشخص کنید.

• گزینه های مربوط به رنگ و فونت

برگه دیگری که نمی توان آن را نادیده گرفت “Fonts & Colors” نام دارد كه با مراجعه به داشبورد و رفتن به قسمت Appearance> Fonts & Colors می توانید به آن دسترسی پیدا کنید و طرح های رنگی و ترکیب فونت های دلخواه را برروي وب سایت خود ایجاد و ويرايش کنید.

به یاد داشته باشید همیشه می توانید وب سایت خود را به سادگی و با فشار دادن دکمه Reset به تنظیمات پیش فرض بازگردانید .