https://github.com/saeedkohansal/injectorplus-chrome-extension-manifest-v3

Injector+ is a cutting-edge MV3 Chrome extension that empowers you with an infinitely versatile lightweight injection tool. With Injector+, you can seamlessly inject both inline and external JavaScript, as well as internal and external CSS into any website, unlocking endless possibilities for web development and customization.
https://github.com/saeedkohansal/injectorplus-chrome-extension-manifest-v3

chrome-extension chrome-extensions chromeextension chromeextention css extension-chrome gilgeekify how-to howto javascript js programming software software-development software-engineering tutorial web-development webdesign webdeveloper webdevelopment

Last synced: 26 days ago
JSON representation

Injector+ is a cutting-edge MV3 Chrome extension that empowers you with an infinitely versatile lightweight injection tool. With Injector+, you can seamlessly inject both inline and external JavaScript, as well as internal and external CSS into any website, unlocking endless possibilities for web development and customization.

• Host: GitHub
• URL: https://github.com/saeedkohansal/injectorplus-chrome-extension-manifest-v3
• Owner: saeedkohansal
• License: mit
• Created: 2023-10-01T07:35:26.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-09-15T20:41:43.000Z (7 months ago)
• Last Synced: 2025-04-01T03:31:02.748Z (27 days ago)
• Topics: chrome-extension, chrome-extensions, chromeextension, chromeextention, css, extension-chrome, gilgeekify, how-to, howto, javascript, js, programming, software, software-development, software-engineering, tutorial, web-development, webdesign, webdeveloper, webdevelopment
• Language: JavaScript
• Homepage: https://youtu.be/13yCU0tQ4cY
• Size: 6.99 MB
• Stars: 10
• Watchers: 2
• Forks: 3
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Injector+ Chrome Extension Manifest V3

_Chrome Extension Development Tutorial: How To Inject JavaScript And CSS Into Any Website Manifest V3_

![YouTube Thumbnail](https://raw.githubusercontent.com/saeedkohansal/InjectorPlus-Chrome-Extension-Manifest-V3/main/images/InjectorPlus-Chrome-Extension-Manifest-V3.png "Injector+ Chrome Extension Manifest V3")

A Chrome extension is a small software program that can be added to the Google Chrome web browser to add new features or modify the browser's functionality. We are going to learn how to build a Chrome extension using manifest v3 from scratch. You will learn how to control a Chrome extension's behavior, how to set and change Chrome extension icons based on conditions, what the Chrome Storage API and Chrome Scripting API are, how to use them, and much more... My extension is compatible with all Chromium-based browsers. I've tested it on Google Chrome, Microsoft Edge, Brave, and Opera. I chose the name of this Chrome extension Injector Plus (Injector+). We can call it an unlimited lightweight injection tool that supports injecting inline JavaScript code, external JavaScript files, internal CSS code, and external CSS files. JavaScript and CSS injection are powerful techniques in web development that enable developers to create interactive, dynamic, and visually appealing web applications. However, they should be used responsibly to avoid security and performance issues. For testing purposes, I will inject custom JavaScript and CSS code into multiple websites, including ChatGPT, YouTube, Facebook, Wikipedia, example.com, and more...

## Video Tutorial [ How To Build Chrome Extension From Scratch ]

[https://youtu.be/13yCU0tQ4cY](https://youtu.be/13yCU0tQ4cY)



## The Project Structure Explanation

![Project Setup Files Explanation](https://raw.githubusercontent.com/saeedkohansal/InjectorPlus-Chrome-Extension-Manifest-V3/main/images/Project-Structure-Explanation.png "Project Structure Explanation")

## The Extension Icon In Different Conditions

| ![Extension Original Icon](https://raw.githubusercontent.com/saeedkohansal/InjectorPlus-Chrome-Extension-Manifest-V3/main/source-code/assets/icons/Original.png "Extension Original Icon") | ![Extension Enabled Icon](https://raw.githubusercontent.com/saeedkohansal/InjectorPlus-Chrome-Extension-Manifest-V3/main/source-code/assets/icons/enabled/Original.png "Extension Enabled Icon") | ![Extension Disabled Icon](https://raw.githubusercontent.com/saeedkohansal/InjectorPlus-Chrome-Extension-Manifest-V3/main/source-code/assets/icons/disabled/Original.png "Extension Disabled Icon") |

| :---: | :---: | :---: |

| Original Icon | Enabled Icon | Disabled Icon |

### How To Debug Extension Using `extensionStatusReport();` Function

![How To Debug Extension](https://raw.githubusercontent.com/saeedkohansal/InjectorPlus-Chrome-Extension-Manifest-V3/main/images/How-To-Debug-Extension.gif "How To Debug Extension")

## `chrome.storage.local` vs `chrome.storage.sync`

![Chrome Storage Sync vs Local](https://raw.githubusercontent.com/saeedkohansal/InjectorPlus-Chrome-Extension-Manifest-V3/main/images/Chrome-Storage-Sync-vs-Local.png "Chrome Storage Sync vs Local")

## The `background.js` Script Preview

![background.js](https://raw.githubusercontent.com/saeedkohansal/InjectorPlus-Chrome-Extension-Manifest-V3/main/images/background.js.png "background.js")

## If You Enjoy My Content, Please Support Me 😍🙏

💙 PAYPAL DONATION

https://paypal.me/gilgeekify

❤️ PATREON

https://www.patreon.com/gilgeekify

💛 BUY ME A COFFEE

https://www.buymeacoffee.com/gilgeekify

🪙 My Public Address To Receive BTC • Bitcoin

bc1qerc5ev074cqknu9nz589w4vjf5ecmhuc2df83h

🥈 My Public Address To Receive ETH • Ethereum

0x566A47B9731209A5144336D274D44224bfb9C0ea