TOPページ「お勧め商品」を１列あたり５個にしたい

[steve-osaki]

---

WordPress のバージョン：3.3.1

Welcart のバージョン：1.1.5

ご利用のテーマ：Welcart Default Theme 1.1

症状を確認したブラウザ： Google Chrome　19.0.1084.54

サーバー（会社名、サービス名）：さくらインターネット

SSLの利用：　無し

WordPress のパーマリンク設定：カスタム構造（/%category%/%postname%/）

---

お世話になっております。

トップページの「お勧め商品」の

商品画像を、

デフォルトの１列あたり４個　→　１列あたり５個

に変更したいと考えてます。

home.phpの中を見まして、

商品を出力するphpの中のコード

posts_per_page'=>8

の値を10に変えたのですが、

１列あたり４個表示のままで、

列だけが３列に増えました。

色々調べてみたのですが、

どこのコードで１列あたりの個数を制御しているのかが

分かりませんでした。

１列あたりの個数を変更する方法orヒント等、

ご教授いただけますと幸いです。

[yasumax]

こんにちは。

1列あたり5個にするにはCSSの編集が必要になります。

style.css内の「#content .thumbnail_box」セレクタの横幅(width)・縦幅(height)を調整してください。

商品画像のサイズはhome.php内のWelcart専用テンプレートタグ「usces_the_itemImage」の横幅(width)・縦幅(height)の値を変更してください。

[steve-osaki]

ご返信ありがとうございます。

ご指示どおりCSSを変更すると、一列あたり５個で表示できました。

ですが、

サムネイルのサイズは変えずに５個表示にしたいと考えております。

「お勧め商品」は、

全体が

<div class="clearfix">

で囲まれていますが、

このdivタグが現在５６０px　×　630pxで設定されて（？）います。

私がやりたい事としては、

サムネイルのサイズはそのままで

このdivタグの横幅を広げて５個表示にしたい、というイメージです。

ただ、class=”clearfix”　にタテヨコ幅を設定している記述が見つけられませんでしたので、

ひょっとして関数で制御されてるかなと思っていて、そこで行き詰っています。

説明不足で申し訳ありません。

[yasumax]

こんにちは。

> サムネイルのサイズはそのままで

> このdivタグの横幅を広げて５個表示にしたい、というイメージです。

3カラムの状態かつ、サムネイルのサイズをそのままで5個表示は厳しいです。

4個表示が限界です。

トップページも2カラムに変更してみてはどうでしょうか？

2カラムにする方法は以下のとおりです。

・home.phpの12行目「three-column」を「two-column」に変更

・saidebar.phpの「begin right sidebar」～「end right sidebar」の間を全て削除

あとは、商品一つ一つのブロックを調整すればキレイに表示されると思います。

[steve-osaki]

yasuma様

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

「two-column」の変更方法を知らず、

以前から擬似的に２カラムにしていたのが混乱の元でした…。

ご指示どおりに変更したところ、問題なく５個表示が実現できました！

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

[投稿者]

投稿