WordPress でオンラインポートフォリオを構築する方法

ポートフォリオ Web サイトは、必要なものをすべて紹介するのに最適なプラットフォームです。それはあなたが販売している製品、あなたが完了したプロジェクト、あなたが受け取った賞、インスピレーションを与えた写真、またはあなたが誇りに思っているアートワークかもしれません。ポートフォリオサイトは、製品、サービス、スキルをターゲットユーザーにマーケティングします。さらに、見込み客の発掘にも役立ちます。あなたがクリエイティブな専門家 (Web デザイナー、アーティスト、画家、ライター、グラフィックイラストレーター) の場合、クライアントを惹きつけてビジネスを成長させるために、優れたデザインの Web サイトが特に重要です。

この投稿では、Total テーマを使用して WordPress でポートフォリオ Web サイトを構築する手順を説明します。まず、Total テーマにはポートフォリオ用の組み込みのカスタム投稿タイプが含まれていることを知っておいてください。そのため、ポートフォリオを作成してポートフォリオ項目を追加するのが簡単になります。標準的な投稿の使い方を知っていれば、ポートフォリオの作成がずっと簡単になります。

始めましょう！

ステップ 1: Web ホストを選択する

ホスティングに関しては、あらゆる懐に適した膨大な数のホスティングオプションがあります。しかし、どれを選ぶか迷ったら、WPExplorer が推奨する WordPress ホスティングソリューションを見てください。

Bluehost は低価格で豊富なリソースを提供するため、始めたばかりの場合に最適なオプションです。当社のリンクを使用するとさらに低価格になります。初年度はわずか 2.95 ドルで Bluehost を入手できます。

ただし、使いやすいホスティングが必要な場合は、Flywheel と WP Engine が最も優れたマネージド WordPress ホスティング会社の 2 つです。どちらも優れた機能を手頃な価格で提供しており、何よりもサーバーがすべてを処理してくれるため、サーバーのことを考える必要がありません。

ステップ 2: ドメイン名を選択する

サーバースペースのホストにサインアップする際には、ドメイン名を用意する必要があります。ドメイン名は Web サイトに固有であり、これらの名前は NameCheap や GoDaddy などのレジストラから取得できます。後で変更すると非常に面倒になる可能性があるため、名前は慎重に選択してください。

ステップ 3: WordPress をインストールする

WordPressのインストールは簡単です！管理対象ホストでは、WordPress のインストールがすでにセットアップされています。 Bluehost を選択した場合は、ワンクリックのインストールプロセスに従うだけで、数分で WordPress の準備が整います。

ログイン画面が表示されたら、WordPress のインストール時に作成したユーザー名とパスワードを入力し、Web サイトに入ります。そこに到達したら、実際のポートフォリオ Web サイトの作成に取りかかることができます。

ステップ 4: テーマを選択して有効にする

「合計」を選択するので、このステップは簡単です。このテーマには、ビジネス、慈善団体、ポートフォリオなどに使用できる機能とオプションが多数含まれているため、あらゆるプロジェクトに選択できる最高のテーマの 1 つであると私たちは考えています。また、簡単なデモインポートを使用すると、以下のような美しいポートフォリオ Web サイトを数回クリックするだけで Total で作成できます。

Total テーマをインストールした後、[外観] > [テーマ] > [新規追加] をクリックして、ダッシュボードからアクティブにします。

この段階では、選択する必要があります。デモインポーターを使用して Total からデモ Web サイトをインポートするだけです。 合計 40 以上の事前構築済み Web サイトがあり、ポートフォリオのデモも含まれています。任意のデモを選択してインポートし、独自のコンテンツを追加できます。

好みのデモを選択し、画面上のプロンプトに従ってインストールし、必要なプラグインを有効にして、サンプルコンテンツ (投稿、投稿タイプ、ウィジェット、メニューなど) をインポートするだけです。

ステップ 5: ポートフォリオアイテムの作成と編集、およびポートフォリオアイテムのリストの作成

