آموزش نحوه اضافه کردن کد سفارشی در وردپرس

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

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

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

• افزایش امکانات سایت: با چند خط کد ساده می ‌توان ویژگی ‌هایی مانند غیرفعال‌ کردن برخی امکانات، افزودن دکمه، تغییر استایل ‌ها یا تغییر عملکردهای سایت را پیاده‌ سازی کرد.
• بهینه‌ سازی عملکرد سایت: به‌ جای استفاده از افزونه‌ های سنگین، می ‌توان کد مورد نیاز را مستقیماً وارد کرد که این کار باعث کاهش مصرف منابع و افزایش سرعت بارگذاری سایت می ‌شود.
• شخصی ‌سازی دقیق ‌تر: با کدنویسی سفارشی می ‌توان دقیقاً مطابق با نیاز و سلیقه، ظاهر و عملکرد سایت را تنظیم کرد، چیزی که شاید با تنظیمات آماده یا افزونه‌ ها ممکن نباشد.
• صرفه ‌جویی در هزینه ‌ها: به ‌جای خرید افزونه ‌های حرفه‌ای برای انجام تغییرات خاص، می ‌توان با چند کد ساده همان عملکرد را به ‌صورت رایگان اجرا کرد.
• کنترل کامل بر ساختار سایت: افزودن کد سفارشی به شما این امکان را می ‌دهد تا بدون محدودیت، عملکرد بخش‌ های مختلف سایت را تحت کنترل داشته باشید.

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

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

بیشتر بخوانید: معرفی برترین افزونه های “نظرات مشتریان” برای وردپرس

1- نحوه اضافه کردن کدهای سفارشی CSS به سایت وردپرس با افزونه WPCode

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

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

حال کافیست و روی دکمه «افزودن جدید» کلیک کنید تا اولین قطعه کد سفارشی خود را در وردپرس اضافه نمائید.

حال در صفحه ای که برای شما باز می شود می توانید قطعه کد از کتابخانه از پیش ساخته شده انتخاب کنید یا اینکه کد سفارشی خود را به دلخواه اضافه نمائید. برای افزودن کد سفارشی، بر روی دکمه “استفاده از قطعه” در زیر گزینه Add Your Custom Code کلیک کنید.

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

بیشتر بخوانید: آموزش اضافه کردن شورت کد به وردپرس | چگونه به وردپرس کد کوتاه یا shortcode اضافه کنیم؟

به عنوان مثال: در تصویر بالا، ما یک قطعه کد سفارشی را برای حذف شماره نسخه وردپرس از سایت آزمایشی خود اضافه کرده ایم:

function wpb_remove_version() {

return ”;

}

add_filter(‘the_generator’, ‘wpb_remove_version’);

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

اگر شما روش “درج خودکار” را انتخاب کنید، قطعه به طور خودکار در سایت شما درج و اجرا می شود. در واقع؛ شما می توانید به صورت خودکار قطعه کد را فقط در قسمت مدیریت وردپرس، در قسمت جلوی سایت خود یا در هر جا که می خواهید اجرا کنید. همچنین می توانید از گزینه پیش فرض Run snippet everywhere استفاده نمائید.

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

علاوه بر آن؛ با اسکرول بیشتر صفحه به سمت پایین، وارد بخش “اطلاعات پایه” می شوید. شما می ‌توانید هر چیزی را در اینجا اضافه کنید که به شما کمک کند متوجه شوید که این کد چه کار می‌ کند، کجا آن را پیدا کرده‌اید و چرا آن را به وب ‌سایت خود اضافه می‌ کنید.

شما همچنین می توانید برچسب ها را به قطعه کد خود اختصاص دهید. این قابلیت به شما کمک می کند تا قطعه کد خود را بر اساس قالب و عملکرد مرتب کنید.

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

بیشتر بخوانید: آموزش تغییر رنگ لینک در وردپرس | ساده و تصویری

