第77話:【コピペで完成】スプレッドシートに「AI自動SEOボタン」を作る方法と、プロンプトの育て方

モダンで親しみやすいフラットイラストスタイルの、明るく鮮やかなクリーンな背景のアイキャッチ画像。中央上部には、大きなボールド体で「コピペでOK!」という日本語テキストを配置。その下には、「スプレッドシートにAI自動SEOボタンを作る!」というサブタイトルを配置。テキストの上にDifyのAIアイコンを配置し、そこから左側と右側へ光る線が伸びている。左側には、WordPressのブロックエディタ画面を模した、ブログ本文テキストが入力された編集画面が配置されている。右側には、Google Sheetsアイコンと、具体的な日本語見出しとサンプルデータが入ったテーブルが配置されている。テーブルの見出しは日本語で「ブログ本文」「SEOタイトル」「メタディスクリプション」「キーワード」と書かれている。テーブルの中には、生成されたサンプルのSEOタイトル、ディスクリプション、キーワードが入力されている。スプレッドシートの画面には、独自の「🤖 AIツール」メニューがはっきりと見える。DifyのAIアイコンの近くには、プロンプトの改善(育て方)を表現するために、小さな歯車や成長する植物のメタファー、またはプロンプトエディタ画面の一部が配置されている。デザイン全体は、簡単さ、迅速さ、そして最適化を強調しており、日本の読者に親しみやすいデザインである。 AI活用

こんにちは!「中年からのAI再スタート」のYasuです。

前回はエラーの嵐を乗り越えてAI経理ボットを作りましたね。

ブログを書いている皆さん、こんな経験はありませんか? 「ふぅ、やっと本文が書き終わった…!さて、あとは記事のタイトルと、検索結果に出る説明文(メタディスクリプション)と、キーワードを決めて…あーもう面倒くさい!!

記事を書いただけで力尽きて、適当なタイトルをつけてしまう。非常によく分かります。

そこで今回は、そんな全ブロガーの悩みを一瞬で解決する魔法のツールを作りました! Googleスプレッドシートに記事の下書きを貼り付けて、画面上の「🤖 AIツール」ボタンをポチッと押すだけで、プロ顔負けのSEOタイトルと説明文が自動生成されるという優れものです。

今回もコピペだけで完成するように手順をまとめました。さらに、私が実際にハマった罠や、「AIが出した微妙な回答を、プロンプト(指示書)で劇的に改善するコツ」も公開します!


ステップ1:Difyで「敏腕SEOコンサルタント」を雇う

まずはAIの脳みそ(Dify)を作ります。今回はLINEボットの時より設定がシンプルですよ!

  1. Difyで新しいワークフローを作成します。
  2. 【開始ノード】
    • 入力フィールドから長文用の**「段落(string)」**を選びます。
    • 変数名を blog_text と入力します。
  3. 【LLMノード】
    • 開始ノードの隣に「LLM」を追加し、以下の「敏腕コンサルタントへの指示書」をシステムプロンプトにまるごとコピペしてください。右上のコピーボタンを押すと一発でコピーできます。

▼ コピペ用:Difyシステムプロンプト

Plaintext

あなたはプロのSEOコンサルタント兼WEBライターです。
ユーザーから送られる「ブログの本文(または要約)」を読み込み、検索エンジンで上位表示されやすく、読者が思わずクリックしたくなる以下の3つのメタデータを生成してください。

1. SEOタイトル(32文字以内。文章内で使われている主要なツール名や固有名詞があれば、必ず含めること。最も重要なキーワードを左側に配置すること)
2. メタディスクリプション(100文字前後。記事を読むメリットを簡潔に伝えること)
3. キーワード(記事を象徴する単語をカンマ区切りで3〜5個)

【超重要】出力は必ず以下のJSON形式のみとし、余計な挨拶や記号は絶対に入れないでください。
{"title": "生成したタイトル", "description": "生成したディスクリプション", "tags": "キーワード1, キーワード2, キーワード3"}

【ブログ本文】
{{blog_text}}

(※一番下の {{blog_text}} は、開始ノードで作った変数を呼び出すためのものです。このままコピペしてくださいね!)

  1. 【終了ノード】
    • 出力変数名を result とし、値に「LLMの出力テキスト」を選びます。

右上の「公開する」を押して、APIキーを発行し、コピーしておきましょう。


Difyの「出力」ノード設定画面。LLM(gpt-4o-mini)によって生成されたブログ関連のテキストデータを、変数 result としてアプリの最終回答に定義し、一連のワークフローを完結させる手順を解説しています。

ステップ2:スプレッドシートの準備と、綺麗にコピペするコツ

次に、作業用のノート(スプレッドシート)を作ります。 1行目の見出しに、A1から順に「ブログ本文」「SEOタイトル」「メタディスクリプション」「キーワード」と入力します。

ここで、**A列にブログ本文を貼り付ける時の「超重要な小ワザ」**をお伝えします!

💡 複数のセルにバラバラにならない貼り付け方 WordPressなどの編集画面から文章をごそっとコピーした後、スプレッドシートのセルを「1回クリック」しただけで貼り付けると、改行のせいで複数のセルに文章が散らばってしまいます。 必ず、**「セルをダブルクリックして、中でカーソルがチカチカ点滅している状態」**にしてから貼り付け(Ctrl+V)をしてください!

💡 画像が混ざっていても大丈夫! コピーした範囲に画像が含まれていても安心してください。ダブルクリックして貼り付ければ画像データは弾かれますし、DifyのAIは非常に賢いので、画像のシステムコード(暗号のような文字列)が混ざっていても華麗にスルーして、文章だけをしっかり読み取ってくれます。

Google Apps Script(GAS)による自作SEOツールのバックエンドコード。スプレッドシートのカスタムメニュー作成、入力データのバリデーション(空欄チェック)、およびDify APIへブログ本文を送信するためのデータ整形手順を網羅したプログラミングの実装例を解説しています。

ステップ3:GASをコピペして「魔法のボタン」を作る

スプレッドシートの画面に、自分専用のオリジナルメニューを出現させます。

  1. スプレッドシートの「拡張機能」>「Apps Script」を開きます。
  2. 最初からある文字をすべて消して、以下のコードをまるごとコピペしてください。こちらもワンクリックでコピーできます。

▼ コピペ用:GASコード

JavaScript

function onOpen() {
  const ui = SpreadsheetApp.getUi();
  ui.createMenu('🤖 AIツール')
    .addItem('SEOデータを自動生成', 'generateSEO')
    .addToUi();
}

function generateSEO() {
  const sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  const activeCell = sheet.getActiveCell();
  const row = activeCell.getRow();
  
  const blogText = sheet.getRange(row, 1).getValue();
  
  if (!blogText) {
    SpreadsheetApp.getUi().alert("エラー:A列にブログ本文を入力してから実行してください!");
    return;
  }
  
  sheet.getRange(row, 2).setValue("AIが考え中...");
  
  try {
    const difyApiKey = 'ここにあなたのDifyのAPIキーを貼り付ける'; // ★ここを変更!
    const difyUrl = 'https://api.dify.ai/v1/workflows/run';
    
    const payload = {
      "inputs": {"blog_text": blogText},
      "response_mode": "blocking",
      "user": "sheet_user"
    };
    
    const options = {
      "method": "post",
      "headers": {
        "Authorization": "Bearer " + difyApiKey,
        "Content-Type": "application/json"
      },
      "payload": JSON.stringify(payload)
    };
    
    const response = UrlFetchApp.fetch(difyUrl, options);
    const resultJson = JSON.parse(response.getContentText());
    
    let aiDataText = resultJson.data.outputs.result;
    aiDataText = aiDataText.replace(/```json/g, "").replace(/```/g, "").trim();
    const aiData = JSON.parse(aiDataText);
    
    sheet.getRange(row, 2).setValue(aiData.title);
    sheet.getRange(row, 3).setValue(aiData.description);
    sheet.getRange(row, 4).setValue(aiData.tags);
    
    SpreadsheetApp.getUi().alert("✨ SEOデータの生成が完了しました!");
    
  } catch (error) {
    SpreadsheetApp.getUi().alert("エラーが発生しました: " + error.message);
    sheet.getRange(row, 2).setValue("");
  }
}

【重要】 23行目あたりの 'ここにあなたのDifyのAPIキーを貼り付ける' を、あなたのAPIキーに書き換えて保存してください。

画面上部の実行ボタンの左を onOpen にして「実行」を押し、「承認が必要です」の画面を進めて許可を出します。 その後、スプレッドシートの画面に戻り、「F5キー」を押して画面を更新すると…上のメニューバーに**「🤖 AIツール」**が出現します!!


ステップ4:【要注意】私がまんまとハマった「青い枠の罠」

完成した!と意気揚々とA2セルに文章を貼り付け、「🤖 AIツール」のボタンをポチッ。 すると**『エラー:A列にブログ本文を入力してから実行してください!』**という無情な警告が。

「ちゃんと入力してるのに!?」とパニックになりましたが、原因は驚くほど単純でした。 私がボタンを押した時、スプレッドシート上で選択されている**「青い枠」が、文章とは関係ない別の場所(F列の13行目あたり)に取り残されていた**のです。

今回のプログラムは、「今、青い枠で選択している行」の文章を読みに行く仕組みです。 ですので、**【文章を入力した「A2」のセルをクリックして、青い枠(選択状態)にしてから、メニューのボタンを押す!】**のが正解です。初心者が絶対につまずく罠なので、お気をつけください(笑)。


GoogleスプレッドシートとGASを活用したSEOツール。ブログ本文からメタディスクリプションやキーワードを自動生成する際、入力不足を検知して「A列に本文を入力してください」と警告を出す、ユーザーフレンドリーなエラーハンドリングの実装例です。

おまけ:AIが考えたタイトル vs 人間が考えたタイトル

実はテスト稼働の時、前回の記事を入れたら、AIは『AI経理ボット作成法:最短ルート公開』という、雑誌の表紙のようなカッコいいタイトルを出してきました。

スッキリしていて良いのですが、SEO(検索集客)の視点では「LINE」や「Dify」といった、読者が実際に検索する「具体的なツール名」が入っていないのが弱点です。私が自分で考えた『【完全図解】コピペで完成!LINE×Difyで作る「全自動・経費仕分けボット」の作り方』という、泥臭くキーワードを詰め込んだタイトルの方が、集客力は圧倒的に上です。

「じゃあ、AIをもっと人間の感覚に近づけよう!」ということで、先ほど紹介したDifyのプロンプト(指示書)のタイトル部分に、こんな一文を付け足しました。 「文章内で使われている主要なツール名や固有名詞があれば、必ず含めること。」

たったこれだけで、AIは「カッコよさ+検索キーワード」を両立したタイトルを出せるように進化します。この「AIを自分好みに育てていく感覚」こそ、AI活用の最大の面白さですね!

皆さんもぜひ、自分だけの最強AIツールを作ってみてください!

コメント

タイトルとURLをコピーしました