کروم ایکسٹینشن کیسے بنائیں

'ہماری موجودہ زندگی میں، ہم اپنے تفریحی اور تلاش کے مقاصد کے لیے سوشل میڈیا ایپس اور گوگل سرچ انجن کو استعمال کرنے کے لیے زیادہ بے چین ہیں، یعنی 'گوگل' سرچ انجن کے ذریعے کچھ تعلیمی موضوع پر تحقیق کریں اور ساتھ ہی عمومی معلومات حاصل کریں۔ کسی چیز کو تلاش کرنے کے لیے گوگل سرچ انجن کا استعمال کرنے کے لیے، ہمارے پاس اپنے موبائل فون، لیپ ٹاپ، یا پرسنل کمپیوٹرز پر پہلے سے ہی کوئی براؤزر انسٹال ہونا چاہیے۔ آج کی صدی کے سب سے زیادہ استعمال شدہ اور کارآمد براؤزر میں سے ایک 'گوگل کروم' براؤزر ہے جو ایکسٹینشن کی افادیت کے ساتھ ساتھ بہت ساری اچھی خصوصیات کے ساتھ سامنے آیا ہے۔ 'Extension' ایک پلگ ان ہے جو کسی بھی براؤزر میں ویب سائٹس اور مختلف افعال کو محدود کرنے یا اجازت دینے کے لیے پایا جاتا ہے۔ یہ ایکسٹینشن عام طور پر بلٹ میں نہیں آتے ہیں۔ جب بھی ضرورت ہو آپ کو اپنے براؤزر میں ہر ایکسٹینشن کو الگ سے شامل کرنا ہوگا۔ اگر آپ ٹکنالوجی میں تھوڑا ماہر ہیں، تو آپ کو چند مراحل میں ایکسٹینشن بنانے اور شامل کرنے کے لیے مینی فیسٹ JSON فائلوں کا استعمال معلوم ہو سکتا ہے۔ لہذا، یہ مضمون گوگل کروم براؤزر پر ایک نئی ایکسٹینشن بنانے کے لیے ان تمام اقدامات کا احاطہ کرے گا۔

ایکسٹینشن بنانے کے طریقہ کار پر ایک نظر ڈالنے سے پہلے، آپ کو یہ یقینی بنانا ہوگا کہ آپ کا گوگل کروم براؤزر پہلے ہی لانچ ہوچکا ہے اور 'گوگل' سرچ انجن میں کوئی پس منظر نہیں ہے۔ آپ دیکھ سکتے ہیں کہ نیچے دی گئی تصویر میں سرچ انجن 'Google.com' کے لیے کوئی پس منظر نہیں ہے، یعنی صرف سفید پس منظر۔

ایکسٹینشن فولڈر شامل کریں۔

اپنے ویژول اسٹوڈیو کوڈ ٹول کو اپنے ونڈوز سسٹم کی ایپس سے جلدی سے کھولیں۔ بصری اسٹوڈیو کوڈ کو صحیح طریقے سے کھولنے اور اسے ہمارے استعمال کے لیے فعال کرنے میں 1 منٹ تک کا وقت لگ سکتا ہے۔ اس کے صحیح طریقے سے لانچ ہونے اور استعمال کے لیے تیار ہونے کے بعد، ہم نے اس میں پہلے سے تیار کردہ فولڈر 'Extension' کو نیچے دکھائے گئے ٹاپ ٹاسک بار پر 'فائل' مینو لسٹ کے ذریعے شامل کر دیا ہے۔ 'Extension' فولڈر بنانے کے بعد، ہم نے اس میں 'image' کے نام سے ایک اور فولڈر شامل کیا ہے جس میں براؤزر پر ایکسٹینشن کے آئیکون کے طور پر استعمال ہونے والی تصاویر شامل ہیں۔ اس کے ساتھ، ہم نے ایک 'manifest.json' فائل اور 'script.js' نام کی ایک جاوا اسکرپٹ فائل شامل کی ہے تاکہ ایک نئی ایکسٹینشن بنائی جائے اور اسے براؤزر میں شامل کیا جا سکے۔ آئیے manifest.json فائل سے شروع کریں اور 'Google' کا پس منظر تبدیل کرنے کے لیے ایک ایکسٹینشن بنانے اور استعمال کرنے کے لیے JSON میں کام شروع کرنے کے لیے اس پر ڈبل کلک کریں۔

مینی فیسٹ فائل بنائیں

manifest.json فائل کے اندر، آپ کو نیچے دکھایا گیا 'JSON' کوڈ شامل کرنا چاہیے۔ یہ کوڈ ہمارے گوگل کروم براؤزر میں ایکسٹینشن بنانے اور شامل کرنے کے لیے اصل کنفیگریشن اسکرپٹ ہے۔ یہ JSON کوڈ متغیر مینی فیسٹ ورژن کے لیے '2' کے طور پر شروع کیا گیا ہے اور ایک ایکسٹینشن کے نام سے بنایا گیا ہے، یعنی 'بیک گراؤنڈ تبدیل کریں'۔ اس کے بعد، ہم نے 'تفصیل' متغیر کے اندر اپنی توسیع کے لیے مختصر تفصیل شامل کی۔

