ٹارگیٹڈ ورڈپریس پیج پر جاوا اسکرپٹ کو لاگو کرنا
ورڈپریس ایک استعمال میں آسان پلیٹ فارم ہے جو ویب سائٹ کے انتظام اور حسب ضرورت کو آسان بناتا ہے۔ تاہم، کچھ تبدیلیوں کو لاگو کرنا مشکل ہو سکتا ہے، بشمول کسی خاص صفحہ پر JavaScript کا نفاذ۔ یہ ممکن ہے کہ آپ نے اپنی ویب سائٹ کے "ہیڈ" سیکشن میں شامل کردہ اسکرپٹ اب ہر صفحہ پر موجود ہو۔ یہ پہلی بار کی ایک عام مشکل ہے۔
کسی مخصوص صفحہ کو نشانہ بنانے کے لیے اسے استعمال کرتے وقت مشروط طور پر JavaScript فائل کو لاگو کرنے کے طریقہ کو سمجھنا بہت ضروری ہے۔ JavaScript کے غیر متوقع نتائج ہو سکتے ہیں اور آپ کی ویب سائٹ کی رفتار کو کم کر سکتا ہے اگر اسے ہر جگہ استعمال کیا جائے۔ یہی وجہ ہے کہ اسکرپٹ کو ضروری صفحہ تک محدود کرنا بہت ضروری ہے۔
ہم آپ کو اس مضمون میں آپ کی ورڈپریس کنفیگریشن کو تبدیل کرنے کے عمل سے آگاہ کریں گے تاکہ JavaScript صرف ان صفحات پر شروع ہو جن کی آپ کو ضرورت ہے۔ جواب غیر ڈویلپرز کے لیے بھی قابل فہم ہے۔ یہ گائیڈ ان لوگوں کے لیے ہے جو ابھی شروع کر رہے ہیں۔
اس سبق کو ختم کرنے تک آپ کو ورڈپریس میں صفحہ کے مخصوص اسکرپٹس کو سنبھالنے میں آسانی محسوس کرنی چاہیے۔ ہم اس بات کو یقینی بنانے کے لیے درکار درست کوڈ اور طریقہ کار کے ذریعے آپ کی رہنمائی کریں گے کہ آپ کا JavaScript صرف وہیں کام کرتا ہے جہاں اسے ہونا چاہیے، آپ کی ویب سائٹ کی کارکردگی کو بہتر بناتا ہے۔
حکم | استعمال کی مثال |
---|---|
is_page() | فنکشن کے نام سے جانا جاتا ہے۔ is_page() اس بات کی تصدیق کرتا ہے کہ آیا موجودہ ورڈپریس صفحہ دیئے گئے صفحہ کی ID، عنوان، یا سلگ سے مطابقت رکھتا ہے۔ اس بات کی ضمانت دینے کے لیے کہ اسکرپٹ صرف ایک مخصوص صفحہ پر لوڈ ہوتے ہیں، یہ فنکشن ضروری ہے۔ مثال کے طور پر، اگر (is_page(42)) {... } |
wp_enqueue_script() | ورڈپریس استعمال کرتا ہے۔ wp_enqueue_script() جاوا اسکرپٹ فائلوں کو لوڈ کرنے کا طریقہ۔ یہ اس بات کی ضمانت دیتا ہے کہ اسکرپٹس سائٹ کے ہیڈ یا فوٹر میں بھری ہوئی ہیں اور صحیح طریقے سے ان کے انحصار کے ساتھ شامل ہیں۔ wp_enqueue_script('custom-js', 'https://example.com/code.js') اس کی ایک مثال ہے۔ |
add_action() | اپنی مرضی کے افعال کو پہلے سے طے شدہ ورڈپریس ایونٹس میں شامل کرنے کے لیے، جیسے لوڈنگ اسکرپٹس، استعمال کریں۔ add_action() طریقہ اس سے ضرورت پڑنے پر اسکرپٹ کو متحرک طور پر داخل کرنا ممکن ہو جاتا ہے۔ 'wp_enqueue_scripts', 'load_custom_js_on_specific_page' ایڈ ایکشنز کی دو مثالیں ہیں۔'); |
add_shortcode() | ورڈپریس آپ کو استعمال کرتے ہوئے ایک نیا مختصر کوڈ رجسٹر کرنے کی اجازت دیتا ہے۔ add_shortcode() فنکشن یہ آپ کو براہ راست پوسٹ ایڈیٹر میں متحرک مواد، جیسے جاوا اسکرپٹ کو شامل کرنے کی اجازت دیتا ہے۔ Add_shortcode('custom_js', 'add_js_via_shortcode') ایک مثال ہے۔ |
$.getScript() | صفحہ لوڈ ہونے کے بعد، آپ jQuery طریقہ استعمال کر سکتے ہیں۔ $.getScript() ایک بیرونی جاوا اسکرپٹ فائل کو متحرک طور پر لوڈ کرنے کے لیے۔ یو آر ایل یا دیگر معیار کی بنیاد پر اسکرپٹ لوڈنگ پر مشروط منطق کا اطلاق اس کے لیے ایک قابل قدر استعمال ہے۔ $.getScript('https://example.com/code.js')، مثال کے طور پر |
window.location.href | دی window.location.href property returns the full URL of the current page. It can be used to check for specific URL patterns, making it useful for conditionally loading JavaScript on certain pages. Example: if (window.location.href.indexOf('specific-page-slug') > پراپرٹی موجودہ صفحہ کا مکمل URL لوٹاتا ہے۔ اسے مخصوص URL کے نمونوں کی جانچ پڑتال کے لیے استعمال کیا جا سکتا ہے، جو اسے بعض صفحات پر جاوا اسکرپٹ کو مشروط طور پر لوڈ کرنے کے لیے مفید بناتا ہے۔ مثال: اگر (window.location.href.indexOf('specific-page-slug') > -1) { ... } |
get_header() | ہیڈر ٹیمپلیٹ فائل کو ورڈپریس کے ذریعے لوڈ کیا جاتا ہے۔ get_header() فنکشن JavaScript کوڈ کو شامل کرنے سے پہلے، یہ اپنی مرضی کے مطابق صفحہ ٹیمپلیٹس میں استعمال کیا جاتا ہے تاکہ یہ یقینی بنایا جا سکے کہ ساخت مناسب ہے۔ مثال کے طور پر، |
get_footer() | ورڈپریس فوٹر ٹیمپلیٹ کی طرف سے بھری ہوئی ہے get_footer() فنکشن، جو یقینی بناتا ہے کہ جاوا اسکرپٹ کو صفحہ آؤٹ پٹ میں مناسب طریقے سے داخل کرنے سے پہلے لوڈ کیا گیا ہے۔ مثال کے طور پر، |
مخصوص ورڈپریس صفحات پر جاوا اسکرپٹ کے کردار کو سمجھنا
اسکرپٹ کو براہ راست "ہیڈ" سیکشن میں ڈالنے کا طریقہ اس کے ہر صفحے پر لوڈ ہونے کا سبب بن سکتا ہے جب آپ کو چلانے کی ضرورت ہو جاوا اسکرپٹ ایک مخصوص ورڈپریس صفحے پر فائل۔ صارف کے تجربے اور کارکردگی کے لحاظ سے، یہ مثالی نہیں ہے۔ پچھلے اختیارات اسکرپٹ کو صرف مخصوص صفحہ تک محدود کرکے اسکرپٹ کو ہینڈل کرنے کا ایک زیادہ موثر طریقہ فراہم کرتے ہیں۔ مثال کے طور پر، ہم ورڈپریس کا استعمال کر سکتے ہیں۔ is_page() اس بات کا تعین کرنے کا طریقہ کہ آیا صارف اپنی شناخت یا سلگ کی بنیاد پر کوئی مخصوص صفحہ دیکھ رہا ہے۔ یہ وہ بنیادی تکنیک ہے جو اس بات کو یقینی بنانے کے لیے استعمال کی جاتی ہے کہ JavaScript فائل صرف ضروری ہونے پر لوڈ ہوتی ہے۔
پہلا طریقہ میں مشروط ٹیگز کا استعمال کرتا ہے۔ functions.php کے ساتھ مل کر فائل کریں wp_enqueue_script(). یہ تکنیک ایک بنیادی ورڈپریس خصوصیت کا استعمال کرتی ہے جو اسکرپٹ کو اس طرح شامل کرتی ہے جو مناسب انحصار کے انتظام کو یقینی بناتی ہے اور اسکرپٹ کو صفحہ کے مناسب حصے میں لوڈ کرتی ہے۔ کے ذریعے wp_enqueue_scripts ایکشن ہکنگ، جاوا اسکرپٹ فنکشن صرف اس وقت شامل کیا جائے گا جب ورڈپریس کسی ایسے صفحے پر کارروائی کرتا ہے جو مطمئن کرتا ہے is_page() ضرورت مؤثر ہونے کے علاوہ، یہ غیر اہم سائٹس پر بے مقصد اسکرپٹ پر عمل درآمد کو روکتا ہے۔
شارٹ کوڈز کا استعمال دوسری حکمت عملی کا حصہ ہے۔ ورڈپریس شارٹ کوڈز کسی صفحہ یا پوسٹ میں متحرک مواد شامل کرنا آسان بناتے ہیں۔ add_shortcode() حسب ضرورت شارٹ کوڈ بنانے کے لیے استعمال کیا جا سکتا ہے، جو آپ کو ضرورت کے مطابق مواد کے علاقے میں اسکرپٹ کو مشروط طور پر داخل کرنے کی اجازت دے گا۔ اگر آپ کسی ویب سائٹ یا پوسٹ کے پورے صفحہ کے بجائے اسکرپٹ کو مخصوص حصوں پر استعمال کرنا چاہتے ہیں تو یہ آپ کو مزید اختیارات فراہم کرتا ہے۔ مزید برآں، یہ ان لوگوں کے لیے زیادہ قابل رسائی آپشن ہے جو پی ایچ پی فائلوں میں براہ راست تبدیلیاں کرنے میں بے چین ہیں۔
ایک اور طریقہ ان صفحات پر اسکرپٹس کو متحرک طور پر لوڈ کرنے کے لیے بہترین ہے جن کے URL میں مخصوص پیرامیٹرز ہوتے ہیں کیونکہ یہ URLs میں مخصوص نمونوں کو تلاش کرنے کے لیے jQuery کا استعمال کرتا ہے۔ window.location.href اور $.getScript() اس نقطہ نظر میں استعمال کیا جاتا ہے اس بات کی نشاندہی کرنے کے لیے کہ آیا یو آر ایل میں کوئی خاص سٹرنگ شامل ہے اور جاوا اسکرپٹ فائل کو مناسب طریقے سے لوڈ کریں۔ یہ نقطہ نظر ای کامرس سائٹس یا منفرد ٹریکنگ کوڈز کے ساتھ لینڈنگ پیجز جیسے حالات کے لیے اچھی طرح کام کرتا ہے جہاں URL ڈھانچہ کے لیے اسکرپٹ کے استعمال کی ضرورت ہوتی ہے۔ یہ تکنیکیں تمام ماڈیولر، دوبارہ قابل استعمال ہیں، اور اس بات کو یقینی بنائیں کہ اسکرپٹ صرف ضرورت کے وقت لوڈ ہوں، جس سے صارف کے تجربے اور کارکردگی میں اضافہ ہوتا ہے۔
مشروط ٹیگز کا استعمال کرتے ہوئے ایک مخصوص ورڈپریس پیج میں جاوا اسکرپٹ کو شامل کرنا
یہ نقطہ نظر ورڈپریس میں پی ایچ پی کے بلٹ ان مشروط ٹیگز کو استعمال کر کے جاوا اسکرپٹ فائل کو صرف منتخب صفحہ پر لوڈ کرتا ہے۔ یہ تکنیک بہت ورڈپریس کے لیے موزوں ہے۔
// functions.php - Adding JavaScript to a specific WordPress page
function load_custom_js_on_specific_page() {
// Check if we are on a specific page by page ID
if (is_page(42)) { // Replace 42 with the specific page ID
// Enqueue the external JavaScript file
wp_enqueue_script('custom-js', 'https://example.com/code.js', array(), null, true);
}
}
// Hook the function to wp_enqueue_scripts
add_action('wp_enqueue_scripts', 'load_custom_js_on_specific_page');
شارٹ کوڈز کا استعمال کرتے ہوئے ایک مخصوص ورڈپریس پیج پر جاوا اسکرپٹ چلانا
یہ طریقہ آپ کو ورڈپریس شارٹ کوڈز کا استعمال کرتے ہوئے کسی مخصوص صفحے پر جاوا اسکرپٹ کو مشروط طور پر شامل کرکے اسکرپٹ کو کہاں استعمال کرنے کی آزادی دیتا ہے۔
// functions.php - Using shortcodes to add JavaScript to a specific page
function add_js_via_shortcode() {
// Return the script tag to be added via shortcode
return '<script src="https://example.com/code.js" type="text/javascript"></script>';
}
// Register the shortcode [custom_js]
add_shortcode('custom_js', 'add_js_via_shortcode');
// Now, use [custom_js] in the page editor where the script should run
jQuery کا استعمال کرتے ہوئے URL پیرامیٹرز پر مبنی JavaScript لوڈ ہو رہا ہے۔
یہ تکنیک جاوا اسکرپٹ کو مشروط طور پر لوڈ کرتی ہے اور ایک مخصوص URL پیٹرن کی شناخت کے لیے jQuery استعمال کرتی ہے۔ متحرک طور پر ہدف بنانے والے صفحات کے لیے، یہ مثالی ہے۔
<script type="text/javascript">
jQuery(document).ready(function($) {
// Check if the URL contains a specific query string or slug
if (window.location.href.indexOf('specific-page-slug') > -1) {
// Dynamically load the JavaScript file
$.getScript('https://example.com/code.js');
}
});
</script>
ٹیمپلیٹ فائلوں کا استعمال کرتے ہوئے مخصوص صفحات پر جاوا اسکرپٹ شامل کرنا
جاوا اسکرپٹ کو سیدھے ورڈپریس صفحہ ٹیمپلیٹ فائل میں شامل کرنے سے، یہ طریقہ یہ بناتا ہے کہ اسکرپٹ کو صرف اس مخصوص صفحہ پر لوڈ کیا جاتا ہے۔
// Inside page-specific template file (e.g., page-custom.php)
<?php get_header(); ?>
<!-- Page Content -->
<script src="https://example.com/code.js" type="text/javascript"></script>
<?php get_footer(); ?>
ورڈپریس صفحات پر جاوا اسکرپٹ لوڈنگ کو بہتر بنانا
مخصوص ورڈپریس صفحات پر جاوا اسکرپٹ کا استعمال کرتے وقت اسکرپٹ کو کہاں لوڈ کیا جاتا ہے یہ ایک اہم خیال ہے۔ ورڈپریس بطور ڈیفالٹ اسکرپٹ کو صفحہ میں لوڈ کرنے کی اجازت دیتا ہے۔ فوٹر یا ہیڈر. کارکردگی کی وجوہات کی بناء پر، عام طور پر فوٹر میں اسکرپٹ لوڈ کرنے کی سفارش کی جاتی ہے، خاص طور پر جب بیرونی وسائل استعمال کرتے ہوں۔ یہ اس لیے ہے کہ صارفین جاوا اسکرپٹ پر عمل درآمد کو ملتوی کر کے صفحہ کے تیزی سے لوڈ ہونے سے لطف اندوز ہو سکیں جب تک کہ صفحہ لوڈنگ مکمل نہ ہو جائے۔
آپ کو تبدیل کر سکتے ہیں wp_enqueue_script() پاس کر کے فوٹر میں اسکرپٹ لوڈ کرنے کا طریقہ سچ حتمی پیرامیٹر کے طور پر۔ ایسا کرنے سے، آپ اس بات کو یقینی بنا سکتے ہیں کہ اسکرپٹ آخری باڈی ٹیگ اور صفحہ کے باقی مواد سے پہلے لوڈ ہو جائے۔ چونکہ کم اہم اسکرپٹ میں تاخیر ہوتی ہے اور زیادہ اہم وسائل کو ترجیح دی جاتی ہے، یہ تکنیک ظاہری لوڈ ٹائم کو کم کرنے میں مدد کرتی ہے۔ اگرچہ یہ اصلاح نوزائیدہوں کو زیادہ نہیں لگتی ہے، لیکن اس کا ورڈپریس سائٹ کی رفتار اور فعالیت پر بڑا اثر پڑتا ہے۔
کیش بسٹنگ اور ورژن کنٹرول دو دیگر اہم عناصر ہیں۔ ورڈپریس استعمال کرنے کا ایک آسان طریقہ فراہم کرتا ہے۔ wp_enqueue_script() اسکرپٹ میں ورژن نمبر شامل کرنے کے لیے فنکشن۔ آپ اس بات کو یقینی بنا سکتے ہیں کہ صارفین ورژن کی دلیل شامل کرکے اپنے کیشے سے پرانی جاوا اسکرپٹ حاصل نہ کریں۔ یہ اس بات کو یقینی بناتا ہے کہ اسکرپٹ کا تازہ ترین ورژن مسلسل لوڈ ہوتا ہے، جو اسکرپٹ کو تیار کرنے یا اپ گریڈ کرنے کے دوران انتہائی مددگار ہوتا ہے۔ یہ طریقہ کار اسکرپٹ کے تصادم کے امکان کو کم کرتا ہے اور ویب سائٹ کی فعالیت کو بڑھاتا ہے۔
ورڈپریس صفحات میں جاوا اسکرپٹ کو شامل کرنے کے بارے میں عام سوالات
- میں یہ کیسے یقینی بنا سکتا ہوں کہ اسکرپٹ صرف کسی خاص صفحہ پر کھلتا ہے؟
- صفحہ ID یا سلگ کی بنیاد پر اسکرپٹ کو مشروط طور پر لوڈ کرنے کے لیے، استعمال کریں۔ is_page() میں تقریب functions.php آپ کے تھیم کی فائل۔
- جاوا اسکرپٹ کو ورڈپریس میں شامل کرنے کا بہترین طریقہ کیا ہے؟
- جاوا اسکرپٹ کو ورڈپریس میں شامل کرنے کے لیے، wp_enqueue_script() فنکشن تجویز کردہ تکنیک ہے۔ یہ انحصار اور اسکرپٹ پروسیسنگ کے مناسب انتظام کی ضمانت دیتا ہے۔
- کیا میں جاوا اسکرپٹ کو فوٹر میں لوڈ کر سکتا ہوں؟
- ہاں، بہتر کارکردگی کے لیے اسکرپٹ کو فوٹر میں لوڈ کرنے کے لیے پاس کریں۔ true کی پانچویں دلیل کے طور پر wp_enqueue_script().
- میں جاوا اسکرپٹ فائلوں کے لیے کیشے بسٹنگ کو کیسے ہینڈل کروں؟
- اس بات کو یقینی بنانے کے لیے کہ تازہ ترین ورژن لوڈ ہو گیا ہے، اسکرپٹ کے یو آر ایل میں ورژن نمبر کا اضافہ کریں wp_enqueue_script().
- کیا میں جاوا اسکرپٹ کو شامل کرنے کے لیے شارٹ کوڈ استعمال کر سکتا ہوں؟
- جی ہاں، آپ استعمال کر سکتے ہیں add_shortcode() ایک مختصر کوڈ بنانے کے لیے جو آپ کو کسی صفحہ یا پوسٹ کے مخصوص علاقوں میں جاوا اسکرپٹ کو شامل کرنے کی اجازت دے گا۔
ورڈپریس صفحات کے لیے جاوا اسکرپٹ کو بہتر بنانے کے بارے میں حتمی خیالات
آپ کا JavaScript کوڈ بہتر طریقے سے کام کرے گا اور آپ کی ویب سائٹ پر صارف کے تجربے کو بہتر بنائے گا اگر اسے کسی مخصوص صفحہ پر نشانہ بنایا گیا ہو۔ آپ کا اسکرپٹ صرف وہیں لوڈ کرے گا جہاں اس کی ضرورت ہوتی ہے جیسے فنکشنز کا استعمال کرتے ہوئے is_page() اور wp_enqueue_script()، جو آپ کی ویب سائٹ کے دیگر علاقوں کے لوڈ اوقات کو تیز کرے گا۔
اگر آپ ورڈپریس میں نئے ہیں اور بہت سارے کوڈ کو جانے بغیر اسکرپٹ کو مؤثر طریقے سے منظم کرنا چاہتے ہیں تو یہ آپ کے لیے بہترین طریقے ہیں۔ یاد رکھیں کہ کوڈ پر عمل درآمد کے دائرہ کار کو محدود کرتے ہوئے، مخصوص صفحات پر جاوا اسکرپٹ کو مناسب طریقے سے لاگو کرنے سے کارکردگی کے علاوہ سیکیورٹی میں بھی اضافہ ہوتا ہے۔
ورڈپریس صفحات پر جاوا اسکرپٹ کے حوالے اور ذرائع
- ورڈپریس میں اسکرپٹس کی قطار لگانے کے بارے میں تفصیلات کا حوالہ سرکاری ورڈپریس دستاویزات سے لیا گیا تھا۔ پر مزید جانیں۔ ورڈپریس ڈویلپر حوالہ .
- مخصوص صفحات کو نشانہ بنانے کے لیے مشروط ٹیگ استعمال کرنے کے بارے میں معلومات ورڈپریس کوڈیکس سے حاصل کی گئی تھیں۔ پر آفیشل گائیڈ دیکھیں ورڈپریس مشروط ٹیگز .
- فوٹر میں جاوا اسکرپٹ کو لوڈ کرنے کے لیے اضافی بہترین طریقے اس مضمون سے حاصل کیے گئے ہیں: Smashing Magazine JavaScript Optimization Tips .