【Vivaldi】サイドバーの使い方。ウェブパネルが便利!

2022年1月7日Vivaldi

Vivaldiのアイコン

この記事では、ウェブブラウザ「Vivaldi」のサイドバー(パネル)について書きます。

ブックマーク、履歴、開いているタブ、好きなウェブサイト等を登録できます。

Vivaldiのパネルのスクリーンショット

左右どちらかにパネルと呼ばれるサイドバーを展開して、ブックマーク、リーディングリスト、履歴、メモ、ダウンロード履歴、メール、RSS、カレンダー、好きなウェブサイトなどを確認できる機能です。

パネルは独立しているので、いつでもどこでも展開できる、パネル上で操作が完結できる点が特徴です。例えば、Google検索している時に、パネル内で履歴やブックマークを確認するといったことができます。もちろんクリックで飛べます。

いちいちCtrl+Bでブックマークマネージャーを開いたり、CtrlHで履歴を開いたりしなくても、サイドバー内で全て完結します。

ウェブパネルを使えば、サイトを閲覧中に、サイドバーでTwitterを確認する、YouTubeを垂れ流しにしておく…といったことができます。Vivaldiの一押し機能です。

パネル以外のおすすめ設定については、下記記事を参考にしてください。

使い方

キーボードのF4を押すか、左側のパネル開閉バー、または左下の開閉ボタンをクリックします。

パネルの表示

設定から、展開キー、開閉バーは表示切り替えできます。

それぞれのメニューにアクセスするには、各アイコンをクリックします。

各パネルは、クリックで展開する

パネルは以下のようになっています。

各パネルの種類
ブックマークパネルブックマーク
リーディングパネルリーディングリスト
ダウンロードパネルダウンロード履歴
履歴パネル履歴
メモパネルメモ
タブパネルウィンドウ
メールパネルメール(有効にしている場合)
RSSパネルRSS(有効にしている場合)
連絡先パネル連絡先(有効にしている場合)
カレンダーパネルカレンダー(有効にしている場合)
翻訳パネル翻訳
ウェブパネル自分で登録したウェブパネル
新しいウェブパネルを追加ウェブパネルの追加

表示切り替えはショートカットキーでもできますが、同じパネルをクリックすることでも切り替えれます。

パネルの幅は、マウスで調整できます。

サイズに応じてデザインが変化するレスポンシブデザインになっています。ウェブパネルの場合は、途中でスマホ用デザインに切り替わったりします。

パネルごとで幅を変化させたい場合は、固定したいパネルアイコンを右クリック→パネルの幅を記憶をクリックします。

パネルの右クリック パネルの幅を記録

こうすることで、ブックマークパネル、メモパネルで、それぞれ異なる横幅にするといったことができます。

ブックマーク

ブックマークを確認できます。ダブルクリックで開きます。

右クリックで、新しいタブとして開く、名前の変更、削除等ができます。簡単なブックマーク編集ならサイドバーだけで完結します。

ブックマークパネルの右クリックメニュー

設定のブックマークで「新しいタブでブックマークを開く」にチェックが入っている場合は、現在のタブではなく、常に新しいタブで表示します。

設定 ブックマーク

「シングルクリックでブックマークパネルの項目を開く」にチェックを入れると、ダブルクリックではなく、1回のクリックで開きます。

僕はチェックしています。クリックの手間が省けるからです。

リーディングリスト

2022年4月6日に公開されたVivaldi5.2から実装されたパネルです。その一つ前に実装されたリーディングリストと呼ばれる機能のパネル版といった感じです。

後で読みたいと思った記事を、じゃんじゃん登録してパネル内で管理できます。

「ブックマークに登録するほどではない…だけど、開きっぱなしにするのもごちゃごちゃして嫌だ…」という場合は、リーディングリストに登録してみましょう。登録したサイト記事が一覧表示されるので、後からワンクリックで見ることができます。

「後で読む」に登録したいサイトを開いて、リーディングリストパネルの「+」をクリックします。

リーディングリストパネルにサイトを登録する手順画像

追加されます。見たい時はダブルクリックで開きます。

プライムビデオの映画をずらっとリーディングリストに登録した画像
ポイント

ダブルクリックが煩わしいという場合は、設定→パネル→リーディングリストパネル→シングルクリックでアクティブ化にチェックを入れましょう。

これで、ダブルクリックではなく、シングルクリックで記事を開けます。

