一覧表示の表示順コントロール

[saisai]

はじめまして、CMSに興味を持っていてこちらのツールが飛び込みやすそうでしたのでためさせていただいております。

試していた中で質問があるのですが、画像を登録していて一覧表示をしたときに
表示順をコントロールしたいのですがどのようにすればよいでしょうか？

メニュー項目で表示順と言うか場所を指定しようと右上・左上・中央・右下・左下
（それぞれに番号を振っています）の情報を入れています。

IF文も試してみたのですが、思ったような結果になりませんでした。

ヒントでもかまいませんのでご教授お願いいたします。

[webmaster]

　saisaiさん、はじめまして。ご質問ありがとうございます。

　基本的には、例えば、

コード: 全て選択

<data name="photolocation" type="menu" caption="写真の位置">
	<menuitem id="topleft">左上</menuitem>
	<menuitem id="topcenter">中央</menuitem>
	<menuitem id="topright">右上</menuitem>
	<menuitem id="bottomleft">左下</menuitem>
	<menuitem id="bottomright">右下</menuitem>
</data>
<data name="photo" type="img" caption="写真" maxfilesize="300KB" width="1024" height="768" />

　のようなスキーマを作って、

コード: 全て選択

<img src="{photo}" class="{photolocation}" />

　のようにclass名で修飾し、後はCSSを使ってそれぞれ

コード: 全て選択

img.topleft { ... }
img.topright { ... }
img.center { ... }
　：

　のようにそのレイアウトを書いていく事になると思います。
　左上、右上などは、float:leftやfloat:right（と、必要なだけのmargin/padding）
を指定すればOKだと思いますが、左下、右下などは、CSSだけで実現するには単純にはいかないかと思います（私は方法を知りません）。

　テキストの回りこみをしないのであれば、テキストの前に表示する場合と
後に表示する場合とで場合分けして、その中で右、左、中央を切り替えるという
方法もあるかと思います。

コード: 全て選択

<xsl:if test="photolocation='topleft' or photolocation='topright' or photolocation='topcenter'">
<div class="imagebox"><img src="{photo}" class="{photolocation}" /></div>
</xsl:if>
テキスト
<xsl:if test="photolocation='bottomleft' or photolocation='bottomright' or photolocation='bottomcenter'">
<div class="imagebox"><img src="{photo}" class="{photolocation}" /></div>
</xsl:if>

　以上、何かのご参考なりましたら幸いです。

[saisai]

丁寧な返信ありがとうございました。

条件分岐等を使って表示場所を切り替えれればと思ったのですが、やはりCSSで補完しないと難しいのですね、、、

では、ちょっと異なりますがリストで一覧を表示した際に任意の表示順に切り替えることはできるのでしょうか？

似たような質問が上がっていたときには、検討対象とされていたようなのですが、、、

以上、よろしくお願いいたします。

[webmaster]

　webmasterです。

　tableレイアウトを使ってxsl:ifで対象のtd内に画像を配置するという方法も
ありかと思います。:)

　リストで一覧を表示、というのは、繰り返し項目でのお話でしょうか。
　それとも、各エントリに１つずつ画像があり、エントリ一覧表示で画像を
一覧表示する、というお話でしょうか。

　前者であればコンテンツ管理画面よりリストの順序を入れ替えることが可能
ですが、後者の場合は申し訳ありません、現状では該当機能がございません。m(__)m

[saisai]

どうもです、saisaiです。

返信ありがとうございました。
追加で質問していたのは後者のほうでした。

そのほかにも方法があるようなので、初期の構成からも少し考え直して
見たほうが良いのかもしれないですね。

とりあえずはtableとxsl:ifで試してみます。

ありがとうございました。

[saisai]

お世話になっています、saisaiです。

＞tableレイアウトを使ってxsl:ifで対象のtd内に画像を配置するという方法も
ありかと思います。

のヒントを元にチャレンジした結果、無事目的の表示状態にたどり着けました。

若干処理が重複しながらなので、データ量が多いと辛そうですがとりあえずはクリアできましたので報告いたします。

ありがとうございました。