آموزش افزودن کد به وردپرس

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

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

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

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

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

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

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

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

 

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

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

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

  • کدهای PHP
  • کدهای CSS
اگر از قالب اختصاصی خودتان استفاده می‌کنید، می‌بایست کدهای PHP را در فایل functions.php و کدهای CSS را به style.css پوسته خود اضافه کنید. این دو فایل به ترتیب به نام «توابع پوسته» و «شیوه‌نامه» شناخته می‌شوند.

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

 

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

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

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

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

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

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

بنر و آرم افزونه Code Snippet

بنر و آرم افزونه Code Snippet

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

پس از فعال‌سازی آن، یک گزینه به منوی پیشخوان شما به نام 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 است.

 

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

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

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

اگر وارد این بخش از مدیریت سایت شوید، آخرین بخش سفارشی‌ساز، «CSS اضافی» است.

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

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

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

 

افزایش سرعت وردپرس با 25 راه‌کار عملی

افزایش سرعت وردپرس با 25 راه‌کار عملی

 

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

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

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

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

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

 

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

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

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

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

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