全記事一覧にもサムネイルを付けてみた

 

2014.09.14

カテゴリ別全記事一覧にもサムネイルを付けて、レイアウトを変えてみた!!

先日の「関連記事にサムネイルを付ける方法」を使って、「カテゴリ別全記事一覧」のページにもサムネイルを付けれないかやってみたら、イイ感じに仕上がった♪

サムネイルを付けたカテゴリ別全記事一覧
またテスト中って記事が目立ってるけど、そこは気にしないで^^;

レイアウトに関して、最初は通常のリスト形式にしようかと考えたけど
1つ1つの記事にサムネイルが付く分、それだと妙に縦長のページになってしまう問題があったので、ここでも横に3つ並べてみた。
この方が画面内に多くの記事情報を表示出来るし、無駄なスペースも出来ないので良い感じ♪

それに、ここでもjQueryを使ってカテゴリごとに、記事の表示をたたんだり、開いたり出来る仕様にしてるのでサムネイルを付けた事によって縦にかさんだ問題もカバー出来たんじゃないかな?と思ってる。

まぁ細かい部分は実際に記事の量が増えた時に、修正や変更をすればいいかなーと^^;

てか、やるだけやってから気付いたけど、記事一覧ページ(<!--titlelist_area-->)では「記事の通番」の変数(<%titlelist_eno>)が用意されてるので、記事に合わせてサムネイルにする画像をアップロードしてたら、画像のURLは「<img src="http://blog-imgs-68.fc2.com/i/n/t/interest2014/entry-<%titlelist_eno>s.jpg" alt="<%titlelist_title>" />」でOKだった^^;
(上記のhttp://~の部分は私の場合のURL)
ブログランキングに参加中♪
良かったらポチっとお願いします
にほんブログ村 IT技術ブログ Webサイト構築へ
B!


関連記事
2014-09-14 | 画像系 | コメント(2) | トラックバック(0) | このページのトップへ

http://interest2014.blog.fc2.com/tb.php/17-df724e79

「全記事一覧にもサムネイルを付けてみた」へのトラックバック

- TrackBack -


「全記事一覧にもサムネイルを付けてみた」へのコメント

- Comment -

コメントのお礼に来ました。

はー・・・。

ほー・・・。

すげー・・・。

とても勉強になるブログです。

特にこの「全記事一覧」のデザインを見てシビレました。

・・・美しい。
  • 2014-10-17 00:07
  • ついはめさん@管理人
  • 編集

Re: コメントのお礼に来ました。

> ついはめさん

ご訪問&コメントを頂きありがとうございます♪
「全記事一覧」の表示は自分の中でも結構イイ感じに出来たと思ってたので、ありがたいです♪w

そして、私こそ「ついはめさんの文才」にシビレたので、今後も面白い記事を期待してます^^
  • 2014-10-17 00:33
  • あると♪さん@管理人
  • 編集

コメントの投稿

- Post a Comment -










管理者にだけ表示を許可する

※コメントを投稿する際に、任意の編集用パスワードを設定することで投稿後にコメントの修正・削除が可能になります。

▼クリックすると配色が変更されます  
このボタンの設置方法は こちら♪

White
Black

プロフィールClick

プロフィール画像

Author:あると♪
ブログ開始: 日目
公開記事数:

Webサイト製作の勉強にと思ってブログのカスタマイズに挑戦してる初心者です♪その他にも気になった事、興味がある事などを気ままに書いてますっ!!

当ブログのご案内は こちら♪

最新記事Click

最新コメントClick

カテゴリClick

月別アーカイブClick

アクセスカウンターClick

設置日
2014.11.19

スポンサーリンクClick

このページの目次Click

人気ランキングClick

ブログパーツ