Flickrの記事一覧


01/29

私のブログの写真は、初期の頃を除いてFlickrにアップしたものをHTMLタグで表示させていますが、そのHTMLタグの出力も外部サービスを利用しています。以前にブログでも紹介した事がありますね。Flickr2Tagというサービスです。

FlickrEX


最近の記事に使っている写真は、一眼レフを使って撮影したものも多いので、EXIF情報を画像下部に貼り付けたりしているのですが、これが実は手動でFlickrから1つずつコピー&ペーストしているので、かなりの手間です。
ローカルのパソコン上に保存された画像ファイルのEXIF情報をコピーするツールはいくつか見た事があるのですが、結局「コピーする→ブログ文章にペーストする」という手間が発生してしまい、長続きしないと思ったので、使っていませんでした。

探してみるとありました。Flickrの画像を自動で検知し、自動的にEXIF情報を表示してくれるブログパーツ「FlickrEX」です。こんな便利なツールがあるなんて知りませんでした。
作者の@drikin様、ありがとうございます。使わせていただきます。で、ここで気が付いたのですが、Flickr2Tagと同じ作者様だったのですね(笑)。

[D] Flickr画像に自動的にExif情報を付加するブログパーツ FlickrEx
http://blog.drikin.com/2013/02/flickrex.html

使い方は非常に簡単で、スクリプトを<body>タグ内に追記します。これだけですぐに表示されるようになります。

<script type="text/javascript">
//var FLICKREX_API_KEY = "18c9f79a96fd34c3b3f16a93fb0a5d3c";
//var FLICKREX_EXIF_FORMAT = "%camera% / %Focal Length% / f/%aperture% / ISO %ISO Speed% / %Exposure% sec / %Exposure Bias% EV / %Software%";
//var FLICKREX_EXIF_JQUERY_SELECTOR = "#content img";
</script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
<script src="//github.com/drikin/FlickrEx/raw/stable/flickrex.min.js">
<script src="//github.com/drikin/FlickrEx/raw/stable/exifex.min.js">

上記タグを追記するだけで、作者のサイトからスクリプトを参照して、画像の下にEXIF情報を表示してくれます。これだけなので、非常に簡単ですね。下は追記直後の状態です。FlickrEXで追加された情報と、元々私が記事内に記載していた情報が2重に表示されています。

FlickrEX


ただ、これだと画像の横に文字が回り込んでいたり、表示される情報を追加したいですね。
さらに、追加する情報もカスタマイズすることができるようです。利用できる情報の一覧はこちらで確認できます。私の場合は、以下のようにカスタマイズしてみました。

var FLICKREX_EXIF_FORMAT = "%camera% (%lens%) / %Exposure Mode% / %Focal Length% / f:%aperture% / ISO %ISO Speed% / %Exposure% sec / %Exposure Bias% EV / %Software%";

スクリプト内の「//var ~」の「//」がコメントになっているので、削除するとその設定が適用されるようになっています。私は上の追加設定をコメントアウトされている設定の一番下に追記しました。
下が設定完了したブログの状態です。

FlickrEX


FC2ブログの場合、HTMLテンプレートと、CSSテンプレートが別々のウィンドウで変更できるので、HTMLテンプレートには、上記のFlickrEXのスクリプトを追記しましたが、CSS側には、以下のように最後に追記しました。

