Diviのフィルター可能ポートフォリオモジュールの使い方

こんにちは、根本です。今回は、Diviのフィルター可能ポートフォリオというモジュールの使い方をご紹介していきます。

Diviのフィルター可能ポートフォリオモジュールとは？

フィルター可能ポートフォリオというのは、WordPressの「案件」を表示することができるモジュールです。また、モジュールの上部にカテゴリータブが表示されるので、タブを切り替えて別のカテゴリーにあるポートフォリオを表示できます。だから、「フィルター可能ポートフォリオ」と呼ばれています。

他にも「ポートフォリオ」というシンプルなモジュールもありますが、こちらは上部にフィルターが表示されないため、フィルタリングできません。

コンテンツ設定

コンテンツ

「コンテンツ」では、まず「投稿数」で1つのモジュール内で表示したいポートフォリオの数を入力します。その下の「含まれるカテゴリー」では、表示したいポートフォリオのカテゴリーにチェックを入れます。

要素

• タイトルを表示する：「はい」にすることで、ポートフォリオのタイトルを表示できます。
• カテゴリーを表示する：「はい」にすることで、ポートフォリオのタイトルの直下にカテゴリー名を表示できます。
• ページネーションを表示：ポートフォリオが多い場合は、複数のページに渡って表示されるようになりますが、「はい」に切り替えればページを切り替えるためのページネーションを表示することができます。

デザイン設定

レイアウト

「レイアウト」では、ポートフォリオの表示方法を選択します。「フルワイド」か「グリッド」の2つ用意されていて、

「フルワイド」の場合は、このように、モジュールの横幅いっぱいに1つのポートフォリオが表示されます。

一方、「グリッド」では、複数のポートフォリオが1列に表示される形式になります。

画像

• 画像 角丸長方形：画像の角の丸みを調節します。
• 画像 ボーダースタイル：画像ボーダーを付ける場合、そのタイプをこちらから選択します。
• 画像 ボーダー幅：設定したボーダーの幅をここで調節します。
• 画像 ボーダーカラー：画像に追加したボーダーの色を設定します。
• 画像 ボーダースタイル：ボーダーのタイプをドロップダウンから選択します。
• 画像とビデオ：画像にシャドーをつけるかどうか、つける場合はそのタイプを選択します。

テキスト

• 文字列の揃え：カテゴリー・タイトル・文章に反映される項目で、テキストの位置を設定します。
• テキストの色：これは、ポートフォリオのタイトルに反映される項目で、テキストの色を「暗い」色にするか、「明るい」色にするかを選択します。
• 文字サイズ：カテゴリーテキスト以外に適用される設定で、文字にシャドー効果を付けることができます。

タイトル・フィルター基準・メタ情報・ページネーションを表示テキスト

• 見出し3を挿入：これは「タイトルテキスト」にのみで設定できる項目で、タイトルのHタグを設定します。
• フォント：テキストのフォントを変更できます。
• ソフトライト：文字の太さを選択します。
• 書式のコピー：テキストの書式（斜体にしたり、打ち消し線を引いたり）を設定します。複数の書式を選択することも可能です。
• 文字の揃え：テキストの位置を設定します。
• テキストカラー：文字の色を設定します。
• 文字サイズ：文字の大きさを調節します。
• 文字間隔：テキストの各文字の隙間を調節します。
• 行の高さ：縦の幅を調節します。
• 文字サイズ：テキストにかけるシャドウを設定します。