エントリーのレイアウトを商品の羅列の様に変更したい

  • 解決済 masatoshigoto

    (@masatoshigoto)


    14年、 8ヶ月前

    はじめまして。

    ポートフォリオのサイトで作品を見せるのにwordpressを検討しています。
    各エントリーは画像とテキストの作品タイトルやサイズという形で、
    ページの見え方をショッピングサイトでの商品の羅列にしようと考えています。
    ↓サンプル
    http://list3.auctions.yahoo.co.jp/jp/ASUS-ノートブック-Windows-パーソナルコンピュータ-コンピュータ/2084239350-category-leaf.html?alocale=0jp&mode=1

    例えば3×3の1ページ9作品ずつが表示され、エントリーを追加すると古いものは別ページ映り、またカテゴリーで年代別や作品の形態によって閲覧できるといった具合です。

    phpの知識がなくレイアウト変更が厳しそうなので、http://www.usconsort.com/ こちらを導入して価格分は隠す、という方法を考えています。
    他に何か良いアイディアがありましたら、教えてください。
    よろしくお願いします。

4件の返信を表示中 - 1 - 4件目 (全4件中)
  • kz

    (@kz)

    14年、 8ヶ月前

    陳列棚的な出力：

    <?php
if (have_posts()) :
  $count = 0;
  while(have_posts()) :
    the_post();
    if($count++ == 3) :
      $count = 0;
      ?><div class="hr"><!--//--></div><?php
    endif;
    ?>
    <div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
      <?php /* the_content() 的な何かで記事の内容を出力 */ ?>
    </div>
    <?php
  endwhile;
  ?><div class="hr"><!--//--></div><?php
endif;
?>

    style.css で

    hentry{float:left;}
.hr{clear:both;}

    とかなんとかすればソレらしくなります。

    トピック投稿者 masatoshigoto

    (@masatoshigoto)

    14年、 8ヶ月前

    kzさん

    どうもありがとうございます。
    試してみました。

    index.phpに

    <?php
if (have_posts()) :
  $count = 0;
  while(have_posts()) :
    the_post();
    if($count++ == 3) :
      $count = 0;
      ?><div class="hr"><!--//--></div><?php
    endif;
    ?>
    <div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
<?php the_content(__('Read the rest of this entry &raquo;', 'kubrick')); ?>
</div>

    <?php
  endwhile;
  ?><div class="hr"><!--//--></div><?php
endif;
?>

    としてみましたが、通常のように縦にエントリーが降りていってしまいました。

    style.cssに記述する
    hentry
    がどこにかかるのかがよく分からず、いくつか考えてみたのですが
    うまく動作しませんでした。

    また確認してみていただけますか？
    よろしくお願いします。

    kz

    (@kz)

    14年、 8ヶ月前

    あ。
    .hentry
    でヨロシク。

    トピック投稿者 masatoshigoto

    (@masatoshigoto)

    14年、 8ヶ月前

    kzさん

    解決いたしました。
    どうもありがとうございます！

4件の返信を表示中 - 1 - 4件目 (全4件中)
  • トピック「エントリーのレイアウトを商品の羅列の様に変更したい」には新たに返信することはできません。