WordPressなどのWebサイトにChatGPTを使ったAIチャットを設置してみたい。
でも、ChatGPT APIを使って本格的なチャットボットを開発するほどではない。
もっと簡単に、今あるWebサイトやブログの記事からChatGPTと会話を始める方法はないだろうか。
そんなことを考えて、APIを使わずに**「この記事についてChatGPTと話す」**という導線を作ってみました。
きっかけは、私が禁煙について書いているnoteでした。
35年間吸っていたタバコをやめてから気づいたことや、禁煙を続ける中で変わったことを書いているのですが、ある記事を書き終えたとき、ふと思いました。
この記事を読んだ人が、その続きをAIと話せたら面白いんじゃないか。
コメントを書くほどではない。
筆者に質問するほどでもない。
でも、
「これ、自分の場合はどうなんだろう？」
「この部分、もう少し考えてみたいな」
そんな小さな引っかかりが残ることはあります。
そこで記事の最後に、
「この記事の続きを、AIと話してみる」
というリンクを付けてみました。
クリックするとChatGPTが開き、その記事を入口にした会話が始まります。
今回は、この仕組みをWordPressやnoteで実際に試してみた話です。
ChatGPTをWebサイトにAPIなしで設置する仕組み
最初に書いておくと、今回作ったものは、一般的な意味での「Webサイト内チャットボット」ではありません。
ChatGPT APIを使っているわけでもありません。
データベースもありません。
Webサイトの中にAIそのものを組み込んだわけでもありません。
やったことは、もっと単純です。
記事のURLとChatGPTへの指示をセットにして、ChatGPTへ渡すリンクを作っただけです。
たとえば、こんな指示をChatGPTへ渡します。
このWebページの記事について話したいです。
記事URL:
https://example.com/article/
まず記事の内容を確認して要点を理解してください。
そのあと、この内容について私と対話してください。これをURLエンコードして、ChatGPTを開くURLのパラメータとして渡します。
イメージとしては、こんな形です。
https://chatgpt.com/?prompt=URLエンコードした文章リンクをクリックするとChatGPTが開き、あらかじめ用意した文章が渡されます。
つまりWebサイトの中にChatGPTを埋め込むのではなく、
WebサイトからChatGPTへ会話を引き継ぐ。
という仕組みです。
WordPressにChatGPTへのAIチャットボタンを設置してみた
この方法なら、WordPressの記事にも簡単なボタンを設置できます。
私の旅ブログでは、試しに記事の上と下に違う役割の入口を作ってみました。
記事の上には、
「AIと一緒に読む」
記事の下には、
「AIと記事の続きを」
というボタンです。
上のボタンは、記事を読みながら気になったことをChatGPTに聞くための入口。
下のボタンは、記事を読み終わってから、そのテーマについてもう少し話すための入口です。
WordPressならJavaScriptを使って、現在読んでいるページのURLを取得できます。
window.location.hrefこのURLとChatGPTへの指示を組み合わせます。
そのため、WordPress側で共通パーツとして作っておけば、記事ごとにURLを書き換える必要もありません。
今読んでいる記事のURLを自動的に取得して、その記事についてChatGPTと話すためのリンクを生成できます。
ChatGPT APIを使わないので小さく始められる
今回の方法ではChatGPT APIを使っていません。
そのため、Webサイト運営者側でAPIキーを用意する必要もありません。
チャット画面を開発する必要もありません。
会話履歴を保存する仕組みも必要ありません。
会話そのものは、リンクをクリックした読者側のChatGPTで行われます。
Webサイト側が用意するのは、
「この記事についてAIと話してみませんか？」
という入口だけです。
本格的なAIチャットボットを開発するのではなく、まず小さく試してみる。
個人的には、このくらいの仕組みが気に入っています。
noteの記事からChatGPTと対話できるリンクも作ってみた
WordPressで動いたので、今度は禁煙について書いているnoteでも試してみました。
noteではWordPressのように自由にJavaScriptを設置することはできません。
そこで、記事ごとにChatGPTへ渡すリンクを作りました。
記事の最後に、
「この記事の続きを、AIと話してみる」
という普通のテキストリンクを置くだけです。
試しに、サービスエリアでタバコを吸っていた頃のことを書いた記事につけてみました。
昔はサービスエリアに着くと、妻を車に残してまず喫煙所へ行く。
戻ってきても、出発前にもう一本。
禁煙してからは、妻と一緒に車を降りて、店を見て、お茶を買って、一緒に車へ戻るようになった。
そんな内容の記事です。
そこでChatGPTに、単に、
「この記事について話してください」
とだけ渡すのではなく、
「健康やお金だけでなく、禁煙によって誰かと過ごす時間がどう変わったのかを入口に、読者自身の経験についても対話してください」
という意味の指示を加えてみました。
するとChatGPTは記事を読んで要約するだけではなく、
「あなた自身にも、やめてから初めて気づいた時間の変化はありませんでしたか？」
という方向へ会話を広げてきました。
これが、なかなか面白かった。
ChatGPTに渡すプロンプトも記事ごとに変えてみる
最初は、どの記事にも同じプロンプトを渡せばいいと思っていました。
でも実際に試してみると、それではちょっともったいない。
記事によって、読後に残るものが違うからです。
サービスエリアの記事なら、
「誰かを待たせていた時間」
について話してみる。
「禁煙は我慢ではなく設計だった」という記事なら、
「自分はどんなときに吸いたくなるのか」
について話してみる。
旅の記事なら、
「自分ならどんな旅をしてみたいか」
という方向へ話を広げてもいい。
そこで最近は、記事の内容をChatGPTに確認してもらい、
「この記事を読んだ人なら、このあとどんなことをAIと話したくなるだろう？」
というところから、記事専用の対話プロンプトを作るようにしています。
技術的には同じリンクです。
でも、リンクをクリックした先で始まる会話は記事ごとに違います。
AIチャットはコメント欄とは少し違う
この仕組みを試していて、ひとつ気づきました。
記事を読んで何か思うことがあっても、コメントを書くところまではいかないことって結構あります。
「なるほどな」
「ここだけちょっと気になる」
「自分の場合は違うな」
そのくらいで終わることの方が多い。
コメントを書くとなると、筆者に読まれます。
他の読者にも読まれるかもしれません。
それなりに文章としてまとめようともします。
でもAI相手なら、
「俺の場合はちょっと違うんやけど」
から始めてもいい。
これはコメント欄の代わりではありません。
コメントは筆者との対話。
今回作ったものは、
記事を材料にした、自分自身との対話。
そんな違いがあるように思います。
ChatGPTのURLパラメータは公式に保証された方法ではない
ここは重要なので、はっきり書いておきます。
今回利用しているURLパラメータによるプロンプトの受け渡しは、Webサイト向けの恒久的な連携APIとして動作が保証されたものではありません。
私が試した時点では動いていますが、ChatGPT側の仕様変更によって、突然使えなくなる可能性があります。
パラメータの形式が変わるかもしれません。
プロンプトが渡らなくなるかもしれません。
URLそのものが期待どおりに動かなくなる可能性もあります。
そのため、私は業務システムの重要な機能として、この方法に依存するつもりはありません。
あくまで、
「こんなことができたので試してみた」
という実験です。
WordPressなら共通パーツとして実装しておけば、仕様が変わったときにも一カ所を修正すれば対応できます。
一方、noteの記事に直接リンクを大量に貼ってしまうと、仕様変更時の修正が大変です。
そのため私は、
WordPressでは積極的に試す。
noteではプロフィール的な固定記事と、ここぞという記事に絞る。
今のところ、そんな使い方を考えています。
WebサイトにChatGPTを設置して面白かったのは、技術ではなかった
今回、最初は、
「WebサイトからChatGPTを開けたら面白いな」
くらいの遊びでした。
でも実際に試してみると、面白かったのは技術の部分ではありませんでした。
これまで記事は、読んだらそこで終わりでした。
書き手が書く。
読者が読む。
感想があればコメントする。
でも、その間には、
「コメントするほどでもないけど、ちょっと気になる」
という大量の小さな引っかかりがあったんじゃないかと思います。
そこにAIとの対話を置いてみる。
すると、
記事を読む
↓
少し引っかかる
↓
ChatGPTと話してみる
↓
自分自身の経験や考えに話が移る
という流れが生まれました。
記事そのものを書き換えたわけではありません。
AIチャットシステムを開発したわけでもありません。
リンクを一本追加しただけです。
でも、記事の「出口」が少し変わりました。
WebサイトにChatGPTを「設置する」というより、
記事の続きを、読者とAIに渡してみる。
今のところ、そんな使い方が一番面白いと感じています。
そしてこの記事の最後にも、もちろん付けてみようと思います。
この記事の続きを、AIと話してみる
さて、この記事からなら、AIはどんな話を始めるでしょうか。
この記事で紹介した仕組み、あなたのWebサイトならどんな使い方ができそうでしょうか。
WordPressやブログの記事を「読んで終わり」にせず、AIとの対話につなげる方法をChatGPTと一緒に考えてみてください。