1. >
  2. >
  3. 投稿記事をランダムでピックアップ

投稿記事をランダムでピックアップ

ランダムでめくれるイメージ
PHP

記事をランダムに表示させる

関連記事や新着記事を呼び出す方法はたくさんありますが、たまに過去の記事を目にしてひらめくときってありませんか?
今回は、ランダムで投稿記事を表示する方法を紹介します。

サイドバーに一覧として出力するパターンと、スクロールを使ってコンパクトに表示する方法を紹介します。

ランダム記事を入れる場所

サイドバーに入れてみます。
sideber.phpの閉じタグ手前に入れます。

サイドバーに入れたイメージ

ランダムで出すソース

アイキャッチに画像が入っていない場合に、ノーイメージとして画像が出るように条件分岐しています。
お好みの画像を入れるか、不要な場合は削除してください。

記事数を変更する場合は、「showposts =>5」の数字を調整してください。
ここの数字が表示記事数になります。

立て並びで一覧表示させるCSS

サイドバーにアイキャッチとタイトルを並べただけのcssです。
立て並びのイメージ

横並びにしてスクロールさせる

cssだけでスクロールできるんです。ピタッと止まってくれるスクロールの詳細は、こちらで紹介していますのでご確認下さい。
スライダーとかスクロールでピタッと止まって欲しい!scroll-snap-typeってなに

イメージはこんな感じになります。
スクロールさせたイメージ

5記事を横並びにしたときのスタイルを紹介します。
スマホサイズにしたときにスクロールがピタっと止まるので、ぜひお試しください。

このサイトのサイドバーにもランダム記事をスクロールできるようにしていますので、確認してみてください。

カテゴリー: PHP

検索語を上に入力し、 Enter キーを押して検索します。キャンセルするには ESC を押してください。

トップに戻る