今宵も我が家の回線は遅い

開発とダーツとにんげんかんさつが好き

はてなブログでFlickrの画像を横一列で並べる

この間、はてなブログの新機能で画像を横一列で配置できる機能が追加されました。

しかし、この機能、アップロードされた画像のみが使えるようになっていました。

HTML、CSSがわかる方は工夫すれば、Flickr等の画像も横一列に並べることができます。

以前書いた記事でもこの手法を使用しています msk6252.hatenablog.com

Flickrの画像を横に並べる方法

とは、いってもかんたんで以下のコードだけで実現できます

<div class="images-row mceNonEditable">
// ここにFlickrの画像URLを挿入していく
</div>

実際に例を用いてやってみましょう

<div class="images-row mceNonEditable">
[https://www.flickr.com/photos/104451866@N08/21786185516:embed]
[https://www.flickr.com/photos/104451866@N08/21812419415:embed]
</div>

こんな感じで表示されやす うぇい

IMG_4855 IMG_4883

まとめ

画像のURLを取得できるサービスであれば、可能なんではないでしょうか ただ正式なやり方ではないので表示の際に若干あやしい挙動が見受けられます やってみたいかたはぜひどうぞ