VScode拡張機能に「認証チェックマーク」を付けてみた！

VScode拡張機能には謎のチェックマークがついていることがあります。

実はこれ、製作者のホームページを認証した証です。チェックマークをクリックすればホームページに飛ぶことができるので、拡張機能の使い方やブログに誘導したい方はぜひ設定しましょう。

この記事では、下記のサイトを参考に「VScodeの認証チェックマークの付け方」を解説します。

VScodeの認証チェックマークとは？

Visual Studio Code の拡張機能を見ると、上記のようなチェックマークがついていることがあります。

なんか格好いいので「自分も付けたい！」と調べたところ、実は「独自ドメインの認証」でした。クリックすると、登録されているURLに飛びます。

「独自ドメイン」はブログ運営のために取得済だったので、この機会に登録してみることにしました。

VScode拡張機能に「認証チェックマーク」を付ける方法

チェックマークを付ける方法は以下の公式サイトでまとめられています。

あわせて読みたい

October 2021 (version 1.62) Learn what is new in the Visual Studio Code October 2021 Release (1.62)

1．「Manage Publishers & Extensions」でドメインを登録する

認証チェックマークの登録は、「Manage Publishers & Extensions」で行います。

「Visual Studio Marketplace」にアクセスし、右上の「Publish Extensions」をクリックします。

すると、「Manage Publishers & Extensions」に移動します。

Extensionsタブは拡張機能を管理しているタブです。隣の「Details」をクリックしてください。すると「Verified domain」欄があるので、そこに登録するドメインを貼り付けます。今回はhttps://yusu79.comです。

この状態ではまだ「Verify」がグレーのままで押せません。

「Details」を見ると「*」が付いているのが分かると思います。これは未保存のマークです。隣の「Save」をクリックしてください。

すると、以下のように「Verify」が明るくなりクリックできるようになりました。

クリックすると以下のような画面が表示され、DNS設定にTXTレコードを追加する手順が表示されます。これらの値をコピーし、契約しているサーバーでDNSレコードを作成すると認証が完了します。

2．DNSレコードを作成する

DNSレコードを追加するために、ブログと契約しているサーバーの設定画面を開きます。今回はXserverでの設定です。「DNSレコード」設定をクリックしてください。

登録するドメインを選択してください。

右上の「DNSレコードを追加」をクリックしてください。

DNSレコードを作成します。まず「ホスト名」はコピーした「1.」を貼り付けてください。末尾の.〇〇.comは重複するので取り除いてください。

次に「種別」を「TXT」にしてください。最後に「内容」に「2.」を貼り付けてください。後は何もいじらずに「確認画面へ進む」を押してください。

3．「Manage Publishers & Extensions」で認証を完了する

これでDNSレコードが作成されたので、もう一度「Manage Publishers & Extensions」に戻ります。「Verify」を押してください。

すると、緑背景で「DNS configuration verified succeessfully.」と表示されて、認証登録は完了します。

「Details」に戻ると「Verify」が「Remove」に変化し、「Your request to verify the domain is submitted to the marktetplace team for processing.」と表示され認証待ちとなります。

拡張機能にチェックマークがついた！

後日無事認証されると、以下のようにチェックマークがついてました！ クリックするときちんと「ゆすノート | 日々の問題を解決するブログ」に飛びます。

まとめ

VScode拡張機能に「認証チェックマーク」をつける方法を解説しました。

認証チェックマークは、独自ドメインを登録できる機能です。登録方法は「DNSレコード」による認証が採用されており、今回はXserverでの登録を紹介しました。