アメブロにFlickrに投稿した画像を表示させるには | ちょっとした「Webお役立ち情報」とかを主に書いてます。

ちょっとした「Webお役立ち情報」とかを主に書いてます。

ネットで調べて、「わかったこと」を備忘録の代わりのメモ帳のようにして使ってます。

おはようございます。

晩秋の箱根を自転車で

わてくちめ、最近、ってか大分前から
アメブロに画像を載せるのにアメブロ
の画像フォルダーを使ってません。

エディタはタグ編集エディタを使って
るんですが画像を目的の箇所に貼り付
けられないのが理由の一つです。

この箇所に載せようと思っても、たい
てい一番上か、じゃなかったら一番下
に貼り付いちゃいます。

ま、そんな事もあってフリッカーに投
稿した画像を使う事が多いです。

ざっくりと、その方法を御案内してみ
ます。


アメブロにフリッカーの画像を載せる方法

まずは、フリッカーの会員にならないと
画像を投稿できないので、その方法は、
こちらに

Flickrのアカウント登録 | Flickrの使い方

アメブロに載せたい画像を自身のパソコン
の画像フォルダーからフリッカーに投稿す
ると自身のフリッカーのページにこのよう
に表示されます。

11/08


つぎに、その画像をクリックすると画面が
下のように変わります。
その画面右下の矢印マークをクリックし
ます。

11/08


すると下のような小窓が現れますのでHTML
の箇所にマークが付いていない場合はマーク
をつけて、Hタグをコピーします。

11/08


HTMLコードをコピーしたものを、
アメブロの編集画面に貼り付けます。

11/08


で、ここで注意なんですが、大きい画像
サイズのものは、そのままだと画像の
右側が切れて表示されてしまいます。

アメブロの通常の記事幅は400PXか、
600PXです。

貼り付けたHTMLタグを一部修正します。

自分の場合、このブログの記事幅が
600PXなので赤字のwidth="1200"
数字を600に書き換えて、緑字の
height="675"
は削除してます
(*これを削除しないと縦横比が
狂って歪んだ画像になってしまい
ます)
。(↓)
<a href="https://www.flickr.com/photos/123482122@N06/15736200342" title="晩秋の箱根を自転車で by hiroshi watanabe, on Flickr"><img src="https://farm4.staticflickr.com/3943/15736200342_a6e2b1b5f2_o.jpg" width="1200" height="675" alt="晩秋の箱根を自転車で"></a>


この記事の冒頭の画像のHタグは、こちらです(↓)。
<a href="https://www.flickr.com/photos/123482122@N06/15736200342" title="晩秋の箱根を自転車で by hiroshi watanabe, on Flickr"><img src="https://farm4.staticflickr.com/3943/15736200342_a6e2b1b5f2_o.jpg" width="600" alt="晩秋の箱根を自転車で"></a>


*ちょっと手間が掛るように思われる
かも知れませんが、少し慣れるとアメブロ
の画像フォルダーにアップする手間と同じ
感じです。それにオンマウスで簡単な説明文
も表示されますし・・
自分は便利だと思います^^;


Flickrのアカウント登録 | Flickrの使い方



☆ブィブィ  ('-^*)/



きゃぁ~~!!タックルされちゃったぁ~~!!