ٹیمپرمونکی کے ساتھ اپنے براؤزر میں عنصر کی تبدیلیوں کو مستقل کیسے بنائیں

آپ جیسے قارئین MUO کو سپورٹ کرنے میں مدد کرتے ہیں۔ جب آپ ہماری سائٹ پر لنکس کا استعمال کرتے ہوئے خریداری کرتے ہیں، تو ہم ملحق کمیشن حاصل کر سکتے ہیں۔ مزید پڑھ.

آپ کے ویب براؤزر پر Inspect Element کی خصوصیت ایک ڈویلپر ٹول ہے جو آپ کو کسی ویب سائٹ کے سامنے والے پہلوؤں بشمول HTML، CSS، اور JavaScript میں ترمیم کرنے اور عارضی تبدیلیاں کرنے دیتا ہے۔ آپ Inspect Element کے ساتھ اور بھی بہت کچھ کر سکتے ہیں۔ تاہم، ریفریش کے بعد تمام تبدیلیاں ضائع ہو جاتی ہیں۔

دن کی MUO ویڈیو مواد کے ساتھ جاری رکھنے کے لیے اسکرول کریں۔

لیکن بعض اوقات، آپ تبدیلیوں کو ایک توسیعی مدت کے لیے رکھنا چاہتے ہیں یا صارف کے تجربے کو بڑھانے کے لیے اضافی خصوصیات شامل کر سکتے ہیں۔ Inspect Element کی تبدیلیوں کو مستقل کرنے کا ایک طریقہ Tampermonkey ایکسٹینشن کا استعمال کرنا ہے۔ یہ آپ کو ویب صفحات پر حسب ضرورت اسکرپٹس شامل کرنے دیتا ہے، تبدیلیوں کو آپ کی مقامی مشین پر مستقل بناتا ہے۔

آئیے دیکھتے ہیں کہ آپ کے مقامی براؤزر پر معائنہ عنصر کی تبدیلیوں کو مستقل بنانے کے لیے ٹیمپرمونکی کو کیسے استعمال کیا جائے۔

ٹیمپرمونکی کیا ہے اور آپ اسے کیسے انسٹال کرسکتے ہیں؟

ٹیمپرمونکی، یوزر اسکرپٹ مینیجر، ایک مقبول براؤزر ایکسٹینشن ہے جو تمام بڑے ویب براؤزرز کے لیے دستیاب ہے، بشمول کروم، ایج، اوپیرا نیکسٹ، اور فائر فاکس۔ یہ آپ کو اپنی مرضی کے مطابق اور موجودہ یوزر اسکرپٹس بنانے اور چلانے دیتا ہے تاکہ ویب صفحات کو درست کرنے یا بہتر بنانے کے لیے ان میں ترمیم کی جا سکے۔

اس میں ٹیمپرمونکی کے دوسرے صارفین کے ذریعہ تخلیق کردہ یوزر اسکرپٹس لائبریری بھی شامل ہے۔ مثال کے طور پر، آپ مقامی یوٹیوب ڈاؤنلوڈر یوزر اسکرپٹ استعمال کر سکتے ہیں۔ Tampermonkey کا استعمال کرتے ہوئے YouTube ویڈیوز ڈاؤن لوڈ کریں۔ یا لاگ اِن کیے بغیر جھنڈا لگائے ہوئے YouTube ویڈیوز دیکھیں .

ایکسٹینشن مخصوص ویب پیج کے لوڈ ہوتے ہی محفوظ شدہ یوزر اسکرپٹس کو چلاتی ہے، اس طرح مطلوبہ تبدیلیاں مستقل ظاہر ہوتی ہیں۔

اس سے پہلے کہ ہم اسکرپٹ لکھنا شروع کریں، آپ کو Tampermonkey انسٹال کرنا ہوگا۔ تو، آئیے ایکسٹینشن کو انسٹال کرنے کے ساتھ شروع کریں:

پر جائیں۔ ٹیمپرمونکی کا آفیشل پیج . یہ خود بخود آپ کے ویب براؤزر کا پتہ لگائے گا۔ اگر نہیں، تو کروم، مائیکروسافٹ ایج، فائر فاکس، سفاری اور اوپیرا کے کسی بھی ٹیب پر کلک کریں، اس براؤزر پر منحصر ہے جو آپ استعمال کر رہے ہیں۔
میں ڈاؤن لوڈ کریں سیکشن، پر کلک کریں اسٹور سے حاصل کریں۔ . آپ کو اپنے براؤزر کے ویب اسٹور پر بھیج دیا جائے گا۔
پر کلک کریں انسٹال کریں۔ اپنے براؤزر میں ایکسٹینشن شامل کرنے کے لیے۔ انسٹالیشن مکمل کرنے کے لیے کسی بھی آن اسکرین ہدایات پر عمل کریں۔

