Figmaのレイヤー名を一括変更するプラグイン「Rename It」
複数レイヤーの一括変更は、Figmaのデフォルト機能でも最低限できます。
連番を振ったり、元のレイヤー名の利用もできるのでデフォルト機能でも十分ですが、さらに高度なことをしたい場合はプラグインの出番です。
Rename It
インストールするとFigmaのメニューバーに［Plugins］→［Rename It］が追加されます。
基本的な使い方
名前を変更したいレイヤーを選択した状態で、メニューバーか右クリックメニューの［Plugins］→［Rename It］内のメニューを選択して使用します。
- 1. Rename Selected Layers：選択レイヤー名の変更
- 2. Find Replace Selected Layers：選択レイヤー名の検索置換
- 3. Settings：設定メニュー
- 4. Donate：寄付メニュー
ちなみに、初回起動時は下記のGoogleアナリティクスを使った解析の許可モーダルが表示されます。
プラグインをより良いものにするために「Agree」で許可しておきましょう（「Disagree」で許可しなかったとしてもRename Itは使えます）。
Rename Selected Layers：選択レイヤー名の変更
「Name」に変更名を入力して、連番を使用する場合は「Start from」で開始値を入力します。
「%」を使ったキーワードが使えるのはデフォルトのリネーム機能と一緒ですが、用意されている数が違います。
| キーワード | 入力 | 内容 |
|---|---|---|
| Layer Name | %* | 現在のレイヤーの名前 |
| Layer Width | %w | レイヤーの横幅（数字のみ） |
| Layer Height | %h | レイヤーの高さ（数字のみ） |
| Num. Sequence ASC | %N | 昇順の連番（1 → 2 → 3） 「%NN」とすると「01」のように2桁になる |
| Num. Sequence DESC | %n | 降順の連番（3 → 2 → 1） 「%nn」とすると「03」のように2桁になる |
| Alphabet Sequence | %A | アルファベットが順に入力される 「%a」とすると小文字になる |
| Parent Name | %o | 親要素の名前 |
| Child Layer | %ch% | 子要素の名前（複数ある場合は1番上の要素） |
| Page Name | %p | ページ名（「Page 1」など） |
| Symbol Name | %s | コンポーネントの名前 |
| Style Name | %ls% | 使っているスタイルの名前 |
デフォルト機能にあるのは「Layer Name」「Num. Sequence ASC」「Num. Sequence DESC」の3つだけです。
Rename Itを使えば下記のようにレイヤー名を分かりやすくできます。
- インスタンスを全て「%s」でコンポーネント名に統一する
- 画像は「image_%w_%h」に統一して横幅と高さが分かるようにする
- テキストに「%ls%」でスタイル名を付けて、スタイルを使っていることを分かりやすくする
Find Replace Selected Layers：選択レイヤー名の検索置換
Rename Itの場合、検索置換は別になっています。
「Find」に検索したいキーワード、「Replace」に置換したいキーワードを入力するだけです。
「Case Sensitive」にチェックを入れると大文字小文字を区別します。