.flickr-exif{
font-size: 10px;
}
/*強制的に改行させる
.entry p img {
display:block;
clear:both;
}

FlickrEXは、クラス情報として「flickr-exif」という名前を付与されているようなので、そのクラスに対してのフォントサイズを指定して、画像リンクを貼り付けた場合必ず改行させるように変更しています。
ただし、FC2のテンプレートによっては、こういった追記が出来ない、または追記しても反映されないものもありますので、ご注意下さい。
この状態で、下にいつも通りFlickrTagでHTMLタグを取得して貼り付けてみます。

20140102-162307

FC2ブログの場合は、記事記入時の下段プレビュー時に何も表示されませんが、別ウィンドウでプレビュー表示させるとEXIF情報が追加されています。

問題は今まで書いた記事にも自動的に情報が付与されてしまうことになってしまい、EXIF情報がに2重に表示されてしまう事です(笑)。記事内の文章を削除していくことになるので、結構面倒な事になりそうです。しかも私が記事に挿入していたFlickr画像のタグも少し変更しないといけません。
少しずつさかのぼって削除していくしかありませんね。
少しの間、過去記事が見にくいですが、ご了承下さい(笑)。




FC2ブログランキング





にほんブログ村 携帯ブログ Androidへ

にほんブログ村 携帯ブログへにほんブログ村 携帯ブログ NTTドコモへにほんブログ村 携帯ブログ スマートフォンへにほんブログ村 PC家電ブログ デジモノへにほんブログ村 PC家電ブログ 家電・AV機器へ

a quickr pickr post





07/13

同じモノフェローズ仲間のsayaさんが先日参加されていた「ブロガー養成セミナー「ガジェット記事の書き方」」という記事を読んで、その中でFlickrにアップロードした画像をHTMLタグ化するサービスが気になっていました。sayaさんの記事は以下。

ブロガー養成セミナー「ガジェット記事の書き方」メモ - Digital Life Innovator
http://saya.s145.xrea.com/archives/2012/07/post_640.html

今までは、撮影した画像をJPEGに変換した後Flickrにアップロードして、「quickr pickr」というサイトでHTMLタグに変換してブログ記事に貼り付けていました。FC2ブログ内にも画像をアップロードすることはできますが、容量的にも限界があるので、画像メインのような、私のブログでは画像をFlickrにアップロードしてそこから貼り付けています。
確か大昔に、「画像アップロードに関する備忘録。」で書いていました。

quickr pickr
http://quickrpickr.com/post/

quickr pickr

ですが、「Flickr2Tag」というサービスがあるとのこと。こちらも似たようなHTMLタグへの変換をしてくれているとの事で、早速使ってみました。

Flickr2Tag
http://flickr2tag.drikin.com/

Fckr2Tagの場合、初回検索時に自身のIDを検索する必要がありますが、「>> You can find Flickr user or group id here.」をクリックして、

Flickr2Tag

自身のログインIDを「username」の部分に記述して「Find」をクリックすると調べることができます。その結果をFckr2Tagで入力すると表示されるようになります。Fckr2Tagはこの結果のアドレスをブックマークしておくことで、いつでもすぐにアップロードした画像のHTMLタグを取得できるようになります。quickr pickrの場合、毎回フィルタリング条件を入力する必要があるのが少し面倒です。

Flickr2Tag

後は、タグで貼り付けたい画像をクリックするだけでクリップボードにコピーしてくれます。

Flickr2Tag

結果的には、どちらも長所短所があるように感じました。わかりやすく(というか、文章にしづらい)箇条書きで書いてみると、

「Flickr2Tag」の長所
大きな画像で確認しながら選ぶことができる
 (quickr pickr:一覧表示からクリックしても小さい画像がポップアップされるだけ)
画像をクリックするだけでクリップボードにタグをコピーしてくれる
 (quickr pickr:表示されたタグを自分でコピーして、加工する必要がある)

「Fckr2Tag」の短所
HTMLタグ化する際の画像サイズを選択できない
 (quickr pickr:Originalやいくつかの画像サイズが選択できる)
一覧表示されないので、大量にアップロードした後に目的の画像までたどり着くのに時間がかかる
 (quickr pickr:一覧表示で一画面内に多数の画像を表示して目的の画像を探し出せる)

「手軽さ」の面では、Flickr2Tagの方が使いやすいように感じました。クリックするだけで貼り付ける準備ができてしまいますし、複数の画像をクリックした際にウィンドウ内に表示される数字をクリックすることで、一度に貼り付けることも可能です(複数クリック後の通常ペーストは最後にクリックした画像のタグのみ)。
ただ、直近にアップロードした画像であれば良いのですが、大量の画像をアップロードしたり目的の画像が前にアップしたものだった場合は見つけるまでに延々とスクロールしなければならず、少々面倒で、その点はタグでフィルタリングしたり、100枚表示や200枚表示と一覧表示が可能な「quickr pickr」の方が使いやすいように感じます。ただ、記事内に画像を貼り付けるまでの手順が少々面倒です。

実はこの記事の前にアップした2記事とこの記事はこの「Flickr2Tag」を使って画像を貼り付けています(若干の簡単なHTMLタグを追加してはいますが)。クリック~ペーストという単純作業でブログ記事内に貼り付けられたので、非常にスムーズにアップまで出来ました。

sayaさん、有益な情報ありがとうございました。この恩はまたいつか(笑)。



にほんブログ村 携帯ブログ Androidへ

にほんブログ村 携帯ブログへにほんブログ村 携帯ブログ NTTドコモへにほんブログ村 携帯ブログ スマートフォンへにほんブログ村 PC家電ブログ デジモノへにほんブログ村 PC家電ブログ 家電・AV機器へ

a quickr pickr post





トップへ | 

カレンダー

プロフィール

カテゴリ

Comments...A

アクセスランキング

3D球体タグクラウド

リンク

参加サイト

広告