注目タグ

質問・疑問

トピック詳細

インデックスを画像カレンダーのようにしたいのですが

お世話になります。
ウェブデザイナーで初心者です。

お客様に使ってもらうのにFC2ブログをカスタマイズしているのですが、
記事をアップロードしたものを、
本文の上にカレンダーのように、
ミニ画像にして、
並べたいのですが、
お客様のアップしたバラバラのサイズの写真を
真四角に小さくトリミングさせて、
枠に入れて並べたいのですが、どんなHTML+CSSとか使ったらいいのか、
具体的に教えていただけないでしょうか?
マスキングするタイプのフォトギャラリー形式の
テンプレートをいじってみたのですが、
複雑すぎてよくわかりませんでした;
タイトルと日付と写真だけが並べばいいのですが。
それで写真タイトルをクリックすると本文にスクロールする感じの
イメージです。
どうぞ宜しくお願い致します。m(==)m


[出来上がりイメージ]

|□|□|□|□| ←カレンダーっぽいインデックス
───────
 □  あいう  ←本文

2013年12月26日 10:41  by ○○福祉専門学校

コメント一覧 6件中、1~6件表示

  • ucd さま☆

    詳しくありがとうございましたm(==)m
    プラグインの
    囲みケイやフォントのデザイン的な指定はどこですればいいのか
    ?でしたので、
    その変数だとうまくいきそうな感じがしますね!

    いろいろ試してみたいと思います。
    市販のFC2カスタマイズの本も買ってみたのですが、あまり詳しくなくて、
    助かります。

    ありがとうございました(^^)

    2013年12月27日 14:15 by ○○福祉専門学校

  • 横からすみません、失礼します。
    もう見ておられないかもしれませんが、FC2には「<%topentry_image_72>」という、記事本文 中最初にある画像を自動サムネ化する独自変数もあります。
    例えば

    <header>
    <!--topentry-->
    <a href="#<%topentry_no>"><%topent ry_image_72></a>|
    <!--/topentry-->
    </header>
    <main>
    <!--topentry-->
    <section>
    <h1 id="<%topentry_no>"><%topentry _title></h1>
    <p><%topentry_body></p>
    </section>
    <!--/topentry-->
    </main>

    みたいな構造にすれば、それっぽくならないでしょうか。
    こんな感じで機能上OKであれば、サムネ一覧のとこをちゃんとリストタグ使ってdisplay:inlineしてボーダーとか 余白つけて…と整えていってください。

    2013年12月27日 13:01 by ucd

  • 標野ゆき さま(^^)

    ご丁寧にありがとうございます♪

    はい、こんなイメージです。

    あとでじっくりみてみます。

    いろいろありがとうございました☆

    感謝です☆

    2013年12月26日 18:48 by ○○福祉専門学校

  • http://calendar2.org/index.html
    http://snakamura.org/software/smartcalendar/

    こちらのページに紹介されているフリーソフトは
    PC内の写真をサムネイル化してカレンダーにちりばめてくれるソフトのようです。
    もしかしたらご参考になるかもしれません。

    2013年12月26日 12:29 by 標野ゆき

  • 標野ゆきさま

    早速ありがとうございます。

    なるほど〜。共有プラグインにサムネイルやギャラリーがあるのですね!

    とっても参考になりました!早速探してみます。

    どうもありがとうございましたm(==)m

    2013年12月26日 12:04 by ○○福祉専門学校

  • そういう場合はたいてい
    JavaScriptが使ってあるのではないでしょうか。

    テンプレートよりも
    共有プラグインを「サムネイル」や「ギャラリー」で検索して
    気になるプラグインを借りて、記述を睨んでみた方が役立ちそうな気がします。

    「寝込み屋」さんの「最近の画像」プラグインなどは
    いろんな情報を表示するようになっているので、ご参考になるかも。

    2013年12月26日 11:52 by 標野ゆき