もちろん、開始するためにデモをインポートする必要はありません。いつでも独自のウェブサイトをゼロから構築できます。 Total テーマを使用すると、独自のポートフォリオを簡単に作成できます。

ただし、ポートフォリオページを作成する前に、そのページに含まれるポートフォリオアイテムを作成する必要があります。 Total では、ポートフォリオアイテムを作成するための 2 つのオプションがあります。

オプション 1: Total のポートフォリオのカスタム投稿タイプをそのまま使用する

最初のオプションは、ポートフォリオの投稿タイプをそのまま使用してポートフォリオを作成することです。 WordPress ダッシュボードから、[ポートフォリオ] > [新規追加]をクリックします。

ポートフォリオアイテムのタイトル、タグ、カテゴリ、テキストコンテンツを追加します。 Total はさまざまなコンテンツタイプをサポートしています。単一の画像を表示する場合は注目の画像を追加し、画像ギャラリーセクションに複数の画像を追加してスライダーを作成するか、リンクを追加します。 ポートフォリオアイテムセクションのオーディオファイルまたはビデオファイルの場合。ただし、これらすべての場合において、メイン設定でページレイアウト (左、右、サイドバーなし) を選択し、ポートフォリオグリッド、カルーセル、関連投稿で使用する投稿のアイキャッチ画像を設定することも必要になるでしょう。完了したら、投稿を保存します。

次のステップでは、 [外観] > [カスタマイズ] > [ポートフォリオ] に移動して、ポートフォリオアーカイブページ (メイン、タグ、カテゴリ) と単一のポートフォリオアイテムページをカスタマイズします。ここから、サイドバーのレイアウト、関連投稿の数を選択し、さまざまなページ要素を有効にして、希望する順序にドラッグ&ドロップできます。

それでおしまい！さらにアイテムを追加してポートフォリオを完成させましょう。

オプション 2: Visual Composer を使用して独自のポートフォリオテンプレートを構築する

もっと実践したい場合は、Total の機能と Visual Composer ページビルダーを使用して、自分自身のデザイナーになることができます。 Visual Composer は、ドラッグアンドドロップ方法を使用して美しいレイアウトを作成するのに役立つビジュアルページビルダーです。ユーザーとしては、コーディングを知る必要がなく、実際に Web 構築プロセスを楽しむことができることを意味します。 Total には無料で付属しており、テーマを有効化すると、ウェブサイトにプラグインをインストールするよう求めるメッセージが表示されます。忘れずに有効化してください。

ダッシュボードから Visual Composer 設定にアクセスして、プラグインをセットアップします。 Visual Composer > ロールマネージャー をクリックし、設定を調整します。最も重要なのは、コンポーザーを使用したい投稿タイプに対してコンポーザーを有効にすることです。デフォルトでは、Visual Composer はページでのみ有効になっています。ポートフォリオの投稿タイプでも有効にすると、Visual Composer を利用してポートフォリオアイテムを構築できるようになります。

最後のオプションと同様に、[ポートフォリオ] > [新規追加] をクリックして新しい投稿を作成する必要があります。投稿に名前を付け、カテゴリまたはタグを選択し、メイン設定セクションでサイドバーのレイアウトを選択して、アイキャッチ画像を設定します。投稿の下書きを保存します。これで構築を開始できます。

Visual Composer のフロントエンド（ビジュアル）エディタまたはバックエンド（ブロック）エディタを使用して、ポートフォリオアイテムの編集を開始するオプションがあります。ページ要素、カスタムカラー、パディング/マージンなどを確認できるため、フロントエンドエディターをお勧めします。ただし、どちらを使用することを選択しても、Visual Composer の [要素の追加] ボタンを選択するだけで開始できます。

要素ライブラリで利用可能なすべての要素が表示されます。 Total には、標準の Visual Composer 要素に加えて、特別に設計された多数の要素がライブラリ内にあります。上のスナップショットでは、画像スライダーとテキストボックスを使用してポートフォリオアイテムを作成していることがわかります。ただし、ライブラリの他のほとんどすべての要素を使用できます。

