Google chrome app for beginners

Creating your own Google Chrome App in minutes- for beginners

Hi friends,
                 I know i havent done anything in my blog for ages. I ll try to post lot:-).
               
                 Here is a small tutorial to make your own google chrome dashboard link so that any one can create their own dashboard item for your most visited websites or your own blogs. For those who dont know what is a dashboard, it's the home page screen which shows up when you start google chrome or when when you open a new tab. Here is a screenshot of how it looks

These apps are downloaded from the chrome store and im gonna show you how you can add your own icon which opens up your own links. For some of those who see a 'Most visited' page in chrome, move your mouse over to the right edge and click so you will get your app page.

Step 1:

Create a folder in your local drive of any name you wish. Now lets say the folder name is 'First app'.

Step 2:

Find a suitable icon for your app from online or create your won icons using Adobe Photoshop. The icon should be of size 128 by 128 pixels. Now paste that icon into the folder 'First app'. Rename it to "icon.png"

Step 3:

Now create a text document inside the folder 'First app' and paste the following code in the document.


{ "name":"NAME OF YOUR APP HERE", "version": "1", "icons": { "128": "icon.png" }, "app": { "urls": [ "http://PUT-THE-URL-OF-YOUR-WEBSITE-HERE" ], "launch": { "web_url": "http://PUT-THE-URL-OF-YOUR-WEBSITE-HERE" } } }

Once you pasted the code above, now we have to customize this code according to your need.

Step 4:

First you have to specify a name for your app. Replace the NAME OF YOUR APP HERE tag in the second line of the code using a name u wish for your app. Make sure you give your name inside double quotes.

Second you have to give the URL of the location what your app has to open, say we want our app to open this blog "http://evthink.blogspot.in/" then just replace "http://PUT-THE-URL-OF-YOUR-WEBSITE-HERE" with  "http://evthink.blogspot.in/". Make sure you replace at both the places.

Now save your file with the name manifest.json.

Now that we have both our icon and the manifest file, we are ready to bundle up our icon.

Step 5:

Open your chrome browser and click on the little wrench icon which looks like this



Then click Tools->Extensions. In the Extensions click 'Developer Mode'

Now click the 'Load unpacked extension...' button. When it prompts you to select the folder of your app, point it to the 'Firstapp' folder which we created in the local drive.


Thats it, chrome will bundle it for you and place it in your app dashboard with your icon and app name. Now you can click that icon to go to your favourite page.

Thanks for reading. Share if you like. See you soon with other tutors.