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

گزینه‌های افزودن جاوااسکریپت در وردپرس

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

 

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

 

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

 

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

برای افزودن جاوااسکریپت به وردپرس، راهکارهای مختلفی وجود دارد که ساده‌ترین و مؤثرترین آن‌ها عبارتند از:

غیرفعال کردن فیلترهای امنیتی تگ اسکریپت
افزودن جاوااسکریپت به هدر وردپرس
افزودن جاوااسکریپت به فوتر وردپرس
استفاده از افزونه‌های وردپرس برای افزودن جاوااسکریپت

 

۱. غیرفعال کردن فیلترهای امنیتی تگ اسکریپت

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

برای غیرفعال کردن این فیلتر، ابتدا خط زیر را به فایل wp-config.php اضافه کنید:

define( ‘CUSTOM_TAGS’, true );
سپس، کد زیر را به فایل functions.php قالب خود اضافه کنید:

php
Copy code
function add_scriptfilter( $string ) {
global $allowedtags;
$allowedtags[‘script’] = array( ‘src’ => array () );
return $string;
}
add_filter( ‘pre_kses’, ‘add_scriptfilter’ );

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

 

۲. افزودن جاوااسکریپت به هدر وردپرس

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

function wpb_hook_javascript() {
?>
<script>
// کد جاوااسکریپت
</script>
<?php
}
add_action(‘wp_head’, ‘wpb_hook_javascript’);
همچنین می‌توانید جاوااسکریپت را فقط برای صفحات خاصی اعمال کنید. برای این کار باید شناسه (ID) صفحه مورد نظر را مشخص کرده و از دستور شرطی if استفاده کنید. به عنوان مثال:

php
Copy code
function wpb_hook_javascript() {
if (is_page (’10’)) {
?>
<script type=”text/javascript”>
// کد جاوااسکریپت
</script>
<?php
}
}
add_action(‘wp_head’, ‘wpb_hook_javascript’);

 

۳. افزودن جاوااسکریپت به فوتر وردپرس

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

function wpb_hook_javascript() {
?>
<script>
// کد جاوااسکریپت
</script>
<?php
}
add_action(‘wp_footer’, ‘wpb_hook_javascript’);
همچنین می‌توانید جاوااسکریپت را برای صفحات خاص در فوتر نیز اعمال کنید:

php
Copy code
function wpb_hook_javascript() {
if (is_page (’10’)) {
?>
<script type=”text/javascript”>
// کد جاوااسکریپت
</script>
<?php
}
}
add_action(‘wp_footer’, ‘wpb_hook_javascript’);

 

۴. استفاده از افزونه‌های وردپرس برای افزودن جاوااسکریپت

اگر ویرایش دستی فایل‌های قالب برای شما پیچیده است، می‌توانید از افزونه‌های وردپرس استفاده کنید. یکی از افزونه‌های محبوب برای این کار Scripts n Styles است. مراحل نصب این افزونه به شرح زیر است:

وارد پیشخوان وردپرس شوید.
از منوی کناری، گزینه افزونه‌ها و سپس افزودن را انتخاب کنید.
عبارت Scripts n Styles را جستجو کرده و روی هم‌اکنون نصب کن کلیک کنید.
پس از نصب، روی فعال کردن کلیک کنید.
پس از فعال‌سازی، می‌توانید افزونه را در بخش ابزارها در منوی کناری پیدا کنید. این افزونه به شما امکان می‌دهد کدهای HTML، CSS و جاوااسکریپت را به سادگی به پروژه وردپرس خود اضافه کنید.

برای جاوااسکریپت، سه گزینه در دسترس است:

 

• CoffeeScript
• اسکریپت‌ها در هدر (head)
• اسکریپت‌ها در فوتر (footer)

نتیجه‌گیری

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