Create Chrome Extensions in 5 Steps
•
1 like•450 views
This is a small article written by Akshay Khale to just demonstrate how to create a chrome extension without having knowledge of any programming language. This article shows chrome extension creation by use of html and Json
Recommended
More Related Content
What's hot
What's hot (20)
Similar to Create Chrome Extensions in 5 Steps
Similar to Create Chrome Extensions in 5 Steps (20)
Recently uploaded
Recently uploaded (20)
Create Chrome Extensions in 5 Steps
- 1. Creating Chrome ExtensionCreating Chrome Extension Akshay A. KhaleAkshay A. Khale
- 2. What is Chrome Extension ? A Chrome extension is a small application attached to Google chrome and runs with Google chrome providing extra features. Tool You Need • Notepad(Recommended Notepad++) • Google Chrome (For packaging and Debugging). Skill You Need • HTML • CSS • JavaScript • JSON(Basic Knowledge) Steps For Creating Chrome Extension 1. Create your application files i.e. HTML files containing content of your App/Entension. 2. Create the manifest.json file which contains information about the App/Extension and the information of behavior of the Extension. Sample manifest.json file { "manifest_version": 2, "name": "NameOfExtension", "description": "Description of the Application.", "version": "VersionOfEntension", "browser_action": { "default_icon": “URL of icon of your Extension”, "default_popup": "MainPageOfExtension(html document)" } }
- 3. In the image shown above the arrow indicates main page of my extension similar to index page of websites. Eg. Manifest.json file { "manifest_version": 2, "name": "4Androidfans", "description": "This extension Provides a information about Android and its versions.", "version": "1.0", "browser_action": { "default_icon": "icon.png", "default_popup": "Popup.html" } } Popup.html file <html>
- 4. <body> <h1>This is test App</h1> </body> </html> Done your app is create now to test the app Goto Chrome Options Then Goto Settings and then to Extensions Check the checkbox of Developer Mode then click on Load Unpacked extension…
- 5. Locate the folder of your extension and click “Ok” Your Extension will be installed on chrome window. You can include images, CSS more impressive coding JQUERY/JavaScript to make it more impressive and the pack the extension. For that In Extensions window click on Pack Extension… Again locate the folder of you app/extension by clicking on Browse button in front of “Extension root directory” then click ok it will create, it will create two file one with extension “.crx” which is your chrome app and next is “.pem” which is System Generated Private Key of You App. If you want you can register yourself here (https://chrome.google.com/webstore/developer/dashboard) to publish your extensions to chrome App Store . But there is a charge of 5$ for uploading your extensions.