اس کے ساتھ، ہم نے ایکسٹینشن کا ورژن '1.0' کے طور پر شامل کیا ہے۔ 'ایکسٹینشن' کے لیے تمام بنیادی کنفیگریشنز بننے کے بعد، ہمیں ایکسٹینشنز کے لیے آئیکن کے طور پر استعمال کیے جانے والے تصویری آئیکن میں راستہ شامل کرنا ہوگا۔ متغیر 'براؤزر' کی وضاحت گوگل کروم براؤزر کے ٹاپ ٹاسک بار کے لیے ایکسٹینشن آئیکن کو سیٹ کرنے کے لیے کی گئی ہے، یعنی جہاں تمام ایکسٹینشنز کو کسی خاص یا تمام سائٹس کے لیے مستقبل کے استعمال کے لیے فعال کرنے کے بعد ظاہر کیا جاتا ہے۔ اس کے بعد، ہم نے مختلف سائز کی تین امیج فائلوں کا راستہ شامل کیا ہے تاکہ براؤزر ہر بار مختلف فائلوں کو استعمال کر سکے۔

اس کے ساتھ، 'page_action' ویری ایبل کا استعمال یہ ظاہر کرنے کے لیے کیا گیا ہے کہ گوگل کروم کے ٹاپ ٹاسک بار سے 'ایکسٹینشنز' آئیکون پر کلک کرنے کے بعد کون سی تصویر دکھائی جانی ہے۔ 'Default_icon' متغیر کو اس کے اندر استعمال کیا گیا ہے، اس کے ساتھ اس کی تین مختلف پاتھ ویلیوز کے ساتھ تصاویر کو ہر دوبارہ لوڈ پر آئیکون کے طور پر استعمال کیا جائے گا۔ اس مقصد کے لیے تین مختلف تصویری فائلیں استعمال کی جاتی ہیں۔ آخری content_scripts متغیر اس میں کل 2 نئے متغیرات لیتا ہے، یعنی میچ اور CSS۔ 'میچز' متغیر میں ویب سائٹ کا راستہ ہوتا ہے جسے اس نئی ایکسٹینشن کے استعمال کے بعد تبدیل کیا جائے گا۔ اس کے ساتھ، متغیر 'CSS' میں ایک CSS فائل کا نام ہوتا ہے جو ایکسٹینشن کے لیے درخواست دینے کے بعد Google.com کی اسٹائلنگ کے لیے استعمال کی جاتی ہے، یعنی، ایکسٹینشن کو فعال کرنے پر ہر دوبارہ لوڈ کرنے کے بعد Google.com کو اسٹائل کرنا۔ اب چونکہ یہ کوڈ مکمل اور استعمال کے لیے تیار ہے، بس اسے جلدی سے محفوظ کریں اور 'main.css' فائل کی طرف بڑھیں۔

main.css CSS فائل کے اندر، ہم اپنی مینی فیسٹ فائل ایکسٹینشن بنانے کے لیے اسٹائل شامل کر رہے ہیں۔ اسٹائل کا اطلاق html 'body' ٹیگ کا استعمال کرتے ہوئے کیا جائے گا، یعنی مینی فیسٹ فائل کے مکمل 'باڈی' ایریا پر لاگو کیا جائے۔ ہم سرچ انجن سے تصویری فائل کے 'URL' کا استعمال کرتے ہوئے Google.com کے لیے نیا پس منظر ترتیب دے رہے ہیں۔ اب، کسی بھی چیز سے پہلے اپنا کوڈ محفوظ کریں۔

مطلوبہ کوڈز، یعنی manifest.json اور main.css فائل کو مکمل کرنے کے بعد، ہمیں نئے ٹیب میں URL chrome://extensions کے ذریعے گوگل کروم براؤزر پر ایکسٹینشن یوٹیلیٹی کو کھولنا ہوگا۔ ایکسٹینشن یوٹیلیٹی ایریا کھل گیا ہے۔ اس کے ڈویلپر موڈ سے، آپ کو نیچے کی تصویر میں دکھائے گئے بٹن 'لوڈ ان پیکج' کے ذریعے ایکسٹینشن بنانے کے لیے اپنے مقامی سسٹم سے پیک کیے ہوئے 'ایکسٹینشن' فولڈر کو لوڈ کرنا ہوگا۔ ایکسٹینشن کو مؤثر طریقے سے کروم براؤزر میں شامل کر دیا گیا ہے، جیسا کہ دکھایا گیا ہے۔ اسے مکمل طور پر کام کرنے کے لیے غلطیوں کو دور کریں۔

'ایکسٹینشن' آئیکن سے، 'Change Background' ایکسٹینشن کو ٹاسک بار پر ظاہر کرنے کے لیے منتخب کریں، یعنی 'C' آئیکن ایکسٹینشن۔

Google.com کو دوبارہ لوڈ کرنے کے بعد، اس ایکسٹینشن کا استعمال کرتے ہوئے اس کا پس منظر اپ ڈیٹ ہو گیا۔

نتیجہ

ونڈوز سسٹم میں براؤزر استعمال کرنے کی وضاحت سے شروع کرتے ہوئے، ہم نے کسی بھی براؤزر میں ایکسٹینشن کی اہمیت پر بھی بات کی ہے۔ ایکسٹینشنز کی مختصر وضاحت کے بعد، ہم نے گوگل کروم براؤزر کے لیے ایک ایکسٹینشن بنانے کے لیے مینی فیسٹ JSON فائل کو استعمال کرنے کا طریقہ اور 'Google.com' سرچ انجن کے پس منظر کو تبدیل کرنے کے لیے اسے استعمال کرنے کا طریقہ بتایا ہے۔ گوگل کروم پر ایکسٹینشن لوڈ کرنے کے بعد، ہم اسے گوگل ڈاٹ کام پر اس کا پس منظر تبدیل کرنے کے لیے استعمال کرتے رہے ہیں۔