Microsoft Edge （マイクロソフト エッジ）で空白のお気に入りを新規追加して、ブックマークレットを作成。お気に入りバーから実行する方法。

目次

Edge でブックマークレットを実行したい

今回の投稿は、ウェブブラウザの Microsoft Edge マイクロソフト エッジ で、ブックマークレットを新規作成して実行するテストを行ってみたいと思います。

ブックマークレットは、ウェブブラウザのお気に入り、ブックマークの URL 設定欄に Javascript ジャバスクリプトの命令文を記述して、ウェブブラウザから実行できる機能のようです。

テストに使用する Microsoft Edge  のバージョンは 111.0.1661.62 、パソコンの OS は Windows11 Home 64 ビットです。

以下、ステップ 1 から 3 までありますが、良ければご覧下さい。

目次まで戻る

1. お気に入りバーを表示

まずは、 Edge のお気に入りバーを表示してみます。

1. Edge の右上に表示されている「 ... 」をクリックして、「設定など」を開きます。「Alt + F」のキーボードショートカットでも開くようです。（下図 1）
2. 下の方にある「設定」をクリックします。（下図 2）

1. 左側の「外観」をクリックします。（下図 1）
2. 「外観」ページを下の方にスクロールしていくと、「ツール バーのカスタマイズ」という項目があります。その配下の「お気に入りバーの表示」の項目を探します。（下図 2）
3. 「お気に入りバー」の表示方法を「常に表示」「なし」「新しいタブのみ」の中から選択します。今回は「常に表示」を選んでみました。（下図 3）
4. 「設定」ページを閉じるか、前のページに戻って完了です。（下図 4）

1. お気に入りバーが表示されました。私の場合は 9 個のお気に入りを既に登録していたので、 A ～ I まで 9 個のお気に入りがお気に入りバーに表示されています。
   I はフォルダになっていて、この中にもお気に入りが複数入っています。（下図 1）

補足

正式な方法では無いかもしれませんが、 Edge で「edge://settings/appearance」にアクセスしても「外観」設定のページを表示出来ました。

「edge://」から始まる特殊な URL なので Edge 固有の URL のようです。

ウェブブラウザの Firefox ファイヤーフォックス で「edge://settings/appearance」にアクセスしようとしたところ、検索エンジンの検索結果ページに飛びました。

目次まで戻る

2. ブックマークレットを新規作成

次は、新規のブックマークレットを追加してみます。

1. ☆ 印に横棒 3 本の「お気に入り」をクリックします。「Ctrl + Shift + O（オー）」のキーボードショートカットでも同じ動作になるようです。（下図 1）
2. 「...」をクリックします。その他オプションが表示されます。（下図 2）
3. 「お気に入りページを開く」をクリックします。（下図 3）

1. 「お気に入りバー」をクリックします。（下図 1）
2. 「お気に入りバー」の中のお気に入りが表示されています。（下図 2）
3. 余白のような何もない所で、右クリックします。（下図 3）
4. 「お気に入りの追加」をクリックします。（下図 4）

1. 「名前」の項目に自由な名前を入力します。今回は「test テスト」と入力してみました。日本語でも良いようです。（下図 1）
2. 「URL」の項目に Javascript ジャバスクリプト の命令文を入力します。今回は以下の文字を入力しました。（下図 2）
   画面にメッセージを表示する Javascript の記述です。「Javascript:（コロンの記号）」から始まる書式になっています。
   「alert("abc");（セミコロンの記号）」が実際の命令文になっています。

   javascript:alert("abc");

3. 「保存」をクリックします。（下図 3）

1. 「お気に入りバー」をクリックします。（下図 1）
2. 「お気に入りバー」の中に「test テスト」という名前のお気に入りが追加されています。（下図 2）
3. 上部に表示されている「お気に入りバー」の中にも「test テスト」という名前のお気に入りが追加されています。（下図 3）
4. 「お気に入りバー」の中に隠れているお気に入りは「>」をクリックして表示できます。（下図 4）
5. 隠れているお気に入りが表示されています。（下図 5）
6. 新しいタブを開きます。「 Ctrl + T 」のキーボードショートカットでも同じ動作になるようです。（下図 6）

