figma-text-find-and-replace-in-file
公開日: 2022.10.07  | 更新日: 2022.10.07

Figmaでファイル内のテキストを検索・一括置換する方法

今回はFigmaのファイル内のオブジェクト名やコンテンツ内のテキストを検索・置換する方法を紹介します。ファイル内で特定の文言を一括で置き換えたい場合や、UIコンポーネントをテキスト検索で引き当てたいときに便利です。

ちなみに、この検索機能でコメント機能でつけたコメントやスレッドの中身は検索できません。

この記事のターゲット

  • Figmaのファイル内でテキスト検索・置換を利用したい方

  • Figmaのファイル内のコンポーネントやオブジェクトを効率的に探したい方


ファイル内のテキスト検索ボックスを表示

ファイル内でテキスト検索・置換の機能を呼び出す方法は次のとおりです。

  • 左サイドメニューの左上の虫眼鏡アイコンをクリックする

  • 「Command + F」のキーを押す

テキスト検索ボックスが表示されたら、任意の検索したい文字列を入力します。

検索結果がヒットすると、ファイル内のフォーカスが該当のオブジェクトに自動で遷移し強調して表示されます。

検索結果が複数ある場合、該当オブジェクトの一覧がテキスト検索ボックスの下に一覧表示されるので、リストから直接選択することもできます。

text-search1

また、検索時にプルダウンのオプションを選択することで、検索結果に表示されるオブジェクトを絞り込むことができます。利用できるオプションは次のとおりです。

利用できる絞り込み

  • すべて

  • テキスト

  • フレーム/グループ

  • コンポーネント

  • インスタンス

  • 画像

  • シェイプ(図形)

  • その他

利用できる条件一致

  • 大文字と小文字を区別:英字の大文字と小文字を区別したい場合に選択

  • すべて一致:検索するテキスト全文が完全に一致する場合に絞りたい場合に選択

text-search4

ファイル内で検索したテキストを置換する

検索結果のテキストを、別のテキストに置換することもできます。

テキスト検索ボックスを表示し、右側の設定アイコンをクリックすると表示されるプルダウンメニューから「置換」をクリックすると、置換モードになります。

テキスト検索ボックスのすぐ下に置換するテキストを入力し、「置換」をクリックすると、検索で引っかかったテキストが置換できます。

「すべて置換」をクリックすると、検索で引っかかった全てのテキストが置換されます。

text-search2

また、置換時にもオプションを選択することで、表示されるオブジェクトを絞り込むことができます。利用できるオプションは次のとおりです。

利用できる条件一致

  • 大文字と小文字を区別:英字の大文字と小文字を区別したい場合に選択

  • すべて一致:検索するテキスト全文が完全に一致する場合に絞りたい場合に選択

text-search3

この記事を読んだ方におすすめの記事

Figmaでコンポーネントに内包されたインスタンスのプロパティを効率的に変更する方法

今回は、子インスタンスを内包(ネスト)した親コンポーネントを作成する際に、親のインスタンス内で子のプロパティを効率的に設定する方法を紹介します。テキストの説明だけだとやや難解なので、記事内の動画もあわせて参考にしてください。 ... 続きを読む

figma-nested-instance-property-setting

Figmaでテキストごとオブジェクトを拡大・縮小する方法

Figmaでボタンやバナーなどのテキストを含むグループ・またはフレームといったオブジェクトを、フォントサイズ含めてレイアウトごと拡大・縮小する方法の紹介です。 ... 続きを読む

figma-how-to-use-scale

Figmaでレイヤーやグループを自動整理できる「Clean Document」の使い方

今回は、Figmaでデザインモックなどを無計画に作った結果とっ散らかってしまったレイヤーを、一瞬できれいに整理・整頓してくれるプラグイン「Clean Document」を紹介します。無駄なグルーピングやラベルと内容が一致していないテキストなどを一括で整理できます。 ... 続きを読む

figma-clean-docment-plugin

最新の記事はこちら
広告
この記事を書いた人
うえんつ

うえんつ

Twitter
SaaS・アプリ開発などWEB領域での課題解決が得意なデザイナーで、このブログのオーナーです。
今の関心事
Figma・UI/UX・空間設計・QOL・料理
広告