افزودن کد به وردپرس : ۳ روش افزودن کد سفارشی PHP و CSS

در آموزش‌های وردپرسی که تغییراتی با کد ایجاد می‌کنند، از ما خواسته می‌شود تا کدهایی را در پوسته (قالب) سایت خود قرار دهیم. در این آموزش یاد می‌گیریم چطور کدهای سفارشی را به وردپرس اضافه کرده و با ۳ روش‌ اصلی افزودن کد به وردپرس آشنا خواهیم شد.

بسیاری از ما در ابتدای کار خود، از پوسته‌های آماده برای راه‌اندازی سایت استفاده می‌کنیم. حتی گاهی ممکن است به دلیل خوب بودن پوسته، تا مدت‌ها از آن‌ها استفاده کنیم.

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

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

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

چگونه کدهای سفارشی به وردپرس اضافه کنیم ؟

هنگام افزودن کد به وردپرس یا قالب، اکثراً با دو نوع کد سروکار داریم:

• کدهای PHP
• کدهای CSS

در ادامه ابتدا روش افزودن کدهای PHP و CSS به وردپرس را خواهیم آموخت و در انتها با یک روش جامع و حرفه‌ای برای افزودن همه کدها به نام پوسته فرزند آشنا می‌شویم..

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

اگر بخواهیم کدهای سفارشی را به طور مستقیم در پوسته وردپرس اضافه کنیم، ممکن است با ۳ مشکل اساسی مواجه هستیم:

1. پس از به‌روز‌رسانی قالب وردپرس، تمام تغییرات ما از بین رفته و باید مجدداً کدها را به آن اضافه کنیم.
2. ممکن است در هنگام ویرایش فایل‌ها، به اشتباه کدهای قبلی را تغییر داده یا حذف کنیم؛ در این صورت سایت ما با خطا مواجه خواهد شد.
3. برای هر بار تغییر دادن کدها، نیاز است به ویرایش فایل‌های مختلف پوسته بپردازیم!

افزودن کد PHP به وردپرس

برای افزودن کد PHP به پوسته وردپرس سه راه‌حل داریم:

• استفاده از افزونه Code Snippet
• ایجاد از افزونه اختصاصی خودمان
• استفاده از پوسته فرزند

استفاده از افزونه Code Snippet

افزونه Code Snippet معروف‌ترین افزونه برای افزودن کدهای سفارشی به وردپرس است. این افزونه به سادگی به شما اجازه می‌دهد هر نوع کدی را در قالب PHP به قالب خود اضافه کنید.

در حقیقت برای افزودن هر قطعه کدی به فایل functions.php می‌توان از این افزونه کمک گرفت.

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

پس از فعال‌سازی آن، یک گزینه به منوی پیشخوان شما به نام Snippets اضافه خواهد شد. با کلیک بر روی Add New وارد صفحه افزودن یک قطعه کد جدید خواهید شد.

این صفحه از پنج بخش مختلف تشکیل شده است:

• بخش عنوان: می‌توانید یک عنوان برای قطعه کد خود تعریف کنید تا بعداً بتوانید آن را راحت‌تر پیدا کرده و آن را ویرایش کنید.
• بخش کد: قطعه کد PHP خود را باید در این باکس بنویسید.
• تنظیمات اجرا: این تنظیمات به شکل دکمه‌های رادیویی در پایین باکس کد قرار گرفته‌اند. به وسیله این تنظیمات می‌توانیم محل اجرا کد و اولویت آن را مشخص کنیم.
• توضیحات کد: در این بخش می‌توانیم توضیحاتی در مورد قطعه کد یا کدهایی که به وردپرس اضافه کردیم بنویسیم. این توضیحات فقط برای خودمان نمایش داده می‌شود و به ما در ویرایش‌های بعدی کمک خواهد کرد.
• برچسب‌ها (Tags): می‌توانیم برای هر قطعه کد، یک برچسب تعیین کنیم. اگر تعداد کدهای شما (همان Code Snippetها) زیاد است، با تعریف برچسب‌های مرتبط، می‌توانیم آن‌ها را دسته‌بندی کنیم. چیزی بشیه به برچسب در وردپرس که فقط برای مدیران کاربرد دارد.

مراحل افزودن کد PHP به وردپرس

فرض کنید می‌خواهیم کد تغییر نام ایمیل وردپرس را به سایت خود اضافه کنیم. ابتدا عنوان و کد مورد نظر خود را اضافه می‌کنیم.

سپس وضعیت اجرای کد را مشابه تصویر زیر تنظیم می‌کنیم.

• اجرا در همه‌جا: کد شما در هر بار بارگذاری تمام صفحات اجرا خواهد شد.
• گزینه اجرا فقط در مدیریت: کدها فقط در هنگام بارگذاری صفحات مدیریتی (پیشخوان وردپرس) اجرا می‌شوند.
• اجرا فقط در سمت کاربر: کدها فقط در محیط Frond End سایت اجرا می‌شوند.
• اجرا فقط یک‌بار: پس از تعریف کدها، فقط یک‌بار فراخوانی می‌شوند.

در انتها نیز توضیحات کد را نوشته و برچسب‌های مرتبط را تنظیم می‌کنیم. سپس با کلیک روی «Save Changes and Active» قطعه کد خود را ذخیره و اجرا خواهیم کرد.