補足

1. またしても補足ですが、 Edge で「edge://favorites/」の URL にアクセスしても「お気に入りページ」を開くことができました。
   ウェブブラウザ Firefox で「edge://favorites/」を開こうとしたところ、検索結果のページに移動しました。
   やはり「edge://」から始まる URL は Edge 専用の画面のようです。（下図 1）
2. 「お気に入りページ」が表示されている。（下図 2）

目次まで戻る

3. ブックマークレットを実行

1. 「新しいタブ」が表示されています。「新しいタブ」では無くても通常のウェブページ上でもブックマークレットを実行できるようです。
   「edge://」から始まる Edge の専用画面ではブックマークレットを実行出来ないようです。（下図 1）
2. 「test テスト」をクリックします。上記で新規に作成したブックマークレットです。（下図 2）
3. 「javascript:alert("abc");」のジャバスクリプトが実行されて「abc」のメッセージが表示されました。（下図 3）
4. 「OK」でメッセージを閉じます。（下図 4）

目次まで戻る

複数行のブックマークレット

複数行のジャバスクリプトを実行するブックマークレットのテストも行ってみたいと思います。

1. ウィンドウズの「メモ帳」アプリを開きます。（下図 1）
2. 複数のジャバスクリプトのコードを記述しました。（下図 2）
3. すべての文字を選択してコピー（Ctrl + C）します。（下図 3）

javascript:
var a=1+2+3;
alert(a);

1. Edge で「お気に入りバー」の中に新規のお気に入りを追加します。名前は「複数行のブックマークレット」としてみました。（下図 1）
2. 上記でコピーしたジャバスクリプトのコードを、そのまま貼り付けます（Ctrl + V）。そうすると １ 行の URL のように自動で整形されて表示されました。（下図 2）
3. 「保存」します。（下図 3）

1. Edge で「お気に入りバー」の中に登録されている「複数行のブックマークレット」を実行してみると「6」という足し算の計算結果がメッセージとして表示されました。（下図 1）

目次まで戻る

関数を呼び出すブックマークレット

関数を呼び出すブックマークレットの作成テストも行ってみたいと思います。

1. ウィンドウズの「メモ帳」アプリで以下のジャバスクリプトのコードを作成しました。このコードをすべてコピー（Ctrl + C）します。（下図 1）

javascript:ab();

function ab() {
    var a=document.title;
    var b=location.href;
    document.open();
    document.write("<div style=\"font-size:3em;\"><p>"+a+"</p>"+"<p>"+b+"</p></div>");
    document.close();
}

1. Edge で「お気に入りバー」の中に新規のお気に入りを追加します。今回の名前は「関数を呼び出すブックマークレット」としてみました。（下図 1）
2. 上記のジャバスクリプトのコードを、そのまま貼り付けます（Ctrl + V）。貼り付けると １ 行のコードのように表示されると思います。（下図 2）
3. 「保存」します。（下図 3）

Edge で当ブログの以下のページを表示して「お気に入りバー」に保存されている「関数を呼び出すブックマークレット」を実行してみます。

実行結果を以下にコピー、ペーストしてみました。

スマホにイヤホン端子の差し込み口が無い場合は USB タイプ C 変換ケーブルが便利です。 – pulogu.net

https://pulogu.net/blog/010-leisure/smartphone-earphone-terminal-no-outlet-usb-type-c-conversion-cable/

目次まで戻る

編集

追加したブックマークレットを右クリックして「編集」をクリックすると、「お気に入りの編集」を行えるようです。 JavaScript のコードを修正できるようです。

目次まで戻る

テスト環境

• Microsoft Edge バージョン 111.0.1661.62
• Windows11 Home 64 ビット

以上、閲覧ありがとうございました。

目次まで戻る