How to Create you own custom Chrome app-2 ways.

Google Chrome is the most common web browser which is used all around the world due to its speed and compatibility with our systems.As a result day by day new type of Apps and Extensions are released in to chrome web store.But have you ever tried to make one of your own App and Extension? If not in this tutorial i am gonna show you how to make your own Chrome app and Extension for you site or any other site with in Minutes using Manifest.json file.So let's see how to do this.

Steps:

1.Create a New Folder any where on your Pc and name it as like "Worldtech360 chrome Apps" or "Chrome Apps and Extensions".Now create a Sub folder and name it with your site.
2.Open the Sub folder which you have created and create a new "Text document".Now we are going to convert this text document in to Manifest.json.

3.Open the Text document and copy the below code in it.

---

 {

"manifest_version": 2,

"name": "Web site name",//Web site name

"description": "Web site description in 132 charecters or less",//site Description

"version": "1.1",

"icons": {

"128": "worldtech360.png" //Replace the image with your site image or any other image.see that the file height and width is 128x128.

},

"app": {

"urls": ["http://www.worldtech360.com/"],//your site URL

"launch": {

"web_url": "http://www.worldtech360.com/"//Your site URL

}

},

"permissions": [

"unlimitedStorage",

"notifications"

]

}

---

4.Now save the file as "maifest.json" and choose save as type as "All files" and Encoding as "UTF-8" as shown below.

• UTF-8: UCS Transformation format and 8-bits.
• UCS- universal character set.

5.After saving the file you will find the manifest file as shown below.

6.Now select an image which you want as icon for your app.In this i used my site favicon.You can use any image.

Note:

• In order to resize the image use Image resizer.After installation of image Resizer Right click on the image and you will find "Resize pictures" option and choose 128x128 pixels as shown above or you can use MS paint to do it.

7.Now we are ready to make our own app using manifest file and image file.

Method-1(Loading unpacked Extension):

1.Go to google chrome and click on "Customize and control option" at the left-top corner and click on Tools>extensions or type "Chrome://extensions" in the address bar.

2.Click on "Developer mode" and then on "load unpacked extension" as shown below.

3.Now browse to the folder which as manifest file + image i.e chrome app files and click ok.

4.Now you will find the app installed as shown below.In order to view the app go the new tab and then app section at the bottom of the "new tab" page.If you do not find the app section then first do the things that are listed in the below URL and then perform the above task

Method 2(Loading Packed extensions):

1.In this method first we need to create .crx file.

• crc-Google chrome browser Extension Archive file.

2.Now we are going to pack the extension(i.e manifest file and image file) in .crx format.In order to do go to extensions and then click on "pack extension" and browse to the chrome app files(i.e manifest file and image file folder) and click ok.

3.Now you will find two files i.e .crx file and .pem file.

4.Now drag the .crx file in to the extension tab as shown below.

5.After dragging the file a window will pop up asking to add it to the browser.Click add and tab will pop up showing that the app as been installed.

Note:

Try to do only one method.If you perform both the methods to create custom chrome app,it may result to conflicts and your browser may crash.

That's it friends i hoped you enjoyed the article.If you have any queries feel free to ask us through comments and have a nice day.