右クリックメニューも用意されています。CtrlAで全選択、Deleteで削除などのショートカットキーにも対応しています。

リーディングリストに登録したサイトの右クリックメニュー

ダウンロード

ダウンロード履歴を確認できます。「どのファイルをいつダウンロードしたのか~?」が確認できます。

ダウンロードパネル

履歴をずっと残しておくと、重たくなる原因にもなるので、定期的に右上の掃除アイコンアイコンで掃除しておきましょう。

履歴

履歴を確認できます。ブックマークと同様にダブルクリックで開きます。検索欄もあるので、過去履歴を検索する時にも便利です。

並び替え、日付で絞り込みできます。

履歴パネル

メモ

メモを書けます。

メモパネル

タブで開くこともできますが、サクッとメモしたい時はパネルの方がアクセスしやすいです。

vivaldi://notes/

メモは、スマホと同期できます。PCでパパっとメモしてスマホで確認する…といったことができます。

ウィンドウ(タブ)

現在開いているタブ、閉じたタブを確認できます。

クリックでそのタブに移動します。ピン留めしたタブ、スタックしたタブも区別されて表示されます。

ウィンドウパネル

風の噂で聞いたのですが、Vivaldiヘビーユーザーの一部の人は、タブバーを非表示にして、タブパネルを最大限活用しているようです。確かにタブバーと同じようにタブを閉じる、移動、複製、タブスタック、新しいタブを開く…などができるので、不要かもしれませんね。

僕は、基本的にマウスジェスチャーでタブ操作しています。右クリック押しながらマウスを動かすアレです。「新しいタブを開く」、「タブを閉じる」が本当に快適です。

【余談】タブスタック作成

スタックしたいタブを、CtrlShiftを使って複数選択して、右クリック→「選択した〇個のタブをスタック」をクリックします。

ウィンドウパネルの右クリックメニュー

スタックが作成されます。

パネル内でタブスタック作成

実際のタブバーでも反映されます。

タブスタック 二段型のスクリーンショット

メール

メールを確認できます。

メールパネル

ここでいうメールは、設定→メールで追加したアカウントです。Gmailなどを登録できます。

設定 メール

メールパネルの不要な項目は、CSSで非表示にできます。ちょっとしたカスタマイズ例も紹介しているので、ぜひ参考にしてみてください。

フィード

購読したRSSを確認できます。

フィードパネル

メール、RSS、連絡先、カレンダーについては設定→一般→「メール、カレンダー、フィード機能を有効にする」にチェックを入れてないと使えません。

クリックでフィードリーダーを開きます。

カレンダー

Vivaldiに内蔵されているカレンダーを確認できます。

カレンダーパネル

確認だけでなく、新しい予定の追加、削除もできます。

新規予定の追加

翻訳

Vivaldi5.0(2021年12月2日公開)から追加されたパネルです。

翻訳元(自動判定)、翻訳したい言語を設定します。上部に翻訳したい文章を貼り付けして、「翻訳」をクリックすると、下部に翻訳結果が表示されます。

翻訳パネル

設定の翻訳パネルの「ペースト時にテキストを翻訳」にチェックを入れると、貼り付けた時に瞬時に翻訳してくれます。

パネル 翻訳パネル
僕の環境だけ?

僕の環境だけかもですが、翻訳元を「自動判定」にして、ペースト時にテキストを翻訳にしていると、結構な確率で以下のエラーが表示されます。

Translation failed. Server could not determine the language.

翻訳に失敗しました。サーバーが言語を決定できませんでした。

Translation failed. Server could not determine the language.

なんでかは不明です。翻訳元を「英語」にすると改善されます。

「選択したテキストを自動翻訳」にチェックを入れると、パネルを表示している間、翻訳したいテキストを選択するだけで、自動的に翻訳してくれます。

ウェブパネル

