【広告】

Amazonブラックフライデーが12月2日まで開催中です!

個人的には、Anker製品か、コカ・コーラがかなり安くなっているのでおすすめです!

高級キーボードで有名な東プレが最近発売した「REALFORCE R3」もセールをやっていました!詳しくはこちらの記事を確認してみてくださーい。

【Vivaldi】開いているタブのタイトルを取得する3つの方法。Chrome拡張機能とブックマークレットを紹介!

2021年10月9日Vivaldi,ブログ

Vivaldi のアイコン

この記事では、Vivaldi で開いているページのタイトルを取得する方法について書きます。

Chrome拡張機能、ブックマークレット、コマンドチェインの3つを紹介します。

ページのタイトルを取得するダイアログ

僕はブログを書いている時によく他の方の記事を参考にします。その時に引用をするんですが、記事タイトルを取得するのが結構めんどくさいです。

普通ならサイト内に記事タイトルが書かれているので、そちらをコピーします。しかし、マウスで範囲選択するのもめんどくさいし、記事タイトルがないサイトもあるので困ります。

記事タイトルをコピー

そこで記事タイトルをより簡単・正確に取得する方法について書きます。

難しい知識は一切必要なく、正確・かつ高速に記事タイトルをコピーできます。

3つの方法

3つ紹介します。どれもおすすめで、優劣つけがたいので好きな方法を選んでください。

星は5にいくほど良いって意味ですが、人によりけりだと思います。

初心者さんはChrome拡張機能、中級者以上~さんになるとブックマークレット、コマンドチェインがおすすめです。

【初心者向け】Chrome拡張機能を使う

CopyTabTitleUrl と呼ばれるChrome拡張機能を使うと簡単にタイトルをコピーできます。

具体的にはボタンクリックだけでウェブページのタイトルやURLを取得できます。開いているサイトだけでなく、ウィンドウ内のすべてのタイトルを取得することもできます。

難しい知識も必要ないので、初心者さんに一番おすすめです。

Chromeウェブストアから入手できます。

コピーしたいサイトを開いて、Chrome拡張機能のボタンをクリック → title か、URL をクリックします。これだけでクリップボードにコピーされます。

CopyTabTitleUrl のスクリーンショット

開いているタブだけでなく、ウィンドウ単位か全てのタブの一括コピーもできます。大量にサイトを開いて一括でExcel 等に貼り付ける時に便利です。

Chrome拡張機能なのでインストールするだけですぐに使える点がいいですね。

より詳しく知りたい場合は、以下の記事を参考にしてみてください。

参考:【CopyTabTitleUrl】ページのURLとタイトルをコピーするchrome拡張機能の使い方 | ナポリタン寿司のPC日記

【中級者以上向け】ブックマークレットを作成する

ブックマークレットと呼ばれるブックマーク上で機能するJavaScript のコードを利用する方法です。「とりあえず機能すればいい!」っていう初心者向けの記事なので詳しい仕組みや説明は省きます。

どこでもいいので適当なサイトを開きます。試しにGoogle を開きます。

ブックマーク追加画面のURL の部分にこれから紹介するコードを貼り付けます。

ブックマーク登録画面

【ダイヤログあり】タイトルだけ取得

タイトルのみ取得したい場合は、以下のコードになります。そのままコピペしましょう。黄色ハイライト部分は、自分の好きな文字に変えてOKです。

javascript:prompt('タイトルだよ!',document.title);if(history.replaceState){history.replaceState({},null,location.href);};

ダイヤログってのはコピーした時に、ポップアップメニューを表示するかどうかです。

【ダイヤログあり】URLだけ取得

javascript:prompt('URLだよ',location.href)();if(history.replaceState){history.replaceState({},null,location.href);};

【ダイヤログあり】タイトル+URLを取得

javascript:prompt('タイトルとURLだよん',document.title+'%20'+location.href);if(history.replaceState){history.replaceState({},null,location.href);};

【ダイアログなし】タイトルだけ取得

「ダイアログ表示は必要ない!すぐにクリップボードにコピーしてほしい!」という方は以下のコードになります。

javascript:(()=>{const e=document.title,t=document.createElement("textarea");t.textContent=e,document.body.appendChild(t),t.select(),document.execCommand("copy"),document.body.removeChild(t),console.log(`Copyed this website title "${e}"`)})();if(history.replaceState){history.replaceState({},null,location.href);};

【ダイヤログなし】URLだけ取得

