三日坊主なりの楽しい暮らし

三日坊主のアラサーが自分なりの楽しい暮らし方を発信していきます。

【はてなブログ】画像をクリックした時にオリジナルサイズを表示させてみた!

f:id:iuran:20220304012405p:plain

 

どうも、いうらです。

最近サブブログを再開しました!

 

www.iuranokurasi.com

 

動画・配信・サムネイルなどに使える、フリーの背景画像を置いているサイトです。

こちらのサイトについて、先日ブログ仲間のmiyakoさんからこんな質問をいただきました。

 

 

(勝手に乗せちゃってすみません!もし嫌だったら消しますのでお声かけください!)

 

あたしはその問いに対して、

 

 

と答えたのですが、あとで自分で確認してみたところこのサイズではありませんでした。

 

ごめんなさい!!アップした画像はたしかに1920×1080だったのに~。

 

そ、そういえば!

ブログの表示スピードを上げるため、2年くらい前に自分でアップロード画像のサイズを変更していました。

せっかくわざわざサイズ設定をして画像を作っているのにこれでは意味がない!

ということで、今回は裏山さんの記事を参考に画像クリックでオリジナルサイズが表示されるようにしてみました!

 

inuyamashi.hateblo.jp

 

 

画像をクリックし、オリジナルサイズを表示させる

裏山さんの記事が詳しい&わかりやすく書いてあるので、ぜひそちらを参考にしてください!

 

はてなフォトライフの設定変更

はてなフォトライフ設定

オリジナルサイズの画像を保存にチェックを入れます。

f:id:iuran:20220304002651p:plain

あとはいつも通り画像をアップロード

 

オリジナルサイズのURLを取得

アップロードした画像をクリックするとこのような画面になります。

f:id:iuran:20220304002851p:plain

オリジナルサイズを表示をクリック。

するとオリジナルサイズが表示されます。

f:id:iuran:20220304002905p:plain

そこのURLをコピー

 

リンク埋め込み

今度は記事の編集画面へ移動します。

編集見たままモードで、オリジナルサイズ表示をしたい画像を本文に普通に貼ります。

そして画像を選択したままリンク(鎖みたいなマーク)をクリック

f:id:iuran:20220304002948p:plain

URLのところに先ほどコピーしたものをペースト。

f:id:iuran:20220304003008p:plain

選択範囲にチェックを入れ、選択した形式でリンクを挿入で完成です。

こんな風に表示されるようになります!

 

f:id:iuran:20220302235725p:plain

 

クリックすると大きくなります!

大きくしてから保存するとオリジナルサイズの物が保存できます。

 

表示速度はどうなるのか検証してみた

リンク挿入前の表示スピード。

f:id:iuran:20220304003155p:plain

f:id:iuran:20220304003214p:plain

 

そもそも表示速度悪いじゃねーかァァァ!というツッコミは今回置いといて、リンク挿入により変化があるかどうかだけを見てください。

こちらが挿入後の表示スピード。

f:id:iuran:20220304003235p:plain

f:id:iuran:20220304003743p:plain

結果はほとんど変わりませんでした!

 

この機能はけっこう使えるかもしれない

さっきも話したように、あたしの場合はフリー素材を保存してもらうためにどうしてもオリジナルサイズの画像を貼らなければいけませんでした。

ブログをやっている方だと、逆に画像を保存されるのはちょっと…と思うことの方が多いのかな?

でも画像の細部まで見せたい時、この機能はかなり使えるんじゃないかなと思いました!

きれいな景色や、画像に載っている文字を見せたいとかね。

操作も簡単なのでちゃちゃっとできちゃいます。

普段リンク機能を使用している人ならなおさら。

ぜひみなさんも使ってみてください。

 

ではっ!

 

\ フリー素材を置いているサイトです /

 

ブログや動画、配信、ツイートなどにご利用ください!

ちなみに今回のアイキャッチはこちらの物を使用しました☆

※現在画像を直している途中なので、いくつかはオリジナルサイズで保存できない場合がございます!

 

www.iuranokurasi.com

 

\ ランキングに参加しています /

 

にほんブログ村 OL日記ブログ アラサーOLへにほんブログ村

にほんブログ村 ライフスタイルブログ 自分らしい暮らしへにほんブログ村