راهنمای مبتدیان برای چسباندن قطعات از وب به وردپرس

آیا می خواهید یاد بگیرید که چگونه قطعه های وب را در وردپرس جای گذاری کنید؟

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

کپی و چسباندن کد در فایل‌های تم وردپرس ممکن است برای کاربران با تجربه آسان به نظر برسد، اما برای مبتدیان می‌تواند ترسناک باشد.

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

چرا قطعه کد را به سایت وردپرس خود اضافه کنید؟

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

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

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

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

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

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

بهترین راه برای افزودن قطعه کد در وردپرس چیست؟

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

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

هنگام افزودن قطعه‌ها به وردپرس، ممکن است دستورالعمل‌هایی برای افزودن آنها به فایل‌های قالب وردپرس، مانند index.php،single.phpو غیره بیابید.

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

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

به این ترتیب اگر یک تم را تغییر دهید، عملکرد سفارشی شما حذف نخواهد شد.

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

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

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

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

به این ترتیب، با اعمال تغییرات در تم اصلی، تغییرات شما از بین نمی‌روند و همواره می‌توانید به حالت اولیه بازگردید.

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

• اضافه کردن کد سفارشی با افزونه WPCode (آسان)
• افزودن کد سفارشی در افزونه وردپرس مخصوص سایت
• افزودن کد سفارشی به Functions.php یا سایر قالب‌های تم
• عیب یابی خطاهای رایج کد (سؤالات متداول)

روش ۱: اضافه کردن کد سفارشی با افزونه WPCode (آسان)

استفاده از افزونه قطعه کد ایمن ترین و مبتدی ترین راه برای افزودن کد به وردپرس است.

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

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

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

بهترین بخش این است که به شما امکان می دهد تمام کدهای کد را از یک صفحه مرکزی مدیریت کنید و حتی می توانید آنها را با استفاده از برچسب ها سازماندهی کنید.

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

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

اگر قصد دارید از افزونه WPCode برای اضافه کردن کد به وردپرس استفاده کنید، کد را مستقیماً در داشبورد مدیریت وردپرس خود اضافه خواهید کرد.

ابتدا باید افزونه را نصب و فعال کنید. برای جزئیات بیشتر، راهنمای مبتدیان ما در مورد نحوه نصب افزونه وردپرس را ببینید.

پس از فعال سازی، به سادگی به قسمت Code Snippets » + Add Snippet در داشبورد مدیریت وردپرس خود بروید. سپس روی دکمه افزودن جدید کلیک کنید.

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

برای افزودن کد سفارشی، روی دکمه Use snippet در زیر گزینه «Add Your Custom Code (New Snippet)» کلیک کنید.

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

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

بهترین بخش در مورد WPCode این است که جدا از گزینه های مختلف Auto-Insert، گزینه منطقی شرطی مناسب برای مبتدیان نیز ارائه می شود. این به شما امکان می دهد زمان بارگیری کد خود را انتخاب کنید.

پس از تکمیل کد، سوئیچ را از «غیرفعال» به «فعال» در گوشه بالا سمت راست تغییر دهید.

سپس روی دکمه Save Snippet کلیک کنید.

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

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

نحوه اضافه کردن کد به سربرگ و پاورقی وردپرس

گاهی اوقات ممکن است فقط نیاز به اضافه کردن کد به فایل هایheader.phpیا footer.php تم خود داشته باشید. افزونه WPCode نیز می تواند به شما در انجام این کار به راحتی کمک کند.

هنگامی که نیاز دارید یک کد رهگیری برای Google Analytics ، Facebook Pixel، Google AdSense و موارد دیگر را به وب سایت خود اضافه کنید، این کار مفید است.

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

توجه: این روش برای ردیابی اسکریپت ها، CSS سفارشی و کد جاوا اسکریپت بهترین کار را دارد.

به قسمت Code Snippets » Header and Footer بروید و سپس قطعه کد خود را در قسمت header، body یا footer وب سایت خود وارد کنید.

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

برای جزئیات بیشتر، راهنمای ما در مورد نحوه اضافه کردن کد سرصفحه و پاورقی در وردپرس را ببینید.

روش ۲: اضافه کردن کد سفارشی در افزونه وردپرس مخصوص سایت

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

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

توجه: این روش فقط برای کدهایی که باید به فایل functions.php اضافه شوند قابل استفاده است.

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

ابتدا باید به Plugins » Plugin Editor بروید و سپس افزونه خود را از منوی کشویی با عنوان “Select plugin to edit:” انتخاب کنید.

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

پس از اتمام کار، مطمئن شوید که روی دکمه “به روز رسانی فایل” کلیک کنید تا تغییرات خود را ذخیره کنید.

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

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

