WordPress
【WordPress】レスポンシブにも対応した素晴らしいグリッドプラグイン。Post Grid
February 23, 2016
Post Gridはレスポンシブにも対応した素晴らしいグリッドレイアウトプラグイン。投稿だけではなく、固定ページ、ナビゲーションメニューなども表示させることができます。
ページネーションやソーシャル共有ボタンも表示させることができ、グリッド幅の設定も可能のようです。
Post Gridプラグインを導入
ダッシュボード >> プラグイン >> 新規追加 >>
有効化にすると設定にPost Gridが追加されます。
Shortcodes
ショートコードをコピーして、ポストグリッドを表示する場所ページや記事に貼り付けます。
PHPコードも準備されています。
Query Post
| Post Types | ポストタイプを選択します。複数選択もできます。 |
|---|---|
| Post Status | ポストの状態 |
| Posts per page | 表示するポストの数。-1で全て表示。 |
| Exclude by post ID | 除外するポストID |
| Post query order | クエリ順序昇順または降順 |
| Post query orderby | クエリorderbyのパラメータ。複数選択もできます。 |
| Search keyword | 検索キーワード |
Layout
| Layout | レイアウトを選択します。右寄せや中央に変更できます。 |
|---|---|
| Skins | グリッドスキンを選択。フリップなどのアニメーションが付けれます。 |
Layout settings
| Grid Items Width | 異なるデバイス用のグリッド幅設定。 |
|---|---|
| Media Height | メディアの高さ |
| Featured Image size | 画像サイズ |
| Media source | メディアソース |
| Grid Items Margin | マージン |
| Grid Container options | オプション。paddingや背景の色を変更できます。 |
Navigations
ナビゲーションレイアウトをカスタマイズできるのはプレミアムの機能みたいなので、下のNone、Paginationでページネーションを表示するかを選択します。
ページネーションを表示する場合はPagination themesでテーマを選択します。
上記画像をホバーすると下記のようになります。
上記ではデフォルトの状態なのでTitle,Contents,Read moreが表示されていますが、Layout Editorでソーシャルアイコンやカテゴリー、タグなども表示させることができるようです。
