当サイトは、アフィリエイト・アドセンス広告を掲載しています。消費者庁が、2023年10月1日から施行予定である景品表示法の規制対象(通称:ステマ規制)にならないよう、配慮して記事を作成しています(記事はこちら、消す方法はこちら

参考:令和5年10月1日からステルスマーケティングは景品表示法違反となります。 | 消費者庁

【Vivaldi】スタートページ・スピードダイヤルのカスタマイズ方法

2022年1月20日Vivaldi

Vivaldiのアイコン

この記事では、「Vivaldi(ヴィヴァルディ)」ブラウザのスタートページやスピードダイヤルをカスタマイズする方法について書きます。

Vivaldiブラウザのスタートページのスクリーンショット

Vivaldi(ヴィヴァルディ)」ブラウザには、スタートページと呼ばれる専用のページに、好きなブックマークをサムネイルで登録(スピードダイヤル)できる機能があります。

新しいタブで開くページを「スタートページ」にして、よくアクセスするサイトをスピードダイヤルとして登録しておけば、瞬時に開けます。

サムネイル付きで管理できるので、どのサイトか確認しやすいです。アイコンサイズ・最大列数は、好きなように変更できます。上部には、検索ボックス(Googleなどの検索エンジン)、どのくらい広告をブロックしたかの「プライバシー統計」を配置できます。

好きな背景画像にできます。スタートページ右上にある設定ボタン(⚙)から、クイック設定ができます。設定→スタートページで、より詳しくカスタマイズできます。

感覚としては、家(スタートページ)があって、その中に、自分の好きな家具(スピードダイヤル)を配置していくって感じです。

本記事は、Vivaldiを既にインストールしている前提です。下記記事を参考にしてみてください。

スタートページを開くように設定

デフォルトのホームページ、新しいタブで開くページをスタートページに変更します。設定(Ctrl+F12)を起動して、一般→ホームページを「スタートページ」にします。

Vivaldiブラウザでホームページをスタートページにする手順画像

タブの「新しいタブで表示するページ」もスタートページにします。新しいタブ新しいタブを開くや、ホームボタンホームをクリックすると、スタートページが表示されます。

Vivaldiブラウザで新しいタブで開くページをスタートページにする手順画像

スピードダイヤルの登録方法

スタートページに表示されているスピードダイヤルは、ブックマークの1つです。追加する方法は、大きく3つあります。サクッと編集したい時はスタートページ、もりもり編集したい時はブックマークマネージャーがおすすめです。

ブックマーク登録時に追加する

ウェブサイトをブックマークする際、通常フォルダーではなく、「スピードダイヤル」フォルダーを選択することで、スタートページに追加されます。

ブックマークダイアログから、スピードダイヤルに登録する手順画像

スタートページ内から登録する

スタートページにある「スピードダイヤルを追加」ボタンをクリックします。

スタートページの「スピードダイヤルを追加」ボタンから、スピードダイヤルに登録する手順画像1

登録したいURLを入力して、「追加」をクリックします。フォルダーを作成して、その中に入れることもできます。

スタートページの「スピードダイヤルを追加」ボタンから、スピードダイヤルに登録する手順画像2

登録されます。デフォルトでは、サイトのスクリーンショットがサムネイルとして表示されます。

スタートページの「スピードダイヤルを追加」ボタンから、スピードダイヤルに登録する手順画像3
【ポイント】追加ボタンがない場合

追加ボタンが表示されていない場合は、設定→スタートページ→「追加ボタンを表示」にチェックします。逆に不要な場合は、チェックを外します。

Vivaldiのスタートページに追加ボタンを表示する手順画像1

非表示にした場合は、背景画像の好きなところをダブルクリックすると、追加ダイアログが表示されます。

Vivaldiのスタートページに追加ボタンを表示する手順画像2

ブックマークマネージャーから登録

キーボードのCtrl+Bを押すか、以下のURLをアドレスバーに貼り付けて、Enterを押します。

vivaldi://bookmarks/

ブックマークマネージャーが開きます。「スピードダイヤル」フォルダーがあるので、その中に好きなようにブックマークを移動・作成します。動画を貼っておきます。CtrlShiftと組み合わせることで、複数一気に移動できます。

ずらっと追加されます。

スピードダイヤルに沢山のサイトを一括で追加した画像

特定のフォルダー内にある全てのブックマークをスピードダイヤルに移動したい時は、スピードダイヤルの対象フォルダーを変更したほうが早いかもしれません。フォルダーを選択して、右側の「スピードダイヤル」をチェックします。スタートページに表示されるフォルダーが入れ替わります。

Vivaldiブラウザでスピードダイヤルフォルダーを変更する手順画像
Vivaldi専用の特殊URLの登録

vivaldi://history/」や「vivaldi://mails/」などのVivaldiの特殊なURLも、スピードダイヤルに登録できます。

Vivaldiのスピードダイヤルに特殊内部URLを登録する手順画像1

ただし、サムネイル画像はうまく取得してくれないことが多いので、自分で分かりやすい画像を用意するのがおすすめです。

Vivaldiのスピードダイヤルに特殊内部URLを登録する手順画像2

スピードダイヤルの削除方法

デフォルトでは、YouTube、Yahoo!、Amazon、hulu、Vivaldia(ブラウザ内臓ミニゲーム)などの13ページが登録されています。不要なサービスは、サムネイルにマウスを乗せた時に表示される右上の削除ボタンボタンをクリックすることで、削除できます。

Vivaldiの削除ボタンからスピードダイヤルを消す手順画像

サムネイルを右クリック→「削除」をクリックすることでも消せます。

Vivaldiのスピードダイヤルの右クリックから、削除する手順画像

ブックマークマネージャーからでも同様に作業できます。

2022年2月19日追記

余談ですが、これらの初期で登録されているページのいくつかは、Vivaldiとパートナー契約しているサービスです。このリンク経由で何かお買い物すると、Vivaldiに配分収益が入ります。Vivaldiを応援したい方は、初期で登録されているURLを残して、そのままお買い物するといいかもしれません。Amazonとかです。

カスタマイズ方法

サムネイル画像を変更

自分で好きな画像に変更できます。事前に変更したい画像を、PC内のどこかに保存しておきます。拡張子は、JPG、JPEG、PNG、BMP、GIF、WEBPの6種類に対応しています。

Windows11のエクスプローラーのスクリーンショット
ポイント

アイコン画像を変更したからといって、PCに保存した元画像を削除してはいけません。

元画像を削除すると、スピードダイヤルに設定した画像も一緒に非表示になります。PC内にある画像と連携しているので、どこかのフォルダーの中に、まとめて管理しておくのがおすすめです。

PC内の画像を削除したせいで、スピードダイヤルの画像が取得できていないスクリーンショット

スピードダイヤルのサムネイルにマウスを乗せると、左上にプラスボタンアイコンが表示されるのでクリックします。

スピードダイヤルの画像を任意の画像に変更する手順画像1

エクスプローラーで画像選択ダイアログが表示されます。変更したいアイコン画像を選択して、「開く」をクリックします。

スピードダイヤルの画像を任意の画像に変更する手順画像2

アイコンが変更されます。

スピードダイヤルの画像を任意の画像に変更する手順画像3

余談ですが、動くアニメーション画像(例:GIF)も登録できます。自作できる方は、個性を出せると思います。ただし、毎回ヌルヌル動くので、目障りかもしれません。

GIF画像ではなく、WEBPなどでも可能です。動画からアニメーションWEBPに変換してくれるサービスもあります。(例:Video2WebP)詳しくは、Vivaldiフォーラムに投稿してくださっている方がいるので、リンクを貼らせていただきます。

参考:テーマの背景をpngやWebPでアニメーション | Vivaldi Forum

【余談】初期で用意されているサムネイルの保存場所

デフォルトで用意されているサムネイル画像については、以下の場所に保存されています。

%LOCALAPPDATA%\Vivaldi\Application\バージョン名\resources\vivaldi\resources

バージョン名に、現在自身が使っているVivaldiのバージョン(数字)が入ります。そのまま上記をコピーして、エクスプローラーのアドレスバーに貼り付けても開けないので注意です。Applicationまでは、恐らく皆さん一緒なので、そこまでをコピペして、そこからポチポチクリックするのがいいかもしれません。

resourcesフォルダーの中は、色々なサムネイル画像が保存されています。サイトのサムネイルについては、「sd_thumbnails」フォルダー内に、「sd_〇〇」という名前で保存されています。

「%LOCALAPPDATA%\Vivaldi\Application\バージョン名\resources\vivaldi\resources」フォルダー内のスクリーンショット

元の画像に戻したい時に役立つかもしれません。初期で用意されているサービス以外にも、沢山のサイトアイコンが保存されていました。国によって主要のサービスが違うため、使い分けているのかなぁと思います。日本では13種類でしたが、別の国だともっと多かったり、少なかったりするんでしょうかね。

列幅、サムネイルサイズについて

Vivaldiの設定→「スタートページ」で、スピードダイヤルの表示方法について設定できます。これから紹介するカスタマイズ項目は、全てこちらの設定画面から変更できます。

Vivaldiのスタートページ設定画像

スピードダイヤルの列数、サイズを変更できます。列数は1~12までと無制限が用意されています。

Vivaldiのスタートページ設定内にある「最大列数」画像

一列と無制限にした比較画像を貼っておきます。無制限にすると、入る分だけ横に表示します。スピードダイヤルのサイズを「中」にしている場合だと、大体6列くらい表示されます。

Vivaldiのスピードダイヤルの列数を一列、無制限にした比較画像

アイコンサイズは、2023年4月時点で以下の7つから選べます。個人的には、スッキリコンパクトの「アイコン」が好きです。

  • アイコン
  • 極小
  • 巨大
  • 列の大きさに合わせる
Vivaldiのスピードダイヤルのサイズを巨大、小、アイコンにした比較画像

Vivaldiaの表示について

Vivaldiaをプレイしない場合は、Vivaldiオリジナルゲームの「スピードダイヤルに表示」のチェックを外します。

Vivaldiオリジナルゲーム「Vivaldia」の表示・非表示を切り替えた比較画像

スタートページのナビゲーション

スタートページ上部に表示されるスピードダイヤル、ブックマーク、履歴、メモを切り替えられるバーのことです。使わない方は、スタートページの設定で、「スタートページのナビゲーション」を「タイトルを非表示にする」にします。

Vivaldiのスタートページにあるナビゲーションバーの表示を切り替えた比較画像

スピードダイヤルの外観

サイト名の表示を設定できます。以下の3種類から選択できます。

  • タイトルを表示する
  • ホバー時にタイトルを表示する
  • タイトルを非表示にする

「ホバー時にタイトルを表示する」にしてみた動画を貼っておきます。

「基本は、サムネイルで判別するからタイトルは不要!でも、ふとした時にタイトルを見たい時がある!」という方は、「ホバーで表示する」がいいかもしれません。僕は不要なので、「タイトルを非表示にする」にしています。

ファビコンを表示する

サイトタイトルを表示するようにした場合、タイトル名の左にアイコンを表示するかどうかの設定です。比較画像を貼っておきます。

スピードダイヤル サイトファビコンを表示・非表示した比較画像

タイトルを表示するようにしている方は、オンにした方が見やすいのかなぁと思います。そもそも非表示にしている方には関係ない項目です。

サムネイルコントロール&削除ボタン

スピードダイヤルにマウスを乗せると、左上に小さいボタン(サムネイルコントロールボタン)が表示されます。不要な場合は、「サムネイルコントロールボタンを表示する」のチェックを外します。

Vivaldiのサムネイルコントロールボタン画像

「うっかり押し間違えて、サムネイル更新ボタンを押してしまう!折角カスタマイズしたアイコンがパーになって、リセットされてしまう!」という方は、非表示にしておくと便利です。

非表示にしていても、サムネイル画像の変更は、スピードダイヤルの右クリック→「カスタムサムネイル画像を選択」からできます。

Vivaldiのスピードダイヤルの右クリックから、カスタムサムネイルを変更する手順画像

プライバシー統計

Vivaldi5.2(2022年4月6日公開)」から実装された機能です。スタートページ内にプライバシー統計と呼ばれるバーが追加されました。Vivaldi標準の広告ブロッカーがどのくらい機能したかを確認できます。

不要な場合は、スピードダイヤルの外観→「プライバシー統計を表示」のチェックを外します。

「Vivaldi5.2(2022年4月6日公開)」から実装されたプライバシー統計バーのスクリーンショット1

「詳細情報」をクリックすると、具体的なブロックした数が表示されます。

「Vivaldi5.2(2022年4月6日公開)」から実装されたプライバシー統計バーのスクリーンショット2

背景画像の変更

設定→「テーマ」から変更できます。エディタータブ→背景→「画像を選択」から、好きな画像に変更できます。「デスクトップ画像を使用」を押すと、PCのデスクトップと同じ壁紙が適用されます。

Vivaldiのスタートページの背景画像を「デスクトップ画像(Windows11)」にしたスクリーンショット

テーマのカスタマイズについて、下記記事を参考にしてみてください。

カスタムCSSでより自由にカスタマイズ

CSSで外観をカスタマイズできるカスタムCSS機能があります。CSSを理解していないと、使うことはできません。

「カスタムCSS使ってみたーい!」という方は、下記記事を参考にしてみてください。初心者でも理解できるように、書いているつもりです。

スピードダイヤルの背景色を透過して、アイコンのみ表示にする…といったことが可能です。

スタートページをカスタマイズするCSSの適用前と適用後の比較画像

マウスホバー時だけスピードダイヤルを表示する…といったことも可能です。

本記事で紹介した以外のスタートページ関連のCSSを知りたい場合は、当サイトの検索ボックスで「スタートページ CSS」と検索してみてください。

ブックマークレットを活用してアイコン入手

サイトのアイコン画像を入手したい場合は、ブックマークレットを活用するといいかもしれません。ブックマークレットとは、ブックマーク上で動作するプログラム(JavaScript)のことです。

Vivaldiの設定を開いて、クイックコマンド→コマンドチェイン欄を表示します。新しいチェインを作成して、コマンド1を「現在のタブでリンクを開く」にします。URLの部分を下記コードにします。

javascript:(function()%7Bvar%20i%3D0%3Bvar%20arrLink%3D%5B%5D%3Bvar%20found%3D0%3BarrLink%3Ddocument.getElementsByTagName('link')%3Bif(arrLink.length%20%3E%200)%7Bfor(i%3D0%3Bi%20%3C%20arrLink.length%3Bi%2B%2B)%7Bif(typeof%20arrLink%5Bi%5D.rel%20!%3D%3D'undefined'%20%26%26%20arrLink%5Bi%5D.rel.indexOf('icon')%3E%20-1)%7Bfound%3D1%3Bwindow.open(arrLink%5Bi%5D.href)%3B%7D%7Dif(found%3D%3D%3D0)%7Balert('favico%20Not%20Found')%3B%7D%7Delse%7Balert('favico%20Not%20Found')%3B%7D%7D)()%3Bvoid(0);
Vivaldiの「ブックマークアイコンを取得」コマンドチェイン画像

ブックマークレットレット(コマンドチェイン版)の完成です。

アイコンを入手したいサイトを開きます。クイックコマンドダイアログを起動します。デフォルトでは、F2になっています。先ほど作成したコマンドチェインの名前を入力して実行します。

コマンドチェイン(JavaScript)を使って、サイトからアイコン画像を取得する手順画像1

コマンドチェインを実行したサイトのアイコン画像が、新しいタブで表示されます。右クリックで画像を保存できます。ただし、確実にアイコンを取得できるわけではなく、サイトによっては表示されない&画像サイズが小さい場合もあります。

コマンドチェイン(JavaScript)を使って、サイトからアイコン画像を取得する手順画像2

外部サービスを利用して作成

VIVALDI THUMBNAIL GENERATOR」と呼ばれるサイトで、いい感じのスピードダイヤル用サムネイルを作成できます。ブックマークからファビコンを取得して、好きなアイコンサイズ、背景色にできます。

VIVALDI THUMBNAIL GENERATORのスクリーンショット

背景色を指定できるので、全て同じ色にすると統一感が出ます。

感想

以上、「Vivaldi(ヴィヴァルディ)」ブラウザで、スタートページ、およびスピードダイヤルをカスタマイズする方法でした。

僕はホームページをスタートページにしているので、登録したスピードダイヤルが、すぐ目に入ります。頻繁に開くサイトを登録しています。

2022年1月20日Vivaldi