Movatterモバイル変換

Welcome to Chrome Extension development. Discover everything you need to start building and distributing your first Chrome Extension.

Chrome extensions enhance the browsing experience by customizing the user interface, observing browser events, and modifying the web. Visit theChrome Web Store for more examples of what extensions can do.

You can build extensions using the same web technologies that are used to create web applications:HTML,CSS, andJavaScript.

In addition toWeb APIs, extensions also have access toChrome Extension APIs to accomplish different tasks. For a more detailed overview, take a look at theDevelop guide.

The extension's manifest is the only required file that must have a specific file name: manifest.json. It also has to be located in the extension's root directory. The manifest records important metadata, defines resources, declares permissions, and identifies which files to run in the background and on the page.

A service worker runs in the background and handles browser events, like removing a bookmark, or closing a tab. They don't have access to the DOM, but you can combine it with an offscreen document for this use case.

Content scripts run JavaScript in the context of a web page.

Execute code when the user clicks on the extension toolbar icon or show a popup using the Action API.

Display custom UI in the browser's side panel.

Intercept, block, or modify network requests.

palette

When choosing which features to support, make sure your extension fulfills asingle purpose that is narrowly defined and easy to understand.

build

Extensions distributed on the Chrome Web Store must comply with thedeveloper program policies. Explore these policies to ensure your extension can be hosted in the Chrome Web Store.

cloud_off

When writing your code, keep in mind that all logic must be included in the extension package. This means no additional JavaScript code may be downloaded at runtime.Improve extension security provides alternatives to executing remotely hosted code.

code

Create your first hello world extension, where you will become familiar with the extension development workflow.

code

Learn to automatically add elements to a specified site.

code

Learn to simplify the style of the current page by clicking the toolbar icon.

code

Learn to create a popup that manages your tabs.

code

Learn to create and debug an extension service worker.

code

Learn to find logs and error messages during debugging.