What is a custom web application

Here's how to create custom Chrome Web App shortcuts for your favorite websites

Google is now pushing Chrome-packed apps, but many Chrome apps are still shortcuts to websites. You can create your own custom web apps to act as shortcuts when the website you want isn't available in the Chrome Web Store.

These Chrome web applications will also appear in the Chrome App Launcher on Windows, Mac, Linux, and Chrome OS. You can open them from the launcher and set them to always open as a window or a pinned tab. This is not possible with standard bookmarks.

This is different from creating system tray and desktop shortcuts so that websites can run in their own windows. You can do this for any website.

Create a custom web application

To do this, we're essentially building the simplest type of Chrome web application from scratch. All you really need is an icon and a web address.

First, create a new folder on your computer for your web application.

Next, create a new text file named manifest.json in your new folder.

Open the manifest.json file in any text editor, e.g. B. Notepad. Copy and paste the following text:

{
"Manifest_version": 2,
"Surname": "Website name“,
"Description": "Description of the website“,
"Version": "1.0",
"Icons": {
"128": "128.png"
},
"App": {
"Urls": [
http://example.com/"

],
"start": {
"Web_url": "http://example.com/"
}
},
"Permissions": [
“UnlimitedStorage”,
"Notifications"
]
}

Change the bold parts of the sample code; replace the website name, description, and url. For example, to start How-To Geek, type "How-To Geek" in the Name field, enter any description, and use the URL http://howtogeek.com.

Next, locate a 128 × 128 PNG image file used as the website's logo. If you don't have a picture that's just the right size, you can crop and resize a larger picture using an image editor such as Paint.NET.

Save the image file under the name 128.png in the folder you created.

Finally, open the page with the Chrome extensions under chrome: // extensions /. Check the Developer Mode box and click the Load Unzipped Extension button.

Navigate to the folder you created and click OK. Chrome installs the web app you just created.

Once the app is installed, you can launch it from the new tab, customize how it opens by right-clicking it, or launch it from the Chrome App Launcher.

You can also click the Package Extension button to package the extension as a single installable CRX file. You can distribute this file to other people so that they can install it.

Locally installed Chrome web applications and extensions won't sync between your computers using Chrome Sync. To save time in the future, you may want to back up your web application folders or .crx files so that you can easily install them on other computers.

The quick and ugly way

You can also add custom shortcuts to your new tab by dragging a bookmark from the bookmarks bar onto the icon grid.

Unfortunately, without a proper name or icon, the big icon is going to be pretty ugly. This bookmark works just like a standard bookmark app, but it cannot be tweaked to make it look better.


Ideally, Google would extend the drag-and-drop functionality to rename these custom shortcuts and simply assign better icons. At the moment we have to be content with the manual solution.