はてなブログ。画像の拡大機能を解除する方法。

f:id:mikanusagi:20180504150209p:plain 今日は画像表示の簡易カスタマイズについて。

 

はてなブログは、写真を投稿する形で投稿した画像は、

デフォルトで、カーソルもってってクリックしたら、

拡大表示されてしまうんですよね。

拡大というか、投稿した時のサイズで表示されてしまいます。

これはクリックした時の挙動が、拡大、に設定されているため。

 

たとえば、下記のような画像を埋め込んでいたら、、

f:id:mikanusagi:20180504225043p:plain

ここにカーソルもってってクリックしたら、

この表示になるっていう。

f:id:mikanusagi:20180504225103p:plain

 

これ、結構うっとおしくて困っておりました。

 

 

なぜ拡大されるのか。

たとえば、最初のウサギのイラストの場合、HTMLはこんな表記。

<img class="hatena-fotolife"

title="f:id:.....:1234678910p:plain".......>

1行目のhatena-fotolifeっていうのが、 その表記にする指令を出しているようです。

つまり、ここの指令を無効にしてしまえば、上記のような動作はおきないということ。

 

方法1.

HTML編集で、「hatena-fotolife」の表記を適当にかえる。

何でもいいです。ここを削除でもよいし、一文字追加とかでも大丈夫。

hatena--fotolifeにしてもいいし、hatena-fotolifesにしてもいいし。

これで、拡大表記にしたくない画像への指示を変えてしまえばOK。

 

 

方法2.

一個ずつなんて面倒くさい!ってときは、一括で解決する方法がありました。 

CSSでhatena-fotolifeの指令を変えてしまえばよいのですね。

 

こちらのブログを参考にさせて頂きました。

リンクを貼らせて頂きます。

 

 

 

無事変更できました。

すっきりした~°˖✧◝(⁰▿⁰)◜✧˖°

 

 

 

補足:

なお…

これらは、画像を完全にダウンロードできないようにする方法ではないようですので、

そういうことをお求めの場合は、また別の話になるかもしれません。

 

上記以外に、拡大表記じゃなく、

fotolifeに直接アクセスさせることもできるようです。

「:plain」を「:image」に変えるらしいのですが、単純にこれだけではダメでした。

きっと何か方法があるのでしょうけど、、(*´Д`) 力尽きた。まあいいか。

 

 

※はてなさん曰く、fotolifeっていう名前は、

 あえて、のようです。スペルミスではなくて。(*'▽')