2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

ChatGPTのチャット画面の印刷

Last updated at Posted at 2023-11-06

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();})();

2003/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ページも同じ様に印刷に問題ありだが、このブックマークレットで対応可能

2
2
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?