یکی از مزیت‌های خوبی که افزونه Code Snippet دارد، این است که تمام قطعه کدها را به صورت دسته‌بندی شده در پیشخوان وردپرس به ما نمایش می‌دهد. با کلیک روی آیکون آبی رنگ، می‌توان آن قطعه کد را غیرفعال کرد.

از بخش تنظیمات افزونه می‌توانید نوع ویرایشگر و یکسری تنظیمات جزئی دیگر را تغییر دهید.

همچنین از بخش «درون‌ریزی» خواهید توانست تمام کدهایی که از بخش «برون‌بری» و از سایت دیگری خروجی گرفته‌اید را وارد سایت خود کنید. عملکرد آن دقیقاً شبیه ابزار درون ریزی وردپرس است.

افزودن کد با افزونه اختصاصی سایت

یکی از روش‌هایی که ممکن است برایتان جذاب باشد، ایجاد یک افزونه اختصاصی برای اعمال تغییراتتان است.

برای این کار، می‌توان یک پوشه به نام دلخواه در مسیر wp-content/plugins/ ایجاد کرد. درون آن نیز یک فایل با همان نام و فرمت .php ایجاد کنیم.

پس از فعال‌سازی افزونه اختصاصی خودتان، با مراجعه به «ویرایشگر افزونه» یا تغییر مستقیم فایل از درون File Manager هاست خود، خواهید توانست کدهای سفارشی خود را به سایت اضافه کنید.

اگر مایلید نوشته‌های مرتبط را به سایتتان اضافه کنید، آموزش نمایش مطالب مرتبط در وردپرس با افزونه و با کد را ببینید.

افزودن کد CSS به وردپرس

کدهای CSS برای زیباسازی یا تغییر ظاهر سایت استفاده می‌شوند. یکی از راه‌های افزودن کد CSS به قالب سایت استفاده از قطعه کد زیر به functions.php یا افزونه Code Snippet است.

<?php
add_action( 'wp_head', function () { ?>
<style>

	/* write your CSS code here */

</style>
<?php } );

اما روشی ساده‌تر و بهینه‌تر هم وجود دارد:

استفاده از سفارشی‌سازی پوسته

در منوی پیشخوان وردپرس، در منوی «نمایش» > «سفارشی‌سازی» می‌توانیم برخی تنظیمات مربوط به ظاهر و نمایش پوسته خود را تغییر دهیم. آخرین بخش ابزار سفارشی‌ساز، «CSS اضافی» است.

با انتخاب این گزینه، وارد بخشی می‌شویم که یک باکس کد وجود دارد. هر کدی که در این باکس نوشته و سپس آن را ذخیره کنیم، در پوسته ما اعمال می‌شود. به همین سادگی!

این بخش به ما امکانات بیشتری نیز می‌دهد تا بتوانیم تغییرات ساختاری و ظاهری بدون کدنویسی در سایت ایجاد کنیم. در آموزش زیر، آن را به‌طور کامل بررسی کرده‌ام:

افزودن کد به وردپرس با پوسته فرزند (Child Theme)

یک روش حرفه‌ای برای افزودن کد به وردپرس استفاده از پوسته فرزند است. بحث پوسته فرزند طولانی و خارج از بحث ماست. اما اگر پوسته‌ای که در اختیار دارید، یک نسخه Child Theme هم دارد، می‌توانید از این روش استفاده کنید.

به طور خلاصه، پوسته فرزند، یک پوسته سفارشی‌سازی شده و برگرفته از پوسته اصلی است.

شما می‌توانید کدهای PHP خود را درون فایل functions.php و کدهای CSS سفارشی خود را درون style.css پوسته فرزند قرار دهید.

پوسته فرزند از نظر ساختاری یک پوسته جداگانه است. اما خصوصیات و تنظیمات خود را از پوسته والد خود می‌گیرد. بنابراین در پس از به‌روز‌رسانی پوسته اصلی، تغییرات و کدهای شما در قالب فرزند از بین نخواهد رفت.

در آموزش زیر نحوه ساخت پوسته فرزند برای همه قالب‌ها را در ۳ مرحله یاد می‌گیریم:

جمع‌بندی: افزودن کد سفارشی به وردپرس

در این مقاله با سه راه‌حل افزودن کد اختصاصی به وردپرس آشنا شدید. این که کدام روش بهترین روش است، بستگی به نحوه و میزان استفاده شما از این ویژگی دارد.

از نظر منطقی، برای افزودن کدهای کوتاه CSS بهتر است از ابزار سفارشی‌ساز وردپرس استفاده کنیم.

برای افزودن کدهای PHP به وردپرس نیز، هم روش افزونه Snippet و هم روش افزونه اختصاصی مناسب است. اگر میزان تغییرات شما زیاد بوده یا می‌خواهید کدهای مختلفی را بررسی کنید، ساده‌ترین روش استفاده از افزونه Code Snippet خواهد بود.

اگر تغییرات شما اساسی و نسبتاً زیاد است، پیشنهاد می‌کنم حتماً از پوسته فرزند در سایت خود استفاده کنید. در اینصورت، هیچ‌گاه نگران از بین رفتن کدهای خود نبوده و می‌توانید تغییرات بیشتری در پوسته خود ایجاد کنید.

امیدوارم از این آموزش استفاده کاربردی کرده باشید. اگر سؤال یا تجربه‌ای دارید، از بخش دیدگاه‌ها با ما و دوستانتان به اشتراک بگذارید.