به سادگی وب سایت خود را با استفاده از سرویس گیرنده FTP دلخواه خود باز کنید و سپس بر روی فایل افزونه کلیک راست کرده و گزینه “View/Edit” را انتخاب کنید.

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

برای جزئیات بیشتر، به راهنمای ما در مورد نحوه ایجاد یک افزونه مخصوص سایت برای وب سایت خود مراجعه کنید.

روش ۳: اضافه کردن کد سفارشی به Functions.php یا سایر قالب‌های تم

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

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

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

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

اگر قطعه کد را مستقیماً به فایل functions.php قالب خود یا هر قالب صفحه دیگری اضافه می کنید، می توانید کد را با رفتن به Appearance » Theme Editor در پنل مدیریت وردپرس خود اضافه کنید.

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

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

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

به سادگی به سرویس گیرنده FTP خود به وب سایت خود متصل شوید و سپس به پوشه wp-content » themes » your-theme-folder بروید و روی فایلی که نیاز به ویرایش دارد کلیک راست کنید.

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

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

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

بیایید نگاهی به این خطاها و بهترین راه هایی که می توانید آنها را برطرف کنید بیاندازیم.

۱. استفاده نادرست از تگ های شروع و پایان PHP

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

</pre>
// PHP Begin Tag
<?php

// Rest of the code goes here

// PHP End Tag
?>
<pre>

تمام کدهای پی اچ پی شما باید داخل تگ <?phpو باشد.?>

تگ پایان PHP در فایل هایی که بین PHP و HTML جابجا می شوند بسیار مهم است. این شامل اکثر فایل‌های تم وردپرس می‌شود که از برچسب‌های PHP در کنار HTML استفاده می‌کنند.

شما باید مطمئن شوید که اگر کد خود را در مکانی قرار می دهید که تگ شروع PHP بسته نشده است، باید کد خود را بدون تگ شروع PHP اضافه کنید.

</pre>
<?php
// Some pre-existing code

// your custom code

?>
<pre>

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

</pre>
<?php
// Some pre-existing code
?>

// Your custom code snippet
<?php

?>
<pre>

تقریبا ۹۰ درصد از همه خطاها ناشی از قرار دادن نادرست تگ های شروع یا پایان PHP است. نگاه کردن به کدتان به شما کمک می‌کند بفهمید که آیا نیاز دارید تگ‌های شروع یا پایان PHP را در قطعه کد سفارشی خود اضافه کنید یا خیر.

با این حال، بسیاری از فایل‌های تم وردپرس مانند functions.phpممکن است اصلاً برچسب پایانی PHP نداشته باشند. این بدان معناست که می توانید کد خود را در پایین فایل بدون تگ شروع یا پایان اضافه کنید.

در اینجا نمونه ای از آنچه به نظر می رسد آورده شده است.

<?php
// Lots of code in your theme's functions.php file
//
//
// Your custom code
function custom_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'https://cdn.ivsi.ir/images/login_logo.png) !important; }
</style>';
}
add_action('login_head', 'custom_loginlogo');

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

function custom_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'https://cdn.ivsi.ir/images/login_logo.png) !important; }
</style>';
}
add_action('login_head', 'custom_loginlogo');

گاهی اوقات وقتی قطعه کد داده می شود، می توان آنها را به چندین مکان اضافه کرد، بنابراین تگ های پایان و شروع PHP گنجانده نمی شوند.

هنگامی که چنین قطعه کدی را در فایل های تم خود اضافه می کنید، باید مطمئن شوید که داخل تگ های PHP باشد.

۲. خطاهای تودرتو نادرست

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

به عنوان مثال، در اینجا یک تابع ساده PHP وجود دارد:

<?php
function ivsi_tutorial() {
echo "Hello World!";
}
?>

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

// Pre-existing code in your theme file
<?php
function ivsi_tutorial() {
echo "Hello World!";
}
// Your custom code
function custom_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'https://cdn.ivsi.ir/images/login_logo.png) !important; }
</style>';
}
?>

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

آشنایی با خطاهای PHP در وردپرس

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

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

سپس، می توانید به خط دقیق بروید تا کد را مرور کنید و بفهمید چه چیزی را از دست داده اید.

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

وقتی سایت وردپرس شما غیر قابل دسترسی است چه باید کرد؟

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

به سادگی با استفاده از یک سرویس گیرنده FTP یا برنامه مدیریت فایل در cPanel در حساب میزبانی وردپرس خود به وب سایت خود متصل شوید.

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

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

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

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

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

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

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

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

و بخوانید:

• نحوه تغییر مکان پیش فرض آپلود رسانه در وردپرس
• ۱۴ مهارت توسعه دهنده PHP برای پیشبرد حرفه توسعه دهنده شما
• PHP چیست؟ راهنمای قطعی
• فایل functions.php در وردپرس چیست