ウェブサイトサムネイル作成API導入しました。
いつも上位にある育児系ブログ
★鮎魚★ほわほわ日和は、オリジナルデザインに凝った素敵なページ。他サイトのデザインとか見て、これどうやっているんだろうってよく思うことがあるのだけど、ここでも気になるところをひとつ発見。さっそく分析してみました。
どういうことが気になったかというと、この
★鮎魚★ほわほわ日和、コメントした人がURLも入力してあるとそのURL先がサムネイル画像で表示されるようになっていたりする。
どんな感じの表示かというと、こんな感じ
そんな設定TI-DAにあったっけ、と管理画面を彷徨ってみたものの見当たらず。どういう仕組みなんだろうと、サムネイル画像のプロパティを開くと、共通して”
http://img.simpleapi.net/small/”の記述。
どうもこれがヒントらしいと、そのURL先にいってみるとビンゴ!でした
http://img.simpleapi.net/
ただ問題は、コメント入力した人がURLも入力したら、それが自動で反映されるようにする必要があるわけで、オリジナルデザイン画面とにらめっこ。。。個別記事のHTMLの設定を試行錯誤してみました。
URLが反映される記述部分を探し、その先頭に前述のURLを記述 ⇒ 反映は成功。けど、なんかレイアウトがおかしい。サムネイル画像下に posted by ~~ at 2006年mm月dd日としたいのに、真横に来てしまう。。。
スタイルシートのコメント欄に関する記述を探し、回り込みの設定を追加。こんどはコメントが複数あるときに、互いのレイアウトが崩れる現象発生。特にコメントの記述行数が少ないと崩れ方がひどい。。。コメント欄の幅(width)を100%にすることで、崩れをなくすことができました。ふぅ。
お気に入りも同じように表示することできるか、今度試してみようかな~。
関連記事