自分で登録したウェブサイトを確認できます。例えば、Twitter、Vivaldiメール、ニュースサイト、好きな人のブログ、ブラウザゲームなど自由自在に登録できます。(追加方法はこちら

ウェブパネル

マウスのホイール、クリックなど普通に使えます。

毎日確認するニュースやブログなどをウェブパネルとして登録することで、YouTubeで動画を見てる時に、ささっとパネルでTwitterを確認する…といったことができます。

個人的に一押しウェブパネルは、翻訳サイト「DeepL翻訳」です。

あらかじめ、翻訳元と翻訳結果が並べて表示されるように幅を調整しておきます。幅を狭くしすぎると見えにくくなるので、ある程度広げたほうがいいかなと思います。

ウェブパネル DeepL翻訳

DeepL翻訳をウェブパネルに登録する場合は、余計な要素をCSSで非表示にするとスッキリするのでおすすめです。

展開ショートカットキーを設定しておくと、より便利です。ウェブパネルは上から数字順で登録されています。

設定のショートカットキーから、数字ごとに表示キーを割り当てれます。例えば、DeepL翻訳を上から3番目に登録している場合、「ウェブパネル3」になります。

登録したウェブパネルを右クリック→開く→〇〇タブをクリックすると、パネルではなく、タブで開けます。大きい画面で見たくなった時に便利です。

ウェブパネルの右クリックメニュー

ウェブパネルを追加する

URLを入力して登録する方法、現在開いているタブを登録する方法、ドラッグ&ドロップで一気に追加の3種類あります。好きな方法で登録してみましょう。おすすめは、タブのドラッグ&ドロップです。直感的な操作で追加できます。

現在開いているタブを登録する

ウェブパネルとして登録したいサイトを開きます。試しに、「NHKニュースサイト」を登録してみます。

NHKニュースサイト

パネルを開いて、一番下の新しいウェブパネルを追加アイコンをクリックします。

ウェブパネルの「+」ボタン

現在開いているタブのURLが自動入力されるので、そのままプラスマークをクリックします。

ウェブパネルを追加

パネルに登録されます。

パネル内でNHKニュースを展開

タブをドラッグ&ドロップ

登録したいタブを選択して、そのままパネルの空いている部分にドラッグ&ドロップすることで追加できます。複数選択した場合は、その分登録されます。

おすすめ設定

僕が使っているパネル関係の設定を書いておきます。

ショートカットキー

パネルの展開ショートカットキーを自分の好きなように設定しておくと便利です。

ショートカットキー

デフォルトだとF4ですが、僕はF1にしました。

恥ずかしい話なんですが、僕は典型的な人差し指タイピングです。そんなホームポジションガン無視タイピングだと、F4を押そうとして間違ってF3を押しちゃうことが結構あります。

そこで、押し間違えがおきないように端っこのF1にしました。

パネルのオーバーレイ表示切り替えは、気分によってすぐ切り替えれるようにCtrlOにしています。このショートカットキーは確か別の機能に割り当てられていたような気がしますが、忘れました。

ウェブパネル1には、DeepL翻訳を割り当てています。

ブログ書いていると頻繁に翻訳する機会があるので、サクッと呼び出せるようにしています。あまりに頻繁に展開するので、F3F4両方に設定しています。

2022年4月12日追記

現在では、色々設定も変わっています。

僕の最新設定については、以下の記事を参考にしてみてください。

基本的に設定を変更したら、こちらに追記しています。例えば、2022年4月時点では、パネルの表示切り替えのF1は廃止していて、代わりにクイックコマンドをF1に割り当てています。

パネルの表示方法

設定 パネル

パネル位置

僕は、右にしています。左に垂直タブを配置しているからです。左にタブ、右にパネルという構成です。

右にパネルを表示

パネルオプション

パネル開閉バーは非表示、オーバーレイ表示はオフにしています。基本的には、ショートカットキー(F1)で展開しています。

開閉バー最初はオンにしていたんですが、ちょっとスペース取りすぎだなってのとマウスを持っていくのがめんどくさくなったので、オフにしました。オーバーレイ表示をオンにすると、パネルを開いたあとに、タブの好きな場所をクリックすると自動開閉します。

不要なパネルを非表示

設定からではなく、パネルの空いている箇所を右クリックすることで、不要なパネルを非表示にできます。チェックマークチェックマークが表示するという意味です。

不要なパネルはチェックを外しておくことで、パネルがスッキリします。

パネルの空いている箇所の右クリックメニュー

僕は、以下のようにしています。今のところ(2022年4月時点)フィードとDeepL翻訳を特に使っています。

  • リーディングリスト
  • 履歴
  • メモ
  • メール
  • フィード
  • ウェブパネル(DeepL翻訳、他10件以上)

パネルの並び替え

パネルの項目は、Shiftを押しながらドラッグ&ドロップすることで並び替えできます。

ウェブパネルとパネルは入替えできません。

ウェブパネルの遅延読み込み

オフがおすすめです。

ウェブパネル 遅延読み込み

起動時にバッググラウンドで自動読み込みしてくれるため、すぐにウェブパネルにアクセスできます。

DeepL翻訳の遅延読み込みオンオフ比較動画を貼っておきます。オンにすると、パネルを開いた時にはじめて読み込むので、表示が遅いです。

ウェブパネルを沢山登録している、パソコンのスペックがしょぼい場合は、オンがいいかなと思います。Vivaldiの起動が早くなるかもです。とりあえず試してみて、動作に変化がない場合は、オフにしてみましょう。

パネルが消えた場合

パネルが消えた場合、ショートカットキーかVivaldiメニューから表示できます。

ブラウザ左上のVivaldiメニューをクリック→表示→パネルを表示をクリックします。横に現在設定しているショートカットキーが表示されます。

僕の場合、F1に設定しているので、押すと切り替えできます。デフォルトだとF4です。

Vivaldiメニュー 表示

パネルを消す方法

ショートカットキーを使って、パネルを消すこともできます。使わない場合は、思い切って非表示にしてみましょう。

表示切り替えキーを押すことで非表示にできます。デフォルトだと、F4を1回押すと表示、もう1回押すと非表示になります。間違ってキーを押して表示されるのを防ぐには、一旦パネルを非表示にして、表示切り替えのキーを無効にします。

これでパネルは表示されなくなります。

その際、うっかり表示を防ぐために、以下の設定を変更しとくといいかなと思います。

パネルを非表示にするときのおすすめ設定
パネル
-パネルオプション
パネル開閉バーを表示するオフ
パネルのオーバーレイ表示オフ
ダウンロードダウンロードをポップアップで表示するオン
ダウンロードポップアップを自動的に開く好み
パネルを非表示にしたい時のおすすめ設定

CSSを使うことで、完全に非表示にもできます。Vivaldiの便利な機能を消すということなので、おすすめはしません。

/*パネル非表示*/
#panels-container {
  display: none;
}