در نهایت، می‌ توانید از بخش «Smart Conditional Logic»  برای نمایش یا پنهان کردن قطعه‌های درج شده خودکار براساس مجموعه‌ای از قوانین استفاده کنید.

پس از اینکه تغییرات خود را به صورت دلخواه انجام دادید، سوئیچ را از «غیرفعال» به «فعال» در گوشه بالا سمت راست تغییر داده و در نهایت روی دکمه «ذخیره قطعه» کلیک کنید.

تا اینجای مطلب ما شما را با نحوه افزودن CSS سفارشی به وردپرس آشنا کردیم. در ادامه سعی می کنیم شما را با مشکلات اضافه کردن کدسفارشی و همچنین مدیریت کدهای سفارشی بیشتر آشنا کنیم.

بیشتر بخوانید: خطای Syntax Error در وردپرس چیست؟ چگونه ارور سینتکس در وردپرس را رفع کنیم؟

2- اضافه کردن کد سفارشی در وردپرس با افزونه Code Snippets

یکی دیگر از روش ها برای اضافه کردن کد سفارشی در وردپرس استفاده از افزونه Code Snippets می باشد. این یکی از افزونه‌ های محبوب و کاربردی وردپرس است که به شما امکان می ‌دهد بدون نیاز به ویرایش فایل‌ های قالب یا افزونه ‌ها، کدهای PHP سفارشی را به سایت خود اضافه و مدیریت کنید. این افزونه در واقع جایگزینی ایمن، ساده و ساختاریافته برای ویرایش فایل functions.php قالب می باشد. برخی از ویژگی های آن عبارت است از:

• مدیریت آسان و منظم کدها: هر کد در محیطی جداگانه قرار می‌ گیرد، با امکان عنوان ‌گذاری، توضیح نویسی و فعال‌ یا غیرفعال ‌سازی آن بدون تأثیرگذاری بر سایر بخش ‌ها.
• امنیت بالا و جلوگیری از خطاهای مخرب: اگر کد مشکل داشته باشد، افزونه آن را پیش از ذخیره بررسی می‌ کند. در صورتی که کد باعث بروز خطا شود، افزونه به‌ صورت خودکار آن را غیرفعال می ‌کند تا سایت از دسترس خارج نشود.
• دارای دسته‌ بندی، جستجو و فیلتر: امکان مدیریت کدها به ‌صورت طبقه‌ بندی شده، جستجو در میان کدها و فیلترکردن آن‌ ها بر اساس وضعیت وجود دارد.
• امکان وارد کردن یا صادر کردن کدها: برای استفاده مجدد در سایت ‌های دیگر یا تهیه نسخه پشتیبان از کدها، می ‌توانید آن ‌ها را به‌ راحتی خروجی گرفته یا وارد کنید.

ابتدا وارد پیشخوان وردپرس شوید و به مسیر افزونه‌ها > افزودن بروید. سپس در کادر جستجو عبارت Code Snippets را وارد کرده و مطابق تصویر زیر، افزونه را نصب و فعال کنید:

پس از فعال‌ سازی افزونه، گزینه‌ای با عنوان Snippets به منوی پنل مدیریت وردپرس اضافه می ‌شود که مربوط به تنظیمات و مدیریت این افزونه است. از طریق این بخش، می‌ توانید فهرست کامل تمامی کدهای سفارشی (Code Snippets) که در سایت خود ذخیره کرده‌اید را مشاهده و مدیریت کنید.

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

افزونهCode Snippet s به شما این امکان را می ‌دهد که نسخه وردپرس را از کدهای سفارشی حذف کنید. در بخش بعدی، یعنی Description، می ‌توانید توضیحات مربوط به عملکرد کد و دلایل اضافه‌ کردن آن به وب ‌سایت خود را وارد کنید. علاوه بر این، امکان افزودن تگ‌ هایی به کدهای سفارشی وجود دارد که به شما کمک می ‌کند کدها را بر اساس موضوع و عملکردشان مرتب و سازمان ‌دهی کنید.