編集が完了したら、ポートフォリオの投稿を保存し、[公開] をクリックします。同様のアイテムを多数作成する場合は、繰り返し使用するためにテンプレートを保存することもできます。レイアウトをテンプレートとして保存するには、バックエンドエディターに戻ります。

[Templatera] ボタン（小さな灰色のレイアウトアイコンのように見えます）をクリックします。

次に、テンプレートに名前を付けて保存します。新しい投稿でテンプレートを使用するには、Templatera アイコンをクリックして、保存したレイアウトを挿入するだけです。あるいは、特定の投稿タイプのすべての新しい投稿のデフォルトとしてテンプレートを設定することもできます。

これを行うには、Visual Composer > 一般設定に移動し、投稿タイプごとに好みのテンプレートを設定します。ポートフォリオやスタッフなどに多くのアイテムを追加する予定がある場合、標準のページ要素がすべて自動的に挿入され、フォーマットされるため、時間を大幅に節約できます。

ステップ 6: ポートフォリオページの作成

ポートフォリオに表示したいポートフォリオアイテムのリストができたので、これらのポートフォリオアイテムを保持するページを作成します。通常の WordPress で行う方法でページを作成します。 [ページ] > [新規追加] に移動します。新しいページにタイトルを付けて保存します。

次に、使用する Visual Composer オプションをクリックします。ここでも、フロントエンドエディターまたはバックエンドエディターを使用するオプションが表示されます。これにより、ライブドラッグアンドドロップエディターが開きます。青い要素の追加ボタンをクリックします。 Portfolio Grid 要素を使用してポートフォリオページを構築します。 ポートフォリオグリッドを選択します。ポートフォリオページにカルーセルを追加する場合は、[ポートフォリオカルーセル] 要素を選択します。

ポートフォリオグリッド要素の設定を調整して、ポートフォリオページの表示方法を微調整できます。画像のサイズを選択したり、枠線を追加したり、タイトルを付けたり、カテゴリを指定したり、カテゴリを指定したりできます。ページごとの順序、列と投稿、ページネーションの有効化、グリッドスタイルの選択、抜粋の追加など。テキストエディターの下にある設定オプションを入力した後、ポートフォリオページを保存します。

変更を加えながらも変更を表示することができます。 Portfolio Grid 要素への変更を保存すると、フロントエンドで私のポートフォリオページがどのように表示されるかがわかります。

ステップ 7: ポートフォリオをカスタマイズする

ライブ WordPress カスタマイザーの設定を使用して、パンくずリスト、アーカイブレイアウト、単一投稿スタイル、画像のトリミングなどのオプションを設定できます。

管理者アイコン、投稿タイプ名、スラッグ、分類を変更する場合は、ポートフォリオ投稿タイプエディタを使用します。

ステップ 8: ポートフォリオをメニューに追加する

ポートフォリオウェブサイトでは、訪問者がすぐに「ポートフォリオ」にアクセスしてポートフォリオページを表示できるように、ポートフォリオページがメインメニューに表示されるのが理にかなっています。新しいポートフォリオページを追加するには、[外観] > [メニュー] に移動し、[ポートフォリオ] ページを選択して [メニューに追加] をクリックします。

これで、ポートフォリオは、ホームページ（およびメインメニューが有効になっている他のページ）上で簡単にアクセスできるメニュー項目として表示されます。

ポートフォリオページをホームページにしたい場合は、[設定] > [閲覧] に移動し、フロントページの表示を固定ページに設定して、ポートフォリオを選択します。簡単ピージー！

仕上げ

Web サイトのポートフォリオセクションを配置したら、Web サイトにさらにページを追加してみるとよいでしょう。非常に便利でポートフォリオウェブサイトに必要な部分である問い合わせページ、会社概要、またはサービスを検討してください。必要なだけページを作成し、本格的なポートフォリオウェブサイトを作成するには、重要なページをメニューに必ず含めてください。

ポートフォリオが完了したら、ポートフォリオへのトラフィックの生成、画像の最適化、さらにはウェブサイトの収益化に進むことができます。オンラインでポートフォリオを構築するためのその他のヒントはありますか?