What is this?

ChatGPTのチャット画面を印刷したり、PDFに保存しようとすると、最初の1ページのみとなる。ふと思いついたんだが、動的に生成されているhtmlの現時点の内容を別ウィンドーにコピーさせるブックマークレットを作れば対応出来そうだ。

そのためのブックマークレットをChatGPT自身に作らせた。何度か不十分なコードが作られたが、最終的に出来たものが下記のもの。これを試すと、新しいウィンドーチャット内容が全てコピペされ、それら全てが印刷可能であることが確認できた。

作成したブックマークレット

javascript:(function() {
  var elements = document.querySelectorAll('.group.w-full');
  var content = '';
  for (var i = 0; i < elements.length; i++) {
    content += elements[i].outerHTML + "<hr>";
  }
  var newWindow = window.open("");
  newWindow.document.open();
  var styles = document.querySelectorAll('link[rel="stylesheet"], style');
  var stylesHtml = '';
  for (var j = 0; j < styles.length; j++) {
    stylesHtml += styles[j].outerHTML;
  }
  newWindow.document.write('<html><head>' + stylesHtml + '</head><body>' + content + '</body></html>');
  newWindow.document.close();
})();

作成したブックマークレット(登録用改行無しバージョン)

javascript:(function() {  var elements = document.querySelectorAll('.group.w-full');  var content = '';  for (var i = 0; i < elements.length; i++) {    content += elements[i].outerHTML + "<hr>";  }  var newWindow = window.open("");  newWindow.document.open();  var styles = document.querySelectorAll('link[rel="stylesheet"], style');  var stylesHtml = '';  for (var j = 0; j < styles.length; j++) {    stylesHtml += styles[j].outerHTML;  }  newWindow.document.write('<html><head>' + stylesHtml + '</head><body>' + content + '</body></html>');  newWindow.document.close();})();

2023/11/10 Revised

バージョンアップされてhtmlの構造が少し変わったために、前のが動かなくなったため、選択対象を修正した。

javascript:(function() {  var elements = document.querySelectorAll('.w-full.text-token-text-primary');  var content = '';  for (var i = 0; i < elements.length; i++) {    content += elements[i].outerHTML + "<hr>";  }  var newWindow = window.open("");  newWindow.document.open();  var styles = document.querySelectorAll('link[rel="stylesheet"], style');  var stylesHtml = '';  for (var j = 0; j < styles.length; j++) {    stylesHtml += styles[j].outerHTML;  }  newWindow.document.write('<html><head>' + stylesHtml + '</head><body>' + content + '</body></html>');  newWindow.document.close();})();

使い方

ブックマークレットの登録

ブラウザ上でブックマーク(お気に入り)を1つ作成する。「お気に入りバー」などアクセスしやすいところに作ると良い。
そのブックマークを右クリックして、その編集ウィンドーを開く。そのURLの欄を上記のブックマークレットのJaveScriptコードに入れ替える。ついでにその「名前」を分かり易いものに変更する。

使用

ChatGPTのチャット画面を開いている状態で、登録したブックマークレットを開く。
新しいタブかウィンドーに、チャット内容がコピペされているので、それをプリンターに印刷するか、PDFに出力させる。

印刷設定の「背景のグラフィックス」を印刷するオプションはオンにした方が良い

チャット結果を共有したWebページも同じ様に印刷に問題ありだが、このブックマークレットで対応可能