Chrome拡張機能を自分のサイトからインストールできるようにする

いちいちWebストアに行かせるのは面倒である。という解決法。

キーボードショートカットをカスタマイズするブラウザ拡張 - ✘╹◡╹✘

インラインインストールをブログエントリーに導入してうっかりインストールできるようにしたい
2016/11/10 10:22

インラインインストールをブログエントリーに導入してうっかりインストールできるようにしたい - psne のコメント / はてなブックマーク

Chrome 拡張機能のインラインインストール

デベロッパーダッシュボードの拡張機能の設定で、インラインインストールの使用を開始する。

インラインインストールを開始する

<link rel="chrome-webstore-item" href="https://chrome.google.com/webstore/detail/ (アイテムID)">

エントリー本文に挿入(HTML)

<p> </p>
<div id="not-install-extension">※Chromeではないようです。お手数ですが、下のリンクからインストールを行ってください。</div>
<div id="install-extension" class="entry-link" data-detail-url="https://chrome.google.com/webstore/detail/ (アイテムID)">
	早速インストールする
	<script>
		// <![CDATA[
		(function () {
			var installButton = document.getElementById("install-extension");
			var notinstallButton = document.getElementById("not-install-extension");
			function chromeExtInstall() {
				chrome.webstore.install(installButton.getAttribute("data-detail-url")
				, function () {
					//成功
					installButton.style.display = "none";
					//alert('インストールしました。');
				}
				, function (code) {
					//失敗
					alert("インストールできませんでした。\n" + code);
				}
				);
			}
				installButton.addEventListener("click", function () {
				chromeExtInstall(this);
			});
			if (typeof chrome === "undefined" || typeof chrome.webstore === "undefined") {
				installButton.style.display = "none";
			} else {
				notinstallButton.style.display = "none";
			}
		})();
		// ]]></script>
	(クリックで開始します)
</div>
<p> (拡張機能のリンク)</p>