اگر آپ کا براؤزر درج نہیں ہے، لیکن آپ Chromium براؤزر استعمال کر رہے ہیں، تو آپ کو اس ایکسٹینشن سے انسٹال کرنے کے قابل ہونا چاہیے۔ کروم اسٹور .

آئی پوڈ سے آئی ٹیونز میں موسیقی منتقل کرنے کا طریقہ

انسٹال ہونے کے بعد، آپ کسی بھی ویب سائٹ میں مطلوبہ تبدیلیاں کرنے کے لیے JavaScript کا استعمال کرتے ہوئے حسب ضرورت صارف اسکرپٹ لکھنا شروع کر سکتے ہیں۔ یہ کہنے کی ضرورت نہیں کہ آپ کو HTML، CSS، اور JavaScript کی بنیادی تفہیم کی ضرورت ہوگی تاکہ صارف اسکرپٹ لکھنے اور Tampermonkey کا استعمال کرتے ہوئے ترمیم کریں۔

Tampermonkey کی صلاحیتوں کو ظاہر کرنے کے لیے، ہم آپ کے WhatsApp رابطوں کے ساتھ مضمون کے لنکس کا اشتراک کرنے کے لیے WhatsApp شیئر بٹن شامل کرنے کے لیے ایک اسکرپٹ لکھیں گے۔

ویب سائٹ کے عنصر میں ترمیم کرنے سے پہلے کن چیزوں پر غور کریں۔

کسی بھی ویب سائٹ میں ترمیم کرتے وقت، فریق ثالث جاوا اسکرپٹس کے استعمال سے متعلق ان کی پالیسیوں کا احترام کرنا ضروری ہے۔ کسی بھی ویب سائٹ پر من مانی طور پر یوزر اسکرپٹس چلانے کی کوشش نہ کریں، خاص طور پر جب آپ حساس ڈیٹا سے نمٹ رہے ہوں۔

جب کہ ٹیمپرمونکی آپ کی ظاہری شکل کو تبدیل کرنے اور ویب سائٹ میں فعالیت شامل کرنے میں مدد کرتا ہے، تمام تبدیلیاں صرف مقامی طور پر آپ کے براؤزر میں نظر آتی ہیں اور ماخذ کو متاثر نہیں کرتی ہیں۔

ٹیمپرمونکی کے ساتھ شروعات کرنا

ایک بار جب آپ نے ان تبدیلیوں کی منصوبہ بندی کرلی ہے جو آپ ویب صفحہ پر کرنا چاہتے ہیں، آپ اپنی اسکرپٹ لکھنا شروع کر سکتے ہیں۔ ٹول بار یا ٹیمپرمونکی ڈیش بورڈ سے نئے یوزر اسکرپٹس بنائے جا سکتے ہیں۔

ایک نیا اسکرپٹ بنانے کے لیے، پر کلک کریں۔ ایکسٹینشنز براؤزر ٹول بار میں آئیکن اور منتخب کریں۔ ٹیمپرمونکی . اگلا، منتخب کریں ایک نیا اسکرپٹ بنائیں . اس سے ٹیمپرمونکی ڈیش بورڈ میں اسکرپٹ ایڈیٹر کھل جائے گا۔

ڈیفالٹ ٹیمپرمونکی ہیڈر یا میٹا ڈیٹا تبصرے اس طرح نظر آتے ہیں:

// ==UserScript== 
 
// @name New Userscript 
 
// @namespace http://tampermonkey.net/ 
 
// @version 0.1 
 
// @description try to take over the world! 
 
// @author You 
 
// @match http://example.com/* 
 
// @grant none 
 
// ==/UserScript== 
 
(function() { 
 
'use strict'; 
 
// Your code here... 
 
})();

ان میٹا ڈیٹا تبصروں میں صارف اسکرپٹ کے نام، مطلوبہ مقصد، اور اجازتوں کے بارے میں اہم معلومات شامل ہیں اور ٹیمپرمونکی کو بتاتے ہیں کہ اسکرپٹ کو کب عمل میں لانا ہے۔

