フォームを自動入力してくれるChromeプラグイン【Autofill】

Chromeブラウザは最も使用頻度、使用時間が長いソフトかもしれない。
それだけ長時間使っていれば、いつも似たような作業を1つや2つブラウザで行っているはずである。
例えば
【会員サイトのログインフォームにIDとパスワードを入力する】
【セミナーなどの参加申込み欄に名前、電話、メアドなどを入力する】
などだ。

ID、パスワードの入力だけなら、比較的簡単だろう。
しかし、名前住所、電話番号、メアドなどを毎回入力するのは面倒である。
今回紹介するアプリAutofillは入力フォームに予め指定したテキストを自動入力してくれる大変便利なChrome拡張機能である。
使い方はChrome WebStoreからAutofillをインストール
拡張機能の設定画面を開き、Autofillのオプションをクリック

英語ばかりズラッと並んでいて、気が引けるかもしれない。
しかし、登録する内容は3つだけだ。設定はカンタン！

1. HTMLのFormの中のname属性
2. 入力する値
3. URL

name属性の探し方


例としてYahooの検索窓に『hogehoge』という値を自動入力してみる。
まずは【name属性】を探すところからスタート。デベロッパーツールをショートカットキーで開く。

• Windows：Control ＋ Shift＋i
• Mac：Command＋ Shift＋i

ブラウザの下の方に別ウィンドウが開くので、画面右端の虫眼鏡をクリック。

虫眼鏡が青色に変わったら検索窓をクリックする。

検索窓のHTMLが青くフォーカスされ、このようにHTMLが表記されている事が確認できる。

＜input … ＞

つまり【p】をNameの欄に記入すればOK

name属性(p)が把握できたら、拡張機能のオプション画面に戻る。
下記の項目を入力して画面左下の【save】をクリック

• Name：p
• Value：hogehoge
• Site：https://www.yahoo.co.jp

yahooのページを開き、ブラウザを更新してみよう。
検索窓に『hogehoge』と自動で入力される。

IDとパスワードの入力だけなら【LastPass】や【1Password】などのオートログインアプリを使えば自動入力、自動ログイン出来る。
しかし、あまりにもIDとパスワードの更新や保存がアラートが出すぎて使いにくい部分がある。
そんな時はシンプルなAutofillが活躍しそう。

ウェブデザインを仕事にする