Chrome Extension Inline Installation

You’ve probably come across extensions that allow you to install them from their website without ever going to the Chrome extension store. This is what Chrome calls inline installation and it’s a great way to make it easier for users to install an extension.

Overview

Inline installation requires 3 parts. A link tag in the head of your website, a call to the JavaScript function chrome.webstore.install() and lastly the extension must be assigned to the domain you want to use for inline installation.

1. Link Tag

You must add the link tag to the head of your website. Here is an example from my weather extension. Make sure you change the id in the example to your extension id.

<link rel="chrome-webstore-item" href="https://chrome.google.com/webstore/detail/iolcbmjhmpdheggkocibajddahbeiglb">

2. JavaScript Function

This can be setup several different ways but here is an example of how I usually handle it. Once again, be sure to replace the ids with your extension id.

<a href="https://chrome.google.com/webstore/detail/weather/iolcbmjhmpdheggkocibajddahbeiglb" onclick="chrome.webstore.install('https://chrome.google.com/webstore/detail/iolcbmjhmpdheggkocibajddahbeiglb', function() { window.close(); }, function() { window.location.href = 'https://chrome.google.com/webstore/detail/iolcbmjhmpdheggkocibajddahbeiglb' }); return false;">Install Weather</a>

This part has caused me a lot of confusion in the past. I was trying to setup inline install on multiple domains and finally discovered you can only have one domain for inline installs. You must go to your developer dashboard and select a domain that you can verify that you own.

 

Be sure to check out Chrome’s official documentation for extension inline installs. Hope these 3 steps help someone who is having trouble setting up inline installs.


Also published on Medium.

Leave a Reply

Your email address will not be published. Required fields are marked *