気になるWordPressサイトのテーマを知るにはソースコードを見るだけ

こんにちわ、スズキ(@acogale)です。
最近、ワードプレスでサイトを作っている人をよく見かけるようになりました。
このサイトかっこいいな、こんなデザインにしてみたいな。
素敵なサイトに出会ったとき「どんなテーマを使っているんだろう」と思ったことはありませんか。

なんと、サイトコードを見るだけで、どのテーマか8割くらいわかる方法があるんですね。
今回は、ウインドウズPCとChromeを使って、その方法をご案内いたします。

 

サイトを右クリック→ページのソースを表示

まずは、気になるサイトの画面で、右クリックを押してください。
そこで出てくる「ページのソースを表示」をクリック

 

ソースが表示されたら→Ctrl+Fを押下

ページソースが、新しいウインドウで表示されます。
そうしたら、「コントロールキー」+「F」で検索ウインドウを出しましょう。
chromeの場合は、右上に小さく表示されます。

 

検索窓に「wp-content/themes」と入力

「コントロール」+「F」で検索窓が表示されたら、そこに次のどちらかを入力してエンターキーを押下してください。

  • 「wp-content/themes」
  • 「themes」

これで、テーマ(theme)を格納しているフォルダがいくつか表示されます。
このサイトでは、「wp-content/themes」と検索すると、4つの対象が出てきました。

 

その中の「link rel=’stylesheet’」となっているものを選択

いくつか出てきた対象のうち、行の先頭が「link rel=’stylesheet’」というものを順にクリックしてみます。

この一番上にあるオレンジ色のリンクをクリックすると

使っているテーマ名が表示されるんですね。
ちなみに、このサイトは「マテリアル2」というテーマを使っています。
※マテリアル2→yStandardというテーマに変更しました

クリックしなくとも、「wp-content/themes」のあとの文字を見れば、見当がつくと思います。
/hummingbird/とあれば、「ハミングバード」というブロガーに人気のテーマだったり、
/biz-vektor/とあれば、企業用サイトでもおなじみの「ビズベクトル」というテーマだったりします。


 

ソースを見ることで、色々な発見が

今回は、ソースコードからワードプレスのテーマをお伝えしました。
他にもソースコードから分かることが色々とあります。
そのあたりは、またの機会にお伝えできればと。

こんなサイト素敵だなぁ、こんな風にホームページ作りたいなぁ。
そう思った方は、ソースからテーマをチェックし、どんどん使っていきましょう。