اس گائیڈ کے لیے، ہم پر توجہ مرکوز کریں گے۔ @match ہدایت، عرف میٹا ڈیٹا فائل کیا گیا۔ ٹیمپرمونکی اس ہدایت کا استعمال اس بات کو یقینی بنانے کے لیے کرتا ہے کہ یوزر اسکرپٹ صرف ایک مخصوص ویب سائٹ یا ویب صفحات پر لاگو ہو۔ اس مثال میں، درج ذیل یوزر اسکرپٹ صرف example.com (اپنی ضرورت کے مطابق ویب سائٹ یو آر ایل کو تبدیل کریں) اور اس کے تمام صفحات پر چلے گا۔

ہر MakeUseOf مضمون کے آخر میں، آپ کو مختلف سوشل میڈیا پلیٹ فارمز کے لیے ایک شیئر ویجیٹ ملے گا، سوائے WhatsApp کے۔ جب آپ یو آر ایل کو کاپی اور پیسٹ کر سکتے ہیں، تو ایک واٹس ایپ شیئر بٹن مفید ہے اگر آپ اپنے واٹس ایپ گروپ پر مضامین کو کثرت سے شیئر کرتے ہیں۔

آپ مضمون کے آخر میں واٹس ایپ شیئر بٹن شامل کرنے کے لیے ٹیمپرمونکی میں ایک صارف اسکرپٹ بنا سکتے ہیں۔ ہم بٹن کو موجودہ شیئر ویجیٹ میں ضم کریں گے جو آپ کو اپنے WhatsApp رابطوں کے ساتھ ویب صفحہ کے URL کا اشتراک کرنے کی اجازت دے گا۔

آئیے ایک بنیادی WhatsApp شیئر بٹن بنانے کے ساتھ شروع کریں۔

//create a WhatsApp button 
const Whatsapp_btn = document.createElement('button'); 
Whatsapp_btn.textContent = 'Share';

اب جب کہ ہمارے پاس ایک بنیادی WhatsApp شیئر بٹن ہے، آئیے اس میں کچھ اسٹائل شامل کریں۔ یہ بٹن کو اس کا پس منظر اور متن کا رنگ، بارڈر، پیڈنگ، اور کرسر کا انداز دے گا۔ تھوڑا سا ٹنکرنگ کے ساتھ، آپ ظاہری شکل کو ٹھیک کرنے کے لیے بٹن کی خصوصیات کو تبدیل کر سکتے ہیں۔

لیپ ٹاپ پر ڈیڈ پکسلز کو ٹھیک کرنے کا طریقہ

//add styling to the button 
Whatsapp_btn.style.backgroundColor = '#075E54'; 
Whatsapp_btn.style.color = 'white'; 
Whatsapp_btn.style.border = 'none'; 
Whatsapp_btn.style.borderRadius = '5px'; 
Whatsapp_btn.style.padding = '10px';

بٹن کے تیار ہونے کے ساتھ، اسے جانچنے کا وقت آگیا ہے۔ لیکن آپ اسے کہاں رکھتے ہیں؟ ایک عام عمل کے طور پر، اکثر شیئر بٹن مضامین کے آخر میں رکھا جاتا ہے۔

تاہم، اس مثال میں، ہمارے پاس پہلے سے ہی ہر مضمون کے آخر میں ایک شیئرنگ ویجیٹ موجود ہے۔ لہذا، اس شیئر بٹن کو ویجیٹ کا حصہ بنانا مثالی ہے۔

ونڈوز ایس ڈی کارڈ فارمیٹ مکمل کرنے سے قاصر تھی۔

ایسا کرنے کے لیے، ہم موجودہ شیئر ویجیٹ کا معائنہ کریں گے تاکہ وہ پیرنٹ کنٹینر تلاش کیا جا سکے جس میں شیئرنگ عناصر شامل ہوں تاکہ اسے صارف اسکرپٹ میں تلاش کیا جا سکے۔ ویب صفحہ پر، دبائیں۔ Ctrl + Shift + C معائنہ عنصر کو کھولنے کے لئے. اگلا، اس کا معائنہ کرنے کے لیے صفحہ پر شیئر ویجیٹ عنصر کو منتخب کریں۔

آپ دیکھیں گے کہ یہ ایک ہے۔