CSSについては、以下の記事を参考にしてみてください。

パネルの欠点

3点ほど欠点があります。

  • 一部パネルは1つ目ウィンドウにしか表示されない
  • 一部Chrome拡張機能は使えない
  • マウスのサイドボタンは使えない

一部パネルは1つ目ウィンドウにしか表示されない

RSS、メール、連絡先パネルは、1つ目のウィンドウにしか表示されません。

フィード、メール、連絡先パネルは1つ目のウィンドウにしか表示されない

最初に開いたウィンドウのみに表示され、2つ目以降のウィンドウには表示されません。

僕は、よくメインモニターとサブモニターに2つウィンドウを表示させているので、結構困ります。いつか改善されるといいなぁと思います。

一部Chrome拡張機能は使えない

ウェブパネルの欠点です。一部Chrome拡張機能は動作しません。例えば、CSSを適用する「Stylebot」は、パネル内だと動作しません。

僕は、CSSでTwitterのデザインを変更しているので、パネル内で開いた時のデザインに違和感です。例えば、Twitter プロにすると表示される「プロモーションする」をCSSで非表示にしています。

CSSでカスタマイズしたTwitter画面

パネル内だと通常通り表示されます。CSSが効いていない=Chrome拡張機能が有効になっていないということです。

ウェブパネル内ではChrome拡張機能が適用されない

マウスのサイドボタンは使えない

僕が愛用しているスーパー最強マウス「Logicool G PRO ワイヤレス」には、サイドボタンがついているんですが、パネル内では機能しません。

ブラウザの戻る、進むをサイドボタンでこなしている人にとっては、かなりストレスです。現状、パネル内で戻る・進むは、ボタン操作でしかできません。

ボタンを表示するには、パネル上部のタイトルを右クリック→ツールバー→全てのコントロールを表示をクリックします。

ツールバー 全てのコントロールを表示

戻る・進む・リロード・ホームボタンが表示されます。

ツールバーの戻る・進む・リロード・ホームボタン

CSSを使うことで、タイトルを非表示にして、左揃えにする…ってことができます。

感想

以上、Vivaldiパネルの使い方についてでした。

ブックマークや履歴を一目で確認できるのも便利なんですが、ウェブパネルで好きなサイトを登録できるのが一番便利です。

ナポリタン寿司のPC日記」をパネルに登録してみてください。あぁ違う違う、間違えました。好きなウェブサイトを登録してみましょう!

Posted by ナポリタン寿司