サムネル表示件数

tk3 · 投稿記事 by **tk3** » 2007年6月20日(水) 12:24

こんにちは　お世話になります。サムネル化し１ページに１２件表示したいと考えています。４列３行です。リファレンスを読んで作ってみましたが上手く表示されません。
デザイン
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE xsl:stylesheet [
<!ENTITY nbsp " ">
<!ENTITY copy "©">
<!ENTITY reg "®">
<!ENTITY trade "™">
<!ENTITY mdash "—">
<!ENTITY ldquo "“">
<!ENTITY rdquo "”">
<!ENTITY pound "£">
<!ENTITY yen "¥">
<!ENTITY euro "€">
]>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="EUC-JP" omit-xml-declaration="yes" />
<xsl:template match="/entrylist">
<link href="../../../../dot_images/css_temp/style.css" rel="stylesheet" type="text/css" />
<xsl:for-each select="row">
<xsl:for-each select="entry">
<table width="92" border="0" cellspacing="0" cellpadding="0">
<tr>
<th scope="col">
<a href="ktichin.php{@href}"><xsl:if test="not(pics='')"><img src="{pics}&h=72" /></xsl:if>
<xsl:if test=" pics=''"><img src="/cms/dot_images/bot_temp/soon.gif"/>
</xsl:if>
</a></th>
</tr>
<tr>
<th class="t1216" scope="col"><a href="ktichin.php{@href}"><xsl:value-of select="number" /></a></th>
</tr>
</table>

</xsl:for-each>
</xsl:for-each>
</xsl:template>
</xsl:stylesheet>

PHP部
<?php require_once( "cmsdesigner/include/view.php.inc" ); // encoding="euc-jp" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-jp"/>
<title>dotdesign サムネール表示</title>
</head>

<cmsd:entrylist name="kitchen" design="default" cols="4" rows="12">
<cmsd:group key="kitchenlist" />

</cmsd:entrylist>

</html>
<?php cmsd_end_template(); ?>

こんな感じで作ってみました。表示は縦にされて件数もかわりません。
宜しくお願いします。

tsu · 投稿記事 by **tsu** » 2007年6月20日(水) 15:44

tk3さん
多分現状はtableがエントリ分表示されているかと思います。
あまりこの機能は使わないのでもう忘れちゃったんですが、trタグをfor:eachで括れば思い通りに動くと思います。多分。
時間がなかったので動かしていません。ダメだったらごめんなさい。

ちょっと間違えてたので修正します。すいません。
thタグはtdに置き換え、divタグを追加しちゃいました。

コード: 全て選択

<xsl:for-each select="row">
<table width="92" border="0" cellspacing="0" cellpadding="0">
<tr>

<xsl:for-each select="entry">
　<td>
　　<div>
　　　<a href="ktichin.php{@href}">
　　　　<xsl:if test="not(pics='')"><img src="{pics}&h=72" /></xsl:if>
　　　　<xsl:if test=" pics=''"><img src="/cms/dot_images/bot_temp/soon.gif"/></xsl:if>
　　　</a>
　　</div>
　　<div>
　　　<a href="ktichin.php{@href}"><xsl:value-of select="number" /></a>
　　</div>
　</td>
</xsl:for-each>

</tr>
</table>
</xsl:for-each>

tsu · 投稿記事 by **tsu** » 2007年6月20日(水) 15:59

ん、よく見るとthタグが２つ出てきてますね。
コレだとうまくいかない気がします。

それにtrタグを括るのではなく、この場合thタグでした。すいません。

tk3さん、ご質問ありがとうございます。

通常、エントリ一覧のデザイン定義には、次のようなXMLデータが内部的に渡されています。

コード: 全て選択

<entrylist>
  <entry id="00001">エントリ1のデータ</entry>
  <entry id="00002">エントリ2のデータ</entry>
  <entry id="00003">エントリ3のデータ</entry>
  <entry id="00004">エントリ4のデータ</entry>
  <entry id="00005">エントリ5のデータ</entry>
  <entry id="00006">エントリ6のデータ</entry>
</entrylist>

しかし、cmsd:entrylistタグで cols="3"のように指定すると、

コード: 全て選択

<entrylist>
  <row>
    <entry id="00001">エントリ1のデータ</entry>
    <entry id="00002">エントリ2のデータ</entry>
    <entry id="00003">エントリ3のデータ</entry>
  </row>
  <row>
    <entry id="00004">エントリ4のデータ</entry>
    <entry id="00005">エントリ5のデータ</entry>
    <entry id="00006">エントリ6のデータ</entry>
  </row>
</entrylist>

のように、3件ずつrow要素の中に梱包されて渡されます。

よって、これを

コード: 全て選択

<table>
  <tr>
    <td>コンテンツ1</td>
    <td>コンテンツ2</td>
    <td>コンテンツ3</td>
  </tr>
  <tr>
    <td>コンテンツ4</td>
    <td>コンテンツ5</td>
    <td>コンテンツ6</td>
  </tr>
</table>

のように出力したい場合には、

コード: 全て選択

<xsl:template match="entrylist">
  <table>
    <xsl:for-each select="row">
      <tr>
        <xsl:for-each select="entry">
          <td>
            <xsl:value-of select="data1" /><!-- data1を出力 -->
          </td>
        </xsl:for-each>
      </tr>
    </xsl:for-each>
  </table>
</xsl:template>

のようにしてみて下さい。

ただ、単にサムネイルを格子状に並べたいという場合には、colsを
指定せずに単に画像を適当なdivタグで囲って縦一列に出力した後、
そのdivタグに対してCSSでwidthとheight、float:leftを指定
することで、同様の効果を得る事ができます。

コード: 全て選択

<xsl:template match="entrylist">
  <xsl:for-each select="entry">
    <div class="pics">
      <img src="{pics}&h=72" />
    </div>
  </xsl:for-each>
</xsl:template>

-- css --
div.pics {
  width : 100;
  height : 100;
  float : left;
}

ブラウザの横幅に応じて列数が増減するので一石二鳥です。
列数を固定したい場合には、全体をdivで囲ってそのwidthを
列数×個別のdivのwidthの幅で指定してやれば、きれいに収まります。

基本的な形でのサンプルを提示させて頂きました。
ご不明な点がございましたら再度ご連絡頂ければ幸いです。

tk3 · 投稿記事 by **tk3** » 2007年6月21日(木) 10:58

度々皆様有難う御座います。なんとか表示できました。今後も無知なので宜しくお願いします。

CMS Designerユーザーズフォーラム

サムネル表示件数

サムネル表示件数

Re: サムネル表示件数

有難う御座いました。