【はてなブログ】他の人が使っているデザインテーマを調べる方法

f:id:naru443:20200708232007p:plain


はじめはテキトウにはじめたブログでも、記事を書き貯めるうちに、だんだん気になってきますよね? 

うーん、なんかこの部分が見づらいなぁ・・・なんて。

 

でも、それって喜ぶべきことだと思います。右も左もわからなかった時から比べれば、それだけあなたのブロガー能力が上がったということですから。

 

他の人のサイトを目にする機会も多くなり、「あ、こういうデザインいいなぁー」「この機能、私もほしいなぁー」と思ってしまいますよね。

 

今回は、はてなブログに限定しますが、他のはてなブロガーさんの気になるページが、どのテーマが使われているかを調べる方法をご紹介します。

 

私もブログをはじめてから、この方法でちょくちょくデザインをカスタマイズしてます。現在は試行錯誤中です。

 

”このブログのテーマを見る” で調べる

 

気になるはてなブログのページの、左上にあるブログタイトルをクリックします。

すると、メニューがでてくるので、「このブログのテーマを見る」をクリックします。

 

f:id:naru443:20200708215759p:plain

 

使われているテーママストアが表示されますので、これでテーマがわかりますね。

例えば、今回表示されたテーマは「Hoshizora」というテーマだとわかります。

 

f:id:naru443:20200708215926p:plain

 

ですが、そもそも、画面の上部に、Hatena というバーがない、というサイトもあります。

例えばこのサイト。

はてなのトップページで紹介されていたサイトですが、画面上部にHatenaのバーがありません。でも、はてなブログで紹介されている、れっきとしたはてなブログです。

 

f:id:naru443:20200708220416p:plain

 

そんなときは、少しマニアックな方法で調べることができます。

 

その "ページのソース" をみて、テーマを調べる

 

気になるブログのページの、リンクが貼られていない箇所、どこでもいいのでカーソルをもっていき、右クリックします。

 

すると、下の画像のような選択がでてくるので、「ページのソースを表示」をクリックしてください。

 

f:id:naru443:20200708220932p:plain

 

うっへぇーっ! すごいのきましたね。 目を覆いたくなるような光景。

 

f:id:naru443:20200708221130p:plain

 

すこしガマンしましょう。

この膨大な文字列の中から、以下の文字列をさがします。

<link rel="stylesheet" type="text/css"

 

といっても、大丈夫。難しくありませんよ。

 使っているOSがWindowsの場合は、「Ctrl+F」

 使っているOSがMacの場合は、「command+F」

をしてみてください。

これは、表示されているページから、探したい文字列を検索する機能です。

 

すると、以下の画面の赤枠のように、検索窓が出てきます。

ここに先ほどのキーワードをコピペしてください。

 

f:id:naru443:20200708222220p:plain

 

すると、街灯の文字列がある場所を色で教えてくれます。

検索結果で表示された部分、ここですね。

 

f:id:naru443:20200708223939p:plain

 

ここに何が書かれているかというと、このサイトのデザインは、「href=」以降に「"  "」で囲われた場所を使ってますよ、という内容がかかれているんですね。

 

つまりこれが、このサイトのテーマということになります。

 

とっ! い・う・こ・と・は!?

 

そうです。この「"     "」の中身に書かれたパス(http://~、https://~)

の部分をコピーして、URLの入力欄に貼り付けて、そのページにとんでください。

 

ちなみに、さきほどのリンクですが、色づいた箇所が2か所ありますよね?

順番にクリックしてみてください。

 

f:id:naru443:20200708223238p:plain

 

うげげっ。さらにおっかない画面がでました。

これは、「ハズレ」です。

 

では、もう一つのリンクをクリックします。

f:id:naru443:20200708224210p:plain


こんどは、うげげっではない画面がでましたね!

ここに書かれている、「Theme」という部分が、サイトが使っているテーマということになります。このサイトの場合、テーマは「foxking」ですね!

 

f:id:naru443:20200708224334p:plain

 

今回の場合は、「公式テーマ」なので、このように表示されますが、

公式テーマじゃないものを使っている場合は、違う表示になります。

 

例えば、私のサイトは、公式テーマじゃありません。

私の場合は、このような画面になります。

「Theme:---」という箇所がありませんね。

 

f:id:naru443:20200708224903p:plain

 

公式でないテーマの場合は、数字の番号で表示されるので、さらに上の方にこんな記述があります。

<system section="theme" selected=" ーーーー">

この、ーーーー の部分が、テーマの番号となります。

 

f:id:naru443:20200708224853p:plain

 

Google の検索画面で、

「はてな テーマ (さきほどの番号をコピペ)」

で検索してください。こんな感じです。

 

f:id:naru443:20200708225314p:plain

 

すると、該当のテーマページにたどり着くことができます。

 

注)テーマを使わないサイトもあります

 

中には、スキルが高くて、自分でデザインしちゃう人もいるので、テーマを使っていないケースもあります。

そういう場合は残念ですが、諦めましょう。

 

 

まとめ

 

いかがでしたか?

ステキなテーマを見つけたら、それはもしかすると、はてなブログかもしれません。

それにこれは、私自身がいつも驚かされるんですが、

辿り着いたテーマからは、想像もつかないデザインにカスタマイズされていることが多いです。色や画像を変えたりすると、こんなに違ってみえるのだと、いつも驚かされます。

 

 

みなさんのサイトも、ステキになりますように。。