MacBook

MacbookでもChromeのデベロッパーツール(検証機能)をF12で開きたい!

MacbookでGoogle Chromeのデベロッパーツール(検証機能)をキーボードショートカットでON/OFFするにはどうすればいいのかな?

ググれば一発で解決できるかと思いきや、ちょっと苦戦したので備忘録。

初期設定でそのまま使うなら

ChromeのデベロッパーツールのMacでのショートカットキーは、

「option(⌥)+「command(⌘)」+「I」の同時押し

です。

ググった感じ、ここまでで終わってる記事が多かったのですが、正直、キーを3つも押すのって面倒…。

Windowsだと【F12】キー一発でON/OFFできるようなので、これと同じ設定にしたい!…という思いから辿り着いたのが下記になります。

最終的にMacbookでも【F12】キーで、デベロッパーツールのON/OFFができるようになりました!

この設定をしても問題ないのはこんな人

【F12】キーを、ダッシュボードのON/OFF用に使っていない人向け。

※そもそも「ダッシュボードってなんぞや?」という人は、下記の設定に変えてしまっても問題ないと思います。

【F12】でデベロッパーツールをON/OFFする手順

ファンクションキーの初期設定を変更

Macbookの初期設定では、ファンクションキー(キーボードの最上段にあるF1〜F12)を押すと、各キーに印字されているイラストの機能が実行されます。

例)【F12】なら音量アップ…とか。

まずは、この初期設定を変更します。

システム環境設定 → キーボード の【キーボード】タブを表示して…。

↑赤枠の「F1、F2などのキーを標準のファンクションキーとして使用」にチェックを入れます。

これで、ファンクションキーの割当が標準設定になります。

【F12】キーにデベロッパーツールを割り当てる

↓こちらの記事を参考に、【F12】キーでデベロッパーツールのON/OFFを割り当てます。

【Mac】ChromeのデベロッパーツールをF12で開くよう設定する

※「メニュータイトル」に入力する文言は、記事内からコピペするのが良さそうです。
※私は、この記事のマネをして、【F5】キーでリロードできるように設定しました 笑

設定が終わったら、【F12】キーでデベロッパーツールが開くかを確認してみてください。

開けばOK!

デベロッパーツールではなく、ダッシュボードが起動してしまう場合は、下記の設定も変更しましょう。

キーボードショートカットの割当を変更する

システム環境設定 → キーボード の【ショートカット】タブを開いて、左メニューから「Mission Control」を選択。

右画面の「Dashboardを表示」のチェックを外します。

これで、もともと【F12】キーに割り当てられていた「Dashboardを表示」機能がオフになり、デベロッパーツールを開くことができるようになるかと思います。

まとめ

・Macbookのファンクションキーの初期設定は標準設定ではない

・Windowsだと、デベロッパーツールは【F12】で開く

という記事を読んで、合わせ技で試してみたところうまくいきました。

ショートカットキーは個々で設定されているものもあると思うので、誰にでも当てはまるわけではないかもしれないですが、私はこれでうまくいきました…ということで!