در نهایت، می‌ توانید کد را ذخیره کرده یا فعال ‌سازی کنید. همچنین در بخش تنظیمات، این امکان وجود دارد که تعیین کنید کدهایCode Snippets  در کدام بخش از سایت اجرا شوند. به‌ طور پیش ‌فرض، گزینه “Run Snippet Everywhere” فعال است، که به معنای اجرای کد در تمامی صفحات سایت می ‌باشد.

– مدیریت خطاها در افزونه Code Snippets

مدیریت خطاها در افزونه Code Snippets یکی از ویژگی‌های مهم این افزونه است که به شما کمک می‌ کند از بروز مشکلات جدی در سایت جلوگیری کنید. این پلاگین این امکان را فراهم می ‌کند که در صورت وجود خطا در کدهای سفارشی، آن‌ها به‌ طور خودکار غیرفعال شوند تا سایت از دسترس خارج نشود. در ادامه توضیحاتی در مورد نحوه مدیریت خطاها در این افزونه آورده شده است:

1- گزارش خطاها در افزونه

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

2- غیرفعال‌ سازی خودکار کدهای خراب

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

3- اطلاع ‌رسانی به کاربر

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

4- بازگشت به حالت پیش ‌فرض

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

رفع خطاها در هنگام افزودن کدهای سفارشی در وردپرس

این نکته را بدانید که اگر در هنگام اضافه کردن کدسفارشی در سایتتان کوچک ترین اشتباهی انجام دهید، بلافاصله سایت شما از دسترس خارج می شود و نمی توانید به سایت خود دسترسی داشته باشید. در واقع، اگر اشتباهی در افزودن کدسفارشی صورت گیرد، با خطای syntax error یا خطای سرور داخلی 500 مواجه می شوید. برای رفع این مشکل، باید کد خود را با استفاده از یک سرویس گیرنده FTP به صورت دستی لغو نمائید.

یک نکته عالی در خصوص افزونه WPCode این است که به صورت خودکار یک خطای نحوی را در کد تشخیص داده و بلافاصله آن را غیرفعال می کند.

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

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

بیشتر بخوانید: نحوه رفع خطای 500 سرور داخلی در وردپرس

نحوه مدیریت قطعه کدهای سفارشی

افزونه WPCode دارای یک رابط کاربری ساده برای مدیریت قطعه کدهای سفارشی شما در وردپرس فراهم می کند. شما می ‌توانید قطعه‌ های کد را بدون فعال ‌سازی در سایت خود ذخیره و سپس هر زمان که خواستید آن را فعال یا غیرفعال نمائید. همچنین می توانید قطعه های کد را بر اساس نوع و مکان فیلتر کرد و از برچسب‌ها برای سازماندهی آسان قطعات کد خود استفاده نمود.

همچنین شما می ‌توانید قطعه های کد ها را برون ریزی نمائید. برای انجام اینکار؛ از بخش “ابزارها” روی گزینه “Code Snippets” کلیک کنید. سپس وارد تب “Export” شوید.

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

بیشتر بخوانید: افزونه ساخت کد تخفیف های هوشمند در ووکامرس | WooCommerce Smart Coupons

سوالات متداول

بیشتر بخوانید: تغییر رنگ پنل مدیریت وردپرس با افزونه و بدون افزونه + اضافه کردن رنگ های جدید

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

چطور در وردپرس کدهای سفارشی اضافه کنیم ؟ یکی از قابلیت های محبوب وردپرس اسن است که امکان اضافه کردن کدهای سفارشی را به سادگی در اختیار شما قرار می دهد. شما می توانید از روش های مختلفی برای اضافه کردن کد در سایتتان استفاده نمائید که یکی از بهترین آنها استفاده از افزونه می باشد. ما در این مطلب نحوه افزودن کدهای سفارشی در وردپرس و نحوه اضافه کردن css سفارشی به وردپرس را در اختیار شما قرار دادیم. امیدوارم این آموزش مورد رضایت شما عزیزان قرار گرفته باشد.

منبع: wpbeginner