Easily Create a Chrome App that is Shortcut Your Website and Publish it

If you notice, most of the Chrome apps at Chrome web store are nothing but just a shortcut to a website. This means there are very little number of codes used to build those apps. Fortunately such bookmark like Chrome apps are so easy to build that can be done any anyone who knows pretty much how to operate a computer.

Currently Google Chrome is the most popular web browser on the market and it’s an advantage to have a Chrome app or extension for your service or website. Here you will learn on how you can easily create a custom Chrome web app that is shortcut to your website and publish it into Chrome web store. This procedure is same for all major platforms Windows, Mac, Linux and Chrome OS. Another advantages is, with this app, you website can be launched from Chrome app launcher in a standalone window like a real app. A chrome app will also improve your branding.

Requirements for building the App

1. Chrome browser
2. A text editor
3. An Icon for your website
4. Your website link

Steps to Create the Chrome App

1. Create a folder with any name on your desktop hard drive.
   
2. Inside the folder, create a text file and rename it into manifest.json. Make sure you removed *.text extension.
   
3. Open manifest.json file using any text editor.
   
4. Paste the following code in the text editor:

   {
    "manifest_version": 2,
    "name": "Website name",
    "description": "Website description within 132 characters",
    "version": "1.0",
    "icons": {
    "128": "128.png"
    },
    "app": {
    "urls": [
    "http://yourwebsite.com/"
    ],
    "launch": {
    "web_url": "http://yourwebsite.com/"
    }
    },
    "permissions": [ "unlimitedStorage", "notifications"]
    }

5. Change the bolded texts with your own information of your website and save the file.
   
6. Put a png logo of 128*128 of your website into the same folder where manifest.json file is located and rename it into 128.png.
   
7. You are done building your app.

Steps to Test the App on your Chrome

1. Open up the Chrome Extension page from Menu > More Tools > Extension or directly entering chrome://extensions/.
2. Enable Developer Mode.
   
3. Now click on Load unpacked extension button and located the folder of your app.
   
4. After the successful load, your app will be listed in extensions like this:
   
5. Now visit the Chrome apps page chrome://apps/ and check your app. You can see the app of TechGainer:
   
6. Click on the app icon to check if it points to your specified website.

Note: You can adjust the graphical area of your icon/logo to match the visual size with other app icons. But keep the total logo in 128*128 dimension.

Publish to Chrome Web Store

To publish your app to Chrome store to let others install your app, head to Chrome Store Developer Dashboard. Pack your app folder into a zip file. Click Choose file and locate you zipped package of the app. Then click Upload. On editor page, input necessary information it asks and then click Preview changes for preview and Publish changes for publishing.

Requirements for Publishing

• You website needs to verified to your Google Webmaster Tools.
• You need to pay one time fee 5$ for verification using Google wallet.

After publication, your app will be available to Chrome web store for all. However you have option to control the regions.

Self-hosting the App on your Website

If you want to let the user install your app directly from your website without visiting Chrome store, checkout official Chrome extension hosting documentation.

Here’s the official tutorial on creating a simple Chrome app for your website. However I hope my post helped you.