【Vivaldi】リーディングリストをHTMLとして出力・保存する方法

2023年1月23日2023年5月2日Vivaldi

この記事では、「Vivaldi（ヴィヴァルディ）」ブラウザのリーディングリストを、HTMLとして一覧出力する方法を書きます。

開発者ツールに、本記事のJavaScriptを実行することで、保存できます。

2023年1月現在、Vivaldiブラウザには、リーディングリストのHTML出力機能は実装されていません。専用の開発者ツールを起動して、とあるJavaScriptを実行することで出力できます。

HTMLファイルで出力したところで、インポート（別ブラウザへの読み込み）ができるわけではありません。ただ登録したリーディングリスト内のサイトを、一覧で表示するだけです。

バックアップ目的や、URL一括オープンで開く時に使えると思います。

別PCに移行する目的なら、Vivaldiのフォルダー（Default）を丸々移行するほうがいいと思います。リーディングリストも移行されます。

参考：【Vivaldi】保存場所を調べる方法＆データのバックアップ方法

1. 【事前準備】コマンドチェインの作成
2. リーディングリストを出力する手順
3. 感想

【事前準備】コマンドチェインの作成

最初にVivaldiブラウザの外観を調べられる開発者ツールを起動する必要があります。ただの開発者ツールではありません。一番手っ取り早いのが、以下のコマンドチェインを作成することです。

専用の開発者ツールを起動するコマンドチェイン
Command1	新しいタブでリンクを開く（`vivaldi://experiments/`）
Command2	遅延（50）
Command3	開発者ツール
Command4	タブを閉じる

リーディングリストを出力する手順

コマンドチェインを発動して、開発者ツールを起動します。僕は、「kai」という名前にしていて、よくクイックコマンドから起動します。

開けたら、「コンソール（Console）」タブを開きます。

以下のコードを貼り付けて、Enterで実行します。

vivaldi.readingListPrivate.getAll(items => {
  let listitems = items.map(item => "<a target='_blank' class='" + (item.read ? "read" : "unread") + "' href='" + item.url + "' data-time='"+item.lastUpdate+"'><img src='https://www.google.com/s2/favicons?domain=" + item.url + "' alt='favicon' width='16' height='16'/>" + item.title + "</a><br>");
  let urls = items.map(item => item.url).join('\n');
  let head = `<!doctype HTML><html><head><title>Vivaldiのリーディングリスト一覧</title><style>body {background-color: #16161c; margin-bottom: 400px; margin-left: 50px;}a {color: #ffffff;}img {margin: 0 10px;}textarea#url-list {min-width: 800px;min-height: 600px;}</style></head><body>`;
  let tail = `<br><textarea id='url-list' readonly>${urls}</textarea></body></html>`;
  let filename = `Vivaldiのリーディングリスト一覧.html`;
  const textfile = new File([[head,listitems.join("\n"),tail].join("\n")], filename, {type: "text/plain"});
  const dl = document.createElement("a");
  dl.download = filename;
  dl.href = window.URL.createObjectURL(textfile);
  dl.click();
});