Chrome extensions can enhance browsing by adding functionality, improving user experience, and streamlining processes. They have components like browser actions, page actions, content scripts, and background scripts that allow interactions with pages and passing of messages. Extensions are built with a manifest file and use HTML, CSS, and JavaScript, optionally including assets. The workshop will cover how extensions work, relevant Chrome APIs, and guide participants in creating three sample extensions.

1. Google Chrome
Extension
GDG, DAIICT

2. What’s For You Today?
• Understanding Working Of Chrome
Extension
• Working with Chorme APIs
• Create 3 extensions

3. What do Chorme Extensions do?
Enhance browsing experience by:
• Adding functionality to your Browser
• Giving better UI/UX experience
• Make a long process shorter

4. Few Examples

5. Components of Extension

6. 1. Browser Action
Icons always shows in the top menu bar.

7. 2. Page Action
Icon shows in URL bar only on few specified
pages.

8. 3. Content Script
Adding your own script which can interact with the
page content

9. 4. Background Script
• Always runs in the background.
• It can receive messages from Content Script
and reply back.

10. 5. Options Page
• Creates a page for your extension where
you can have setting options

11. 6. Page Overide
Create you own customized for
• New tab page
• Bookmarks
• History

12. File Structure
• manifest.json – Main File
• HTML – Structuring
• CSS – Designing
• JS – Perform Logic
• Assets – Image files, etc

13. Manifest.json

14. So Let’s Make Our First