【Wordpress】ドロップシッピングサイトで新着商品をトップページに自動表示させる方法と表示件数の個別指定
も・く・じ
ドロップシッピング(DS)サイトで新着商品の表示件数を個別に指定したいと思ってさぁ書こうと思ったら書き方を完璧に忘れていました。
再度調べ直しという悪循環。
これはまずいと思い、今後もひんぱんに機会があるのでここに書き記しておきます。
いわゆる新着記事の表示方法
「新着商品」といっても新着記事(投稿)の自動表示にほかなりません。
ただし私の場合はカスタム投稿と通常投稿の両方を使い分けてサイト構築しているので両方の書き方を記しておきます。
ネット情報を適当に組み合わせて書いた素人構文なので若干変な書き方になってるかもしれません。
まぁしかし一応問題なく動いているのと、HTML構文もエラーが出てないので今は良しとしています。
書き方はここに書いてあるやり方以外にもいっぱいあるので、ご覧になった方は参考程度にお願いしますネ。
私のDS販売サイトのトップページは「home.php」で統一作成しているのでその中に以下を記述してます。
下記の記述はカスタムフィールドに入力した項目の一部分だけを自動表示させるようにしてあります。
またカスタム投稿の場合は、複数投稿タイプの商品すべてに対して有効という前提となっています。
単一の投稿タイプしかない場合、もしくは特定の投稿タイプのみの場合はまた別の書き方になるんですが、ここでは割愛します。
むしろ単一投稿タイプの書き方の方が簡単に web 上で探せると思います。
ここに表示件数を指定することでワードプレス側の共通設定を無視することができるます。
カスタム投稿時(複数投稿タイプ指定)
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
<div id="news"> <p>【新着商品のお知らせ】</p> <ul> <?php query_posts( Array( 'post_type' => array ('投稿タイプ名','投稿タイプ名','以下同様...'), 'posts_per_page' => '12', 'orderby' => 'date', 'order' => 'DESC' ) ); if (have_posts()) : while (have_posts()) : the_post(); ?> <li> <ul> <li><?php the_time('Y.m.d'); ?> 入荷</li> <li><img src="(画像パス)"></li> <li><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li> <li><?php echo number_format(post_custom('税込価格')); ?> 円</li> </ul> </li> <?php endwhile; endif; wp_reset_query(); ?> </ul> </div> |
簡単に説明しますと、
- 7行目は表示させたい投稿タイプ名
- 8行目は表示させたい件数
- 9,10行目は日付降順
- 16行目で投稿を公開した日付+「入荷」テキスト
- 17行目は商品画像
- 18行目は商品名+リンク
- 19行目は商品価格+「円」テキスト(※数値を自動で3桁カンマにする命令も付けてみました)
日付に関しては"time"ではなく"date"にすると、同一日時内に2商品以上アップした場合、最新の商品情報にしか日付が表示されないのでこれはお好みで。
商品画像の自動取得に関しては『商品IDフォルダ内の画像(中).jpg を自動取得せよ』という私独自のパス取得php を書きこんであるので、このあたりは自ずと異なります。
アイキャッチ画像を利用するという手もあります。
最後の「wp_reset_query();」に関しては、条件指定をリセットする命令のようなんですが、このあとに続く構文次第ではなくてもいいものみたいです。
(よくわかってません)
通常投稿時
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<div id="news"> <p>【新着商品のお知らせ】</p> <ul> <?php query_posts('showposts=12'); if (have_posts()) : while (have_posts()) : the_post(); ?> <li> <ul> <li><?php the_time('Y.m.d'); ?> 入荷</li> <li><img src="(画像パス)"></li> <li><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li> <li><?php echo number_format(post_custom('税込価格')); ?> 円</li> </ul> </li> <?php endwhile; endif; wp_reset_query(); ?> </ul> </div> |
以上です。
記事はお役にたてましたか?
記事に興味をもっていただけたらソーシャルボタンでの共有お願いします^^
↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