کلاس کے نام کے ساتھ عنصر ' نیچے کا اشتراک ' آپ اس عنصر کو استعمال کرکے منتخب کرسکتے ہیں۔ سوال سلیکٹر آپ کے صارف اسکرپٹ میں طریقہ۔

const sharingDiv = document.querySelector ('div.sharing.bottom');

عنصر کو منتخب کرنے کے بعد، آئیے اس میں بطور چائلڈ شیئر بٹن داخل کریں:

if (sharingDiv) { 
 sharingDiv.appendChild(Whatsapp_btn); 
}

دبائیں Ctrl + S سکرپٹ کو بچانے کے لیے۔ اگر آپ صفحہ کو دوبارہ لوڈ کرتے ہیں، تو آپ کو موجودہ شیئر ویجیٹ میں ایک شیئر بٹن داخل ہوتا نظر آئے گا۔ لیکن اس پر کلک کرنے سے کچھ نہیں ہوگا۔

بٹن کو کام کرنے کے لیے، ہم موجودہ صفحہ کے یو آر ایل کی بنیاد پر WhatsApp شیئر یو آر ایل بنانے کے لیے ایک فنکشن بنائیں گے۔ صفحہ کا یو آر ایل واپس کرنے کے لیے آپ location.href استعمال کر سکتے ہیں۔

function generateWALink() { 
 const pageURL = encodeURIComponent(window.location.href); 
 return `https://api.whatsapp.com/send?text=${pageURL}`; 
}

اگلا، آئیے بٹن میں ایونٹ سننے والا شامل کریں۔ کلک کرنے پر، براؤزر واٹس ایپ شیئر لنک کے ساتھ ایک نیا ٹیب کھولے گا جو آپ کو پیغام تحریر کرنے دیتا ہے۔

Whatsapp_btn.addEventListener('click', () => { 
 const whatsappURL = generateWALink(); 
 window.open(whatsappURL, '_blank'); 
});

یوزر اسکرپٹ کو محفوظ کریں اور چلائیں۔

ایک بار جب آپ کے پاس یوزر اسکرپٹ تیار ہوجائے تو دبائیں۔ Ctrl + S تبدیلیوں کو بچانے کے لیے۔ کھولو انسٹال کردہ یوزر اسکرپٹس آپ کے براؤزر پر انسٹال کردہ تمام یوزر اسکرپٹ دیکھنے کے لیے ٹیمپرمونکی میں ٹیب۔

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

آپ مزید اضافہ کرنے کے لیے اسکرپٹ میں مزید ترمیم کر سکتے ہیں۔ مثال کے طور پر، آپ بٹن پر WhatsApp کا آئیکن ڈسپلے کر سکتے ہیں یا InsertAfter() فنکشن کا استعمال کرتے ہوئے اس کی جگہ کو تبدیل کر سکتے ہیں۔

آپ ٹیمپرمونکی ڈیش بورڈ سے انفرادی یوزر اسکرپٹس کو فعال، غیر فعال یا ترمیم کرسکتے ہیں۔ متبادل طور پر، تمام فعال یوزر اسکرپٹس کو ایک ساتھ غیر فعال کرنے کے لیے ٹول بار میں Tampermonkey آئیکن پر کلک کریں۔

ٹیمپرمونکی کا استعمال کرتے ہوئے معائنہ عنصر کی تبدیلیوں کو مستقل بنانا

Tampermonkey دستیاب بہت سے یوزر اسکرپٹ مینیجرز میں سے ایک ہے جو آپ کو اپنے براؤزنگ کے تجربے کو بڑھانے کے لیے ویب صفحات میں ترمیم کرنے کی اجازت دیتا ہے۔ چھوٹی چھوٹی تبدیلیاں آپ کی پسندیدہ ویب سائٹ کے ساتھ بہتر رسائی اور معمولی پریشانیوں کو دور کرنے میں مدد کر سکتی ہیں۔

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

ٹیمپرمونکی کیا ہے اور آپ اسے کیسے انسٹال کرسکتے ہیں؟

ویب سائٹ کے عنصر میں ترمیم کرنے سے پہلے کن چیزوں پر غور کریں۔

ٹیمپرمونکی کے ساتھ شروعات کرنا

واٹس ایپ شیئر بٹن شامل کرنے کے لیے یوزر اسکرپٹ لکھنا

یوزر اسکرپٹ کو محفوظ کریں اور چلائیں۔

ٹیمپرمونکی کا استعمال کرتے ہوئے معائنہ عنصر کی تبدیلیوں کو مستقل بنانا