ポートフォリオ機能で商品一覧・顧客の声を作成!
作品集、お客様の声、事例集などをカテゴリーで分けて、一覧で表示できる機能です。
一覧から1つをクリックすると、ポップアップで詳しい内容を表示したり、専用の詳細ページを開いたりできます。
こんな使い方ができます
- お客様の声を、業界別・ジャンル別に分けて紹介する
- 制作実績や作品集を載せる
- 商品を紹介する(物販の方におすすめ)
- 動画講座を、カテゴリー別の一覧ページにする(動画配信サービスのような見せ方)
全体の流れ
① ポートフォリオを開く
② 全体のデザインを決める(ページテーマ・ヘッダー)
③ アイテムを追加する
④ カテゴリーで分ける
⑤ メニューやページに表示する
① ポートフォリオを開く
メニューの「ポートフォリオ」を開きます。
テンプレートによっては、最初から表示されていない場合があります。その場合は「新しく追加」から「ポートフォリオ」を追加してください。

② 全体のデザインを決める
先に全体のデザインを決めておくと、あとの作業が楽になります。
ページテーマ
個別ページの雛形(フォーマット)です。最初に作っておくと、新しいアイテムを追加したときに同じ形で作られるので、編集がしやすくなります。
ヘッダー
ポートフォリオ一覧ページの、上部のデザインです。プレビューで見た目を確認しながら選べます。

③ アイテムを追加する
「アイテムを追加」をクリックして、1つずつ登録していきます。
- 題名:アイテムの名前
- 説明:ポップアップなどで表示される説明文
- 画像:1枚だけ、またはギャラリー(複数枚)で表示できます
- 動画のURL:埋め込みコードを入れると、動画も表示できます
表示のしかたを選ぶ
- 一覧に題名を表示
- ライトボックスで画像を表示:クリックすると画像が大きく表示されます
- ポップアップで説明表示:クリックすると説明がポップアップで表示されます
- 専用のページ:クリックすると詳細ページが開きます
専用のページを作る場合
「専用のページを追加」をクリックすると、「ページを編集」の項目が追加されます。ここから、詳しい内容の個別ページを作成できます。
「ページの設定」では、次の設定ができます。
- URL:個別ページのURL
- メタディスクリプション:検索結果に表示される説明文(SEOを気にする場合は設定しましょう)

ポップアップと個別ページ、どちらを選ぶ?
表示方法 | 向いているケース |
|---|---|
ポップアップ・ライトボックス | 物販など、写真と短い説明で伝わるもの |
専用の個別ページ | お客様の声や事例など、じっくり読んでもらいたいもの |
④ カテゴリーで分ける
アイテムをカテゴリーで分類すると、一覧ページにカテゴリーが表示され、クリックで絞り込めるようになります。
- カテゴリーの項目で、新しいカテゴリー名を入力します。
- 「+」をクリックします。
- 「確認」をクリックすると、カテゴリーが追加されます。
追加したカテゴリーを、各アイテムに設定していきます。
(例:お客様の声を「美容」「飲食」「教育」などの業界別に分ける)
⑤ ポートフォリオ全体の設定
「ポートフォリオ」の全体設定では、次のことができます。
- 名前の変更:メニューに表示される名前を変えられます(例:「お客様の声」「実績紹介」)
- URLの変更:一覧ページのURL
- SEO情報:一覧ページがシェアされたときに表示される内容
- 会員サイトにする:ポートフォリオ全体を、会員だけが見られるページにできます

⑥ ページやメニューに表示する
メニューに追加する
ホームページのメニュー設定で、「ページグループ」の中の「ポートフォリオ」を選び、「全て」を追加します。個別のページだけを表示させることもできます。
好きな場所に表示する
ウィジェットを使うと、ページの好きな場所にポートフォリオを表示できます。
- ウィジェットから「ポートフォリオ」をドラッグして入れます。
- 「アイテムを追加」をクリックすると、登録済みのアイテムが表示されます。
- クリックすると、表示のしかたを設定できます。
- 何列で並べるか(3列・4列など)
- グリッド表示(一覧で並べる)
- タイトルを表示する
- カテゴリーを表示する
- スライドで表示する

ポイント
- 先に「ページテーマ」を作りましょう。 あとからアイテムを追加するたびに、同じ形で作られるので編集が楽になります。
- 画像は必ず入れましょう。 一覧で並んだときの見え方が大きく変わります。
- 会員サイトとしても使えます。 ポートフォリオ全体を会員限定にすれば、動画講座の一覧ページのような使い方もできます。カテゴリーで動画を分けておくと、見たいジャンルから選んでもらえます。
ページビルダー一覧
ブロックの表示設定(見る人・日時・国などで表示を切り替える)
更新日 04/10/2026
ありがとうございます
