【WordPress】レスポンシブにも対応した素晴らしいグリッドプラグイン。Post Grid

post_grid_s

Post Gridはレスポンシブにも対応した素晴らしいグリッドレイアウトプラグイン。投稿だけではなく、固定ページ、ナビゲーションメニューなども表示させることができます。
ページネーションやソーシャル共有ボタンも表示させることができ、グリッド幅の設定も可能のようです。

Post Gridプラグインを導入

ダッシュボード >> プラグイン >> 新規追加 >> Post Gridを検索
有効化にすると設定にPost Gridが追加されます。

Shortcodes

post_grid_1
ショートコードをコピーして、ポストグリッドを表示する場所ページや記事に貼り付けます。
PHPコードも準備されています。

Query Post

post_grid_2

Post Types ポストタイプを選択します。複数選択もできます。
Post Status ポストの状態
Posts per page 表示するポストの数。-1で全て表示。
Exclude by post ID 除外するポストID
Post query order クエリ順序昇順または降順
Post query orderby クエリorderbyのパラメータ。複数選択もできます。
Search keyword 検索キーワード

Layout

post_grid_3

Layout レイアウトを選択します。右寄せや中央に変更できます。
Skins グリッドスキンを選択。フリップなどのアニメーションが付けれます。

Layout settings

post_grid_4

Grid Items Width 異なるデバイス用のグリッド幅設定。
Media Height メディアの高さ
Featured Image size 画像サイズ
Media source メディアソース
Grid Items Margin マージン
Grid Container options オプション。paddingや背景の色を変更できます。

Navigations

post_grid_7
ナビゲーションレイアウトをカスタマイズできるのはプレミアムの機能みたいなので、下のNone、Paginationでページネーションを表示するかを選択します。
ページネーションを表示する場合はPagination themesでテーマを選択します。

post_grid_5

上記画像をホバーすると下記のようになります。

post_grid_6

上記ではデフォルトの状態なのでTitle,Contents,Read moreが表示されていますが、Layout Editorでソーシャルアイコンやカテゴリー、タグなども表示させることができるようです。

 
wordpress

【WordPress】レスポンシブにも対応した素晴らしいグリッドプラグイン。Post Grid

  • LATEST
  • RELATED
  • POPULAR