javascript:(()=>{const e=`${location.href}`,t=document.createElement("textarea");t.textContent=e,document.body.appendChild(t),t.select(),document.execCommand("copy"),document.body.removeChild(t),console.log(`Copyed this website URL "${e}"`)})();if(history.replaceState){history.replaceState({},null,location.href);};

【ダイヤログなし】タイトル+URLを取得

javascript:(()=>{const e=`${document.title}%20${location.href}`,t=document.createElement("textarea");t.textContent=e,document.body.appendChild(t),t.select(),document.execCommand("copy"),document.body.removeChild(t),console.log(`Copyed this website title and URL: ${e}`)})();if(history.replaceState){history.replaceState({},null,location.href);};

参考:表示しているページのタイトルをコピーするブックマークレット
参考2:Vivaldiのコマンドチェインやブックマークレットのススメ

ダイアログありを選んだ場合は、コピーする時に画面が表示されるのでタイトルを手動で変更できるというメリットがあります。

一方ダイアログなしの場合はタイトルを編集できない分、早いです。頻繁にコピーする方は、ダイアログなしの方がおすすめです。

あとはブックマーク名を分かりやすい名前に変更して作成します。

ブックマークレットを記述

作成できたら、タイトルをコピーしたいサイトを開いて作成したブックマークをクリックします。

ブックマークをクリック

ダイアログでタイトルが表示されます。

あとはコピー(CtrlA)して使いましょう。ダイヤログなしのブックマークレットを選んだ場合は、何も表示されずに一瞬だけアドレスバーにJavaScript が見えるだけです。

ページのタイトルを取得するダイアログ

ダイアログありのコードをコピーしたのに表示されない場合は、コードが間違っている可能性があるので見直してみましょう。

ニックネームをつけておくと便利

「ブックマークバーを表示していない」、「毎回、クリックするのがめんどくさい」という場合は、ニックネームを作成しておくと便利です。これをすることでかなり効率アップします。

作成したブックマークレットを右クリック → 編集 をクリックします。

ブックマークの編集

ブックマーク編集画面が開くのでニックネーム に好きな文字を入力します。効率化がメインなので、アクセスしやすいように1文字~2文字程度がおすすめです。試しに「t」にします。

ニックネーム

次回以降、アドレスバーにtEnterでタイトルが表示されます。かなりスピーディになりました。

ニックネームでブックマーク呼び出し

【中級者以上向け】コマンドチェインを利用する

2つ目に紹介したブックマークレットをコマンドチェインに組み込む方法です。

Vivaldi のコマンドチェインについて詳しく知りたい場合は、以下の記事が参考になります。

参考:【Vivaldi】バージョン4.1で公開された新機能コマンドチェインの使い方・おすすめ紹介! | ナポリタン寿司のPC日記

コマンドチェインは以下のようになっています。シンプルです。

コマンドチェイン - ページタイトルを取得

ブックマークレットなのでこちらで紹介したコードから好きなものを選べます。僕のおすすめはダイアログ表示なしのブックマークレットです。

仕組みはブックマークレットと同じですが、コマンドチェインのほうがおすすめです。理由は、汎用性の高さです。

コマンドチェインにすることでクイックコマンド(F2)、ショートカットキー、マウスジェスチャーなどからアクセスできます。

個人的にはキーボードのショートカットキーがおすすめです。僕はShift+Enterに設定しています。

Shift+Enter にショートカットキー割り当て

Enterは、キー割り当てを変更するフリーソフトChange Key 無変換に割り当ててます。左手だけでコピーできる配置なので非常に便利です。

参考:【Change Key】キーボードの割り当てを自由に変更できるソフトの導入方法・使い方 | ナポリタン寿司のPC日記

コマンドチェインだと他の操作と組み合わせれる点も便利です。例えば、タイトルをコピーしたら自動で1つ前のアクティブタブに戻るとか考え方次第で自由にできます。タイトルコピーしたらそのタブは閉じるとかね。

僕は先にURLをコピー、そのあとにタイトルをコピーして1つ前のアクティブタブに戻るようにしています。これにより自動で記事編集画面に戻ってClibor でサクッと記事タイトル+URLを貼り付けれます。

サクッと引用チェイン

まとめ

以上、Vivaldi でページのタイトルを取得する方法についてでした。

めちゃくちゃ作業効率が上がります。こういうのが簡単にできちゃうVivaldi最高です。

Posted by ナポリタン寿司