Flickrの画像をブログに表示させる方法 〜画像リンクの貼り方【2016年3月版】〜

DSCF5162

Flickrの仕様が変わって、以前書いたこちらの方法からちょっと変わりました。

[ss class=”alignleft” rel=”nofollow” width=”170″ url=”http://nnamm.com/?p=107″ title=”ブログにFlickrの画像リンクを貼る方法と著作権について書いてみる【2015年1月版】 | 信州 Snap::Life”]

というわけで、新しい画像リンクの貼り方をまとめます。

 
スポンサーリンク

<Flickrの画像をブログに表示させる方法 〜画像リンクの貼り方【2016年3月版】〜>

リンクの貼り方

まずはブログに表示したい画像にアクセスしましょう。

丸で囲っている矢印をクリックします。

ss_2016-03-04a

すると、こういう画面が表示されます。ここからが2015年1月より変わったところ。

とはいえ、やることは簡単。

「Embed」をクリックして、表示したいサイズを選ぶ。それだけでOKです。

ss_2016-03-04b

僕はいつも長辺を640pxにしています。

URLは選択状態になっていますので、表紙サイズを選んだら「Command+C(Mac)」、「ctrl+C(Windows)」しましょう。

ブログ記事に貼り付けるとこうなります。簡単!

ss_2016-03-04c

マウスオーバーすると

ただし、普通にURLをコピペすると、PCブラウザの場合、マウスオーバーすると今までにない情報が表示されます。

ss_2016-03-04d

なぜかというと、コピーしたときクリップボードにはこんな文字列が保存されているのです。

<a href="https://www.flickr.com/photos/nnammg/24777704973/in/dateposted-public/" title="R0000501"><img src="https://farm2.staticflickr.com/1714/24777704973_49b56daca6_z.jpg" width="640" height="424" alt="R0000501"></a><script async src="//embedr.flickr.com/assets/client-code.js" charset="utf-8"></script>

「data-flickr-embed」や「script」が増えてるんですよね。それがFlickrの付加情報を表示している原因です。

 

この表示は好き好きでしょうね。

(今のことろ)僕は表示させたくありませんので、ブログを書いてるエディタ「Byword」や「Tree 2」の「置換機能」を使ってます。

(検索文字列)「data-flickr-embed=”true” 」
(置換文字列)「空白」

(検索文字列)「><script async src="//embedr.flickr.com/assets/client-code.js" charset="utf-8"></script>」
(置換文字列)「 class="aligncenter"></a>」

置き換えはApple Scriptを使えばもっとサクッとできるのかな〜って気がしますが、そこは未だに手を出せない領域です(笑)

ちなみに、「class="aligncenter"」は、僕が使っているDigiPress社のブログテーマ専用のCSSです。画像がセンタリングされます。

Header、Footer、Slideshowについて

ところで、Embedをクリックしたとき気になるものがありませんでしたか?

ss_2016-03-04e

そう、Header、Footer、Slideshowの部分。なんかポチってできそうですよね。

というわけで、全部ONにするとこうなります。

ss_2016-03-04f

画像だけでなく、ヘッダーとフッダーが表示されるようになります。

スライドショーはというと・・・、

ss_2016-03-04g

マウスオーバーすると出る「<」と「>」です。画像を切り替えられます。

おわりに

リンクを貼る方法は簡単です。ただ、僕としては仕様変更されたことで、手間が増えましたね。

でも、それほど問題はないので「ま、いっか」としています。置換機能だけでもサクッとできますから。

DSCF5163

ブログを書くときに愛用しているテキストエディタです

Tree 2

1,400円
(2015.11.17時点)
posted with ポチレバ
Byword

1,400円
(2015.11.17時点)
posted with ポチレバ
Byword

720円
(2015.11.17時点)
posted with ポチレバ

 

★ あなたのステキをそっとすくい撮ります ★

いまBlogやSNS、紙媒体などで発信しているけれど、

  • もっと自然体な自分を見せて、お客さんに安心を届けたい!
  • 顔写真を公開するのは恥ずかしいけど、勇気を出して公開したい!
  • 実は撮ってもらいたかったんです!

というみなさんの撮影を僕にやらせてもらえませんか。あなた自身がまだ気付いていない「あなたのステキ」を僕が撮ります。

★ 出張撮影、承ります ★

僕の活動拠点は長野県松本市と神奈川県横浜市。

毎月上旬は松本、下旬は横浜にいます。中信地方や関東圏内の撮影でしたらのその期間にお声がけくださいね。もちろん、他にも出張撮影します。

今は京都や広島(竹原や尾道)に行きたい。そちら在住の撮影されたいという方いませんか〜?

★ 詳しくはこちらからどうぞ ★

この記事を書いた人

花村貴史 / Takashi Q. Hanamura
花村貴史 / Takashi Q. Hanamura<空気感フォトグラファー>
「”自分の好き”を大切にしよう」と思いきって大好きな信州に移住したフォトグラファー。その人/その場の空気感をそっとすくい撮る写真が好評。
僕のできることで「あなた」を世界に伝えるメッセンジャーとして活動中。

詳しいプロフィールはこちらへGo!!

この記事が気に入ったら
いいね ! してくださいね。

Twitter で