تزریق سریع CSS / JS

1تزریق سریع CSS/JS چیست؟#

تزریق سریع، همان CSS و JavaScript را به هر صفحه‌ای که اپلیکیشن شما بارگذاری می‌کند اضافه می‌کند - بدون شرط و بدون قانون برای هر سایت.

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

✅ عالی برای:

• تغییرات برندینگ (رنگ‌ها، فونت‌ها، لوگو)
• پنهان کردن عناصر سراسری (هدر، فوتر، بنر کوکی)
• اصلاحات کوچک چیدمان یا اندازه فونت برای همه صفحات
• افزودن یک دکمه شناور سراسری (WhatsApp، چت، بازگشت به بالا)

❌ برای این کارها طراحی نشده:

• اجرای کد فقط روی نشانی‌های مشخص ← به‌جای آن از اسکریپت‌های کاربر هوشمند استفاده کنید
• خودکارسازی‌های پیچیده با زمان‌بندی ← از اسکریپت‌های کاربر هوشمند استفاده کنید

2جای آن در سازنده کجاست#

مرحله ۴ (مجوزها) ← به پایین اسکرول کنید ← کارت 🎨 تزریق سریع CSS / JS.

دو کادر متنی:

• 🎨 CSS سفارشی - قوانین CSS خام را جای‌گذاری کنید
• ⚡ JavaScript سفارشی - JS خام را جای‌گذاری کنید (نیازی به پوشش اضافه نیست)

هر دو اختیاری هستند. برای نادیده گرفتن، خالی بگذارید.

3مثال ۱: پنهان کردن بنر کوکی و هدر#

یک هدر چسبان و پنجره رضایت کوکی را در همه صفحات به‌صورت سراسری حذف کنید:

/* ── Hide header & nav ── */
header, nav, .navbar, #top-bar, .site-header {
  display: none !important;
}

/* ── Remove cookie/GDPR banners ── */
.cookie-banner, #cookie-notice, .gdpr-popup,
[id*="cookie"], [class*="cookie"] {
  display: none !important;
}

4مثال ۲: حالت تاریک کامل (فقط CSS)#

هر وب‌سایتی را با یک فیلتر CSS تاریک کنید - تصاویر طبیعی می‌مانند:

/* ── Dark Mode via CSS filter ── */
html {
  filter: invert(1) hue-rotate(180deg) !important;
}
/* Keep images & media in original colors */
img, video, canvas, svg, picture {
  filter: invert(1) hue-rotate(180deg) !important;
}

5مثال ۳: اصلاح مقیاس / زوم#

وب‌سایت در موبایل خیلی کوچک یا خیلی بزرگ است؟ سطح زوم را اصلاح کنید:

/* 85% scale — adjust to your needs */
body {
  zoom: 0.85;
}

/* Force readable font size */
body, p, li, td {
  font-size: 15px !important;
  line-height: 1.65 !important;
}

6مثال ۴: دکمه شناور WhatsApp (JS)#

یک دکمه شناور تماس WhatsApp در هر صفحه اضافه می‌کند (شماره تلفن را عوض کنید):

// Floating WhatsApp button
(function() {
  if (document.getElementById('__wa_fab__')) return;
  var btn = document.createElement('a');
  btn.id = '__wa_fab__';
  btn.href = 'https://wa.me/1234567890?text=Hello';
  btn.style.cssText = [
    'position:fixed','bottom:24px','right:20px',
    'width:56px','height:56px','border-radius:50%',
    'background:#25D366','color:#fff','font-size:26px',
    'display:flex','align-items:center','justify-content:center',
    'text-decoration:none','z-index:999999',
    'box-shadow:0 4px 12px rgba(0,0,0,.35)'
  ].join(';');
  btn.textContent = '💬';
  document.body.appendChild(btn);
})();

7مثال ۵: پذیرش خودکار کوکی‌ها (JS)#

روی پنجره‌های رضایت کوکی خودکار «پذیرش» را بزنید:

// Auto-accept cookie banners
(function() {
  var selectors = [
    '.accept-cookies','#accept-btn','#cookie-accept',
    'button[id*="accept"]','button[class*="accept"]',
    '[aria-label*="Accept"]'
  ];
  selectors.forEach(function(sel) {
    var el = document.querySelector(sel);
    if (el) el.click();
  });
})();

8نحوه کار در پشت صحنه#

• CSS بعد از بارگذاری به‌صورت یک تگ <style id=\'__userscript_css__\'> در <head> صفحه درج می‌شود.
• JS بعد از بارگذاری به‌صورت یک تگ <script id=\'__userscript_js__\'> درج می‌شود.
• هر دو در هر صفحه بعد از onPageFinished اجرا می‌شوند - از جمله هنگام بازگشت به صفحه قبل.
• با بررسی ID عنصر در ابتدا، از تزریق مضاعف جلوگیری می‌شود.
• در اپلیکیشن‌های ZIP آفلاین هم کار می‌کند.

⚠️ محدودیت: بعد از بارگذاری صفحه اجرا می‌شود. اسکریپت‌های زودتر اجراشونده در صفحه ممکن است قبلاً اجرا شده باشند. برای تزریق پیش از بارگذاری از اسکریپت‌های کاربر هوشمند (document-start) استفاده کنید.