2025.09.07

スプレッドシート複数セル検索をGASで自動化！コピペでOKなサイドバー作成術

t.inoue

「あのデータどこだっけ？」から解放宣言！検索作業を劇的に変える魔法のサイドバー

日々の業務でGoogleスプレッドシートを使っていると、膨大なデータの中から特定の情報を探し出す作業に追われること、ありませんか？

例えば、町工場の在庫管理表で「A社の部品で、材質がステンレスで、在庫が10個未満のもの」を探したい時。多くの人は、まずキーボードの「Ctrl + F」で検索窓を開くでしょう。

しかし、そこで気づきます。

あなた

あれ？これじゃ1つのキーワードしか検索できない…

仕方なくフィルタ機能を使おうにも、「毎回列ごとに条件を設定するのが面倒くさい」「他の人が作業中にフィルタをかけると迷惑かな？」と、小さなストレスが溜まっていきます。

もし、スプレッドシートの横に「あなた専用の検索ボックス」が表示され、そこに複数の条件を入力するだけで、該当するデータが一瞬で見つかるとしたらどうでしょう？

実はこれ、Google Apps Script（GAS）を使えば、プログラミング初心者でも簡単に実現できてしまうんです。

今回は、コピペでOKなコードを使って、日々の面倒な検索作業を「快感」に変える「カスタム複数検索サイドバー」の作り方を紹介します。AIの力を借りてカスタマイズする方法も解説するので、ぜひ最後までついてきてくださいね！

なぜ標準機能では限界があるのか？小さなイライラの正体
完成イメージ：GASで作る「最強の複数検索サイドバー」
3ステップで実装！コピペでOKの「複数検索サイドバー」作成手順
【AI活用術】Geminiに依頼して自分仕様にカスタマイズしよう
- 依頼ケース1：検索対象の列を変更したい
- 依頼ケース2：検索ボックスを3つに増やしたい
実践！町工場の「作業指示書」管理での活用シナリオ
- 【基本編】今回のサンプルを使って運用
- 【応用編】ハイライトではなく「行の非表示」でさらに見やすく
【まとめ】小さな改善が大きな余裕を生む。まずはコピペから始めよう！

なぜ標準機能では限界があるのか？小さなイライラの正体

まず、私たちが普段感じている「検索の面倒くささ」の正体をはっきりさせておきましょう。これを知ることで、なぜGASで自作ツールを作る価値があるのかが明確になります。

1. Ctrl+F（シート内検索）の限界 手軽さNo.1の機能ですが、最大の弱点は「単一キーワード検索」であることです。

Ctrl+Fだと・・・

「A社」で検索すると、A社のすべての取引履歴が表示されてしまう。
そこからさらに「B部品」を探すには、結局目視で確認するか、検索キーワードを変えて何度も探す必要があります。
複数の条件を同時に満たす行を絞り込むことはできません。

2. フィルタ機能の限界 複数条件での絞り込みといえばフィルタ機能ですが、これも万能ではありません。

フィルタ機能を使うと・・・

設定の手間: 検索のたびに、対象列のフィルタアイコンをクリックし、条件を選択または入力し直す必要があります。頻繁に行う作業としては面倒です。
共同編集時の問題: 複数の人が同時にシートを編集している場合、誰かがフィルタをかけると他の人の表示も変わってしまい、作業の妨げになることがあります。（※「フィルタ表示」機能もありますが、知らない人や使い慣れていない人も多いのが実情です）
直感性の欠如: PC操作が苦手な人にとっては、フィルタの複雑な条件設定（「次と等しい」「次より大きい」など）が難しく感じられることもあります。

こうした小さなイライラが積み重なり、本来数秒で終わるはずの作業に数分かかってしまうのです。

完成イメージ：GASで作る「最強の複数検索サイドバー」

今回私たちが目指すのは、これらの問題を一挙に解決するツールです。まずは完成形をご覧ください。

[ここに、スプレッドシートの右側にカスタムサイドバーが表示されているスクリーンショット画像。サイドバーには「取引先名」「品番」「ステータス」といった複数の入力欄と「検索実行」ボタンが配置されている様子]

Before（従来の悩み）:

A社のデータを探すためにフィルタをかける。
次に、品番の列でさらに絞り込むためにフィルタを設定し直す。
ステータスを確認するために、結局目視で一行ずつチェックする。

After（カスタムサイドバー導入後）:

サイドバーの「取引先名」欄に「A社」と入力。
サイドバーの「品番」欄に「B-001」と入力。
サイドバーの「ステータス」欄に「未完了」と入力。
「検索実行」ボタンをクリック！
該当する行だけがスプレッドシート上でハイライト表示される（または該当行以外が非表示になる）。

このように、必要な条件を専用のボックスに入力するだけで、誰でも簡単に、そして一瞬で目的のデータにたどり着けるようになります。

3ステップで実装！コピペでOKの「複数検索サイドバー」作成手順

それでは、さっそく作っていきましょう。

サンプルの管理表はこちら　↓

今回は「取引先名（B列）」と「ステータス（E列）」の2つの条件で検索するサイドバーを例に解説します。コードはそのままコピー＆ペーストで動きますよ。

ステップ1：GASエディタを開く

まずは、スプレッドシートからGASの編集画面を開きます。

GASのコピペから実行方法の詳細はこちらを参考にしてください　↓

参考記事

スプレッドシート複数セル検索をGASで自動化！コピペでOKなサイドバー作成術

検索機能を実装したいスプレッドシートを開きます。
上部メニューから「拡張機能」→「Apps Script」を選択します。
新しいタブでスクリプトエディタが開きます。

ステップ2：検索処理の「中身」を作る（GASファイル）

最後に、実際の検索処理を行うスクリプト（GAS）を記述します。

GASエディタの左側にあるファイル一覧から「Code.gs」を選択します。
エディタに表示されている既存のコード（function myFunction() { ... }）をすべて削除し、以下のコードを貼り付けてください。

JavaScript

// シートを開いたときにカスタムメニューを追加する
function onOpen() {
  SpreadsheetApp.getUi()
    .createMenu('カスタム検索')
    .addItem('検索サイドバー表示', 'showSidebar')
    .addToUi();
}

// サイドバーを表示する関数
function showSidebar() {
  var html = HtmlService.createHtmlOutputFromFile('Sidebar')
    .setTitle('複数条件検索');
  SpreadsheetApp.getUi().showSidebar(html);
}

// 検索を実行し、該当行をハイライトする関数
function searchAndHighlight(searchTerm1, searchTerm2) {
  var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  var dataRange = sheet.getDataRange();
  var values = dataRange.getValues();
  
  // 先にすべてのハイライトを解除する
  clearAllHighlights();

  // 検索条件の設定（今回はB列とE列を対象）
  var column1Index = 1; // B列 (0から数えて1番目)
  var column2Index = 4; // E列 (0から数えて4番目)

  for (var i = 1; i < values.length; i++) { // 1行目はヘッダーとしてスキップ (i = 1 から開始)
    var row = values[i];
    var cellValue1 = row[column1Index].toString().toLowerCase(); // B列の値
    var cellValue2 = row[column2Index].toString().toLowerCase(); // E列の値
    
    // 検索キーワード（小文字に変換して比較）
    var searchKey1 = searchTerm1.toLowerCase();
    var searchKey2 = searchTerm2.toLowerCase();

    // 条件判定ロジック: 両方の条件が入力されているか、片方だけ入力されているか
    var match1 = searchKey1 === "" || cellValue1.includes(searchKey1);
    var match2 = searchKey2 === "" || cellValue2.includes(searchKey2);

    if (match1 && match2) {
      // 該当する行の背景色を変更する (行番号は i + 1)
      sheet.getRange(i + 1, 1, 1, sheet.getLastColumn()).setBackground("#FFFFCC"); // 黄色にハイライト
    }
  }
}

// すべてのセルの背景色を元に戻す関数
function clearAllHighlights() {
  var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  sheet.getDataRange().setBackground(null); // 背景色をクリア
}

こんな感じで貼り付けたら上のフロッピーディスクマークのボタンを押して保存しておきます。

ステップ3：サイドバーの「見た目」を作る（HTMLファイル）

次に、ユーザーが操作するサイドバーの画面デザインを作ります。HTMLという言語を使いますが、難しく考えなくて大丈夫です。

GASエディタの左側にあるファイル一覧の「＋」アイコンをクリックし、「HTML」を選択します。
ファイル名を「Sidebar」と入力してEnterキーを押します。
エディタに表示されている既存のコードをすべて削除し、以下のコードをそのまま貼り付けてください。

HTML

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <style>
      body { font-family: Arial, sans-serif; padding: 10px; }
      div { margin-bottom: 10px; }
      label { display: block; margin-bottom: 5px; font-weight: bold; }
      input[type="text"] { width: calc(100% - 10px); padding: 5px; }
      button { background-color: #4CAF50; color: white; padding: 10px 15px; border: none; cursor: pointer; width: 100%; }
      button:hover { background-color: #45a049; }
    </style>
  </head>
  <body>
    <div>
      <label for="searchTerm1">検索条件1 (取引先名):</label>
      <input type="text" id="searchTerm1">
    </div>
    <div>
      <label for="searchTerm2">検索条件2 (ステータス):</label>
      <input type="text" id="searchTerm2">
    </div>
    <button onclick="runSearch()">検索実行</button>
    <button onclick="clearHighlight()">ハイライト解除</button>

    <script>
      // 検索実行ボタンが押されたら、入力された値をサーバー側(Code.gs)の関数に渡す
      function runSearch() {
        var searchTerm1 = document.getElementById('searchTerm1').value;
        var searchTerm2 = document.getElementById('searchTerm2').value;
        google.script.run.searchAndHighlight(searchTerm1, searchTerm2);
      }
      
      // ハイライト解除ボタンが押されたら、サーバー側の関数を呼び出す
      function clearHighlight() {
        google.script.run.clearAllHighlights();
      }
    </script>
  </body>
</html>

コピペが出来たら同じく保存しておきます。

ステップ4：完成させたシステムを実行して動作確認

それではコピペだけで完成した検索システムの動作確認です。

スプレッドシートを更新させると「カスタム検索」というメニューが追加されてます。

追加されたメニューを押してみましょう。

すると「検索サイドバー表示」というボタンが出てくるのでクリック。（初回は「認証が必要です」とポップアップが出ますので指示に従い完了させてください。詳しくはこちら）

すると、サイドバーに「複数条件検索」という項目が出現しました！

試しに使ってみましょう。

検索したい内容を入力して「検索実行」ボタンを押すと対象の行がハイライト表示されます。そして「ハイライト解除」ボタンを押すとハイライトが消えるのが確認できました。

このサイドバーは常に表示させておくこともできるので、管理表内を頻繁に検索するような運用の方は特に利便性が上がるカスタムかと思います。

【AI活用術】Geminiに依頼して自分仕様にカスタマイズしよう

さて、ここからが本番です。上記のコードは「B列」と「E列」を検索対象としていますが、あなたの会社で使っているシートはきっと違うはずです。

「コードを触るのは怖い…」「プログラミングなんて分からない」という方でも大丈夫。AIアシスタントのGeminiを使えば、誰でも簡単にコードをカスタマイズできます。

依頼ケース1：検索対象の列を変更したい

例えば、検索したい列が「C列（品番）」と「F列（担当者名）」だった場合、Geminiに以下のように依頼します。

【Geminiへのプロンプト例】

あなたはGoogle Apps Scriptの専門家です。以下のGASコードがあります。 現在、検索対象の列はB列（インデックス1）とE列（インデックス4）に設定されています。 これを、C列とF列を検索対象に変更したいです。 修正後のコードを教えてください。

対象コード:
（ここに、ステップ2で貼り付けたCode.gsのコードをすべてコピーして貼り付ける）

Geminiはコードの中身を理解し、column1Index と column2Index の数値を正しく修正したコードを提案してくれます。

C列 → インデックスは 2 （A列が0、B列が1、C列が2のため）
F列 → インデックスは 5 （A列が0、B列が1、C列が2、D列が3、E列が4、F列が5のため）

依頼ケース2：検索ボックスを3つに増やしたい

検索条件をもう一つ増やしたい場合も、Geminiに頼めばHTMLとGASの両方を修正してくれます。

【Geminiへのプロンプト例】

あなたはGoogle Apps ScriptとHTMLの専門家です。 現在、2つの検索条件で動作するサイドバーを作成しています。 これに3つ目の検索条件（例：「備考欄」）を追加したいです。 以下のHTMLコードとGASコードを修正してください。

コード.gs：（ここにgsコードを貼り付け）
HTMLコード (Sidebar.html):（ここにHTMLコードを貼り付け）

このようにAIを活用すれば、あなたは「やりたいこと」を日本語で伝えるだけで、面倒なコード修正作業から解放されます。