月額5万円から始めるWebコンサルティング|Sense Literacy

WordPressテーマ「SANGO」を使ったウェブサイト制作のすすめ

このオウンドメディアでは、WordPressを使ったウェブサイトの構築・制作・運用方法を、レクチャー形式で連載しています。

前回のレクチャーまでで、ウェブサイトのレイアウトやプラグインの設定し、コンテンツを投稿する準備ができたので、今回は、具体的にテーマのインストールからカスタマイズまでどのような設定をおこなったか、実際に制作したウェブサイトを一例に解説していきます

リサ

細かいカスタマイズの方法を知りたい方必見です!

テーマのインストール

サーバーとドメインを用意し、WordPressを構築したらテーマをインストールしましょう。

テーマのインストール

サーバーとドメインの取得と設定 WordPressのインストールとテーマの設定

今回のレクチャーでは、有料テーマである「SANGO」をインストールし、映画の感想ブログである「Cinema Note」を制作しました。

Cinema Note

「SANGO」は親テーマと子テーマがあります。
通常は「SANGO」の子テーマを使用しますが、すでにカスタマイズされた、有料子テーマである「PORIPU」を使用しました。

「PORIPU」は「SANGO」公認の子テーマです。インストールすることで「SANGO」のビジュアルや機能のカスタマイズが実装できます。
有料子テーマということで、「PORIPU tears」が4,980円、「PORIPU 通常版」が3,980円ですが、カスタマイズにかかる手間や時間を短縮できるのはそれ以上の価値があります。

通常の手順で「SANGO」と「PORIPU」をインストールし、「PORIPU」を有効化しましょう。

リサ

ウェブサイトをつくることが目的ではなく、運営することが目的ですからね!
プログラミングの技術や知識がないので、カスタマイズは難しそう・・・それよりも早くウェブサイトを公開して運用していきたい、という方におすすめです。

Dr.TD

参考 SANGO | 心地良さを追求したWordPressテーマSANGO 参考 PORIPU-SANGO公認の子テーマ | Just another SANGO ThemePORIPU-SANGO公認の子テーマ

カラーの設定

テーマのインストールが完了したら、ウェブサイト全体のレイアウトを設定していきましょう。

ここからは、WordPressの管理画面のメニューにある「外観」で作業をおこなっていきます。

Dr.TD

カラーの設定

外観から「カスタマイズ」ボタンをクリックすると、ウェブサイトのカスタマイズ画面が表示されます。
ここではテーマとしてカスタマイズできる項目を設定できます。親テーマの「SANGO」のカスタマイズ設定に加えて、「PORIPU」のカスタマイズ設定をおこなえまます。
こちらのカスタマイズ設定は、初心者にもわかりやすく設定がおこなえるので活用していきましょう。

まずはカラーを設定します。「色」をクリックします。

カラーの設定

「色」をクリックすると、メインカラーやアクセントカラーなど、ウェブサイトで使用するカラーを設定することができます。

「色の選択」をクリックすると、カラーコードを入力するボックスが表示されますので、指定のカラーコードを入力しましょう
ウェブの世界には色々なカラーの指定方法がありますが、ここでは16進数で表記されるコードを使います。

カラーの設定

カラーコードを入力すると、このようにウェブサイトのトップページのカラーが変更されます。
「Cinema Note」では、以下のカラーコードを設定しました。

「Cinema Note」で設定したカラー
  • メインカラー:#46b8d1
  • 薄めの下地色:#85e3ec
  • アクセントカラー:#fbe54d
  • リンク色:#46b8d1
  • ヘッダー背景色:#fbe54d
  • ヘッダータイトル色:#FFF
  • ヘッダーメニュー文字色:#FFF
  • ウィジェットのタイトル色:#46b8d1
  • ウィジェットタイトルの背景色:#c8e4ff
  • フッターウィジェットの背景色:#e0e4eb
  • フッターウィジェットの文字色:#3c3c3c

ウェブサイトをはじめるために決めておきたい15のポイント:カラー

リサ

「Cinema Note」は、私の好きな黄色をアクセントカラーにして、メインカラーとサブカラーは、黄色の補色となる青系統や紫系統の色にしました。
カラーは、あまり使いすぎず、メインカラー、サブカラー、アクセントカラーの3種類くらいにしておくとバランスがいいですよ。ウェブサイトの配色の割合としては、それぞれ70%、20%、10%が目安となります。

Dr.TD

タイトル・ディスクリプションの設定

タイトルとディスクリプションは、カスタマイズ画面の「サイトの基本設定」内にある、「基本情報とロゴの設定」よりおこないます。

タイトル・ディスクリプションの設定

「サイトのタイトル」にはウェブサイトのタイトルである「Cinema Note」を入力しました。
「キャッチフレーズ」の文章は、ウェブサイトに反映されず、検索結果のタイトルの横に表示されます。
「Cinema Note」が、映画に関するウェブサイトだとユーザーに伝わるように、「映画の再発見。」をキャッチフレーズにしました。

続いて、ディスクリプションを「サイトの詳しい説明(100字以内推奨)」で設定します。
ディスクリプションは、キャッチフレーズ同様、ウェブサイト内ではなく検索結果に表示されます。

ディスクリプションを見て、ユーザーが「Cinema Note」では、どのようなコンテンツを発信しているのかわかるような文章を作成しました。

タイトル・ディスクリプションの設定

「タイトル」と「キャッチフレーズ」、「サイトの詳しい説明(100字以内推奨)」は検索結果にこのように表示されます。

タイトル・ディスクリプションの設定

実際に検索すると、このように表示されます。

ウェブサイトをはじめるために決めておきたい15のポイント:タイトルとディスクリプション

リサ

タイトルだけでなく、ディスクリプションの決定も大切なんですね。
ウェブサイトにおいて、タイトルは企業名やブランド名、ディスクリプションは、企業やブランドのキャッチコピーと同等の価値がありますので、慎重に決めましょう。

Dr.TD

ロゴの設定

タイトルとディスクリプションの設定が完了したら、ロゴを設定しましょう。

ロゴの設定

ロゴマークには、「シンボルマーク」「ロゴタイプ」の2種類があります。

シンボルマークは、企業やブランドのテーマやコンセプト、名前をイメージしてデザインされたイラストのことをいい、ロゴタイプは、企業名やブランド名をデザインした文字のことをいいます。
ロゴタイプとシンボルマークを組み合わせたものを、「ロゴマーク」といいます。

今回は、シンボルマークは自作し、ロゴタイプは自作はせずテキストを利用しました。
ロゴタイプは、テキストをそのまま利用してシンプルなデザインにするのもいいですし、ゼロからデザインしてオリジナリティのあるデザインにするのもいいでしょう。

リサ

「Cinema Note」のタイトルにちなんで、フィルムとノートをモチーフにデザインしました。
ロゴマークは、ウェブサイトのテーマやコンセプト、タイトル、ウェブサイトの配色を配慮しながら作成しましょう。
一緒に並べることも多いので、お互いに調和性のあるデザインを意識すると、よりユーザーに好印象です。

Dr.TD

ロゴが決まったら、実際にウェブサイトに反映させていきましょう。
カスタマイズ画面内の「サイトの基本設定」内にある、「基本情報とロゴの設定」をクリックします。

ロゴの設定

クリックすると、ウェブサイトのタイトルやロゴの設定がおこなえる画面が表示されます。
こちらは先ほど、タイトルやディスクリプションを設定したメニューですね。

ロゴタイプをウェブサイトに反映させる場合は、「ロゴ画像を登録」をクリックし、アップロードした画像を選択します。
アップロードが完了すると、ウェブページの左上にロゴタイプが表示されるようになります。

リサ

「Cinema Note」のロゴタイプはテキストなので、アップロードしていません。

シンボルマークをウェブサイトに反映させる場合は、「サイトアイコン」をクリックし、アップロードした画像を選択します。
ブラウザのタブやブックマークバーにシンボルマークが表示されるようになります。推奨されたサイズでのアップロードをしましょう。

ウェブサイトをはじめるために決めておきたい15のポイント:ロゴマーク(アイコン)

レイアウトの設定

ウェブサイトのレイアウトの重要性と設定方法

ロゴ、カラーの設定が完了したら、ウェブサイトのレイアウトを設定しましょう。

レイアウトの設定は、ウェブサイト制作の中でも重要なポイントです。
適切なレイアウトを設定することで、ウェブサイトを訪れたユーザーに、コンテンツを正しく伝えることができます。

コンテンツを正しくユーザーに伝えるレイアウトは、継続的にウェブサイトを訪れてくれるファンを獲得することにもつながりますので、ていねいに設定していきましょう。

ヘッダー

ヘッダーは、メニューを配置するレイアウトが主流です。
「Cinema Note」でも、ヘッダーにはメニューを配置しました。

テーマによっては、バナーを表示できたり、ウィジェットエリアになっているものもあります。

Dr.TD

ヘッダー

ヘッダーの設定は、管理画面のメニューにある「外観」内の「メニュー」からおこないます。
ヘッダーメニューは、プロフィール、映画のジャンル、年代、評価、まとめ記事と、固定ページ、カテゴリー、タグを網羅したメニューを表示させました

編集するメニューは、ヘッダーなら「header-menu」、フッターなら「footer-menu」と、わかりやすい名前にしておくと、管理しやすくなります。

Dr.TD

ヘッダー

ウェブサイトのレイアウトの重要性と設定方法:ヘッダー

メニューの項目を入れ子にし、副項目することで、メニューのタイトルにカーソルをおくと、プルダウンして詳細が表示されるように設定しました。

Dr.TD

リサ

カテゴリーやタグが多い場合、副項目を使用すると、メニューの表示をすっきりさせられます。

サイドバー

サイドバー

「SANGO」のトップページのサイドバーは、2カラムで固定されています。(ただし、下層ページは1カラムに設定可能。)
サイドバーそのものを左側に移動させたり、非表示にすることはできませんが、サイドバーに表示される項目を変更することはできます

また、サイドバーはトップページだけでなく、下層ページにも表示されます。
下層ページでは、トップページのサイドバーに加えて、「追尾サイドバー」というパーツが表示されます。
追尾サイドバーはスクロールしても、常にサイドバー部分に表示されるレイアウトのパーツです。

サイドバーと追尾サイドバーに表示される要素は、管理画面のメニューにある「外観」内の「ウィジェット」で設定ができます。

サイドバー

「Cinema Note」のトップページのサイドバーには、検索、プロフィール、メニュー、今日の人気記事一覧を表示させています。
加えて、下層ページのサイドバーにはカテゴリー別の人気記事一覧、追尾サイドバーには目次を表示させています。

ウィジェットにはさまざまな種類があります。
「検索」や「ナビゲーションメニュー」は基本要素としてWordPressに備わっています。

サイドバー

サイドバーのプロフィールですが、「カスタムHTML」というウィジェットを使用することで設定できます。
HTMLを表示できるウィジェットになります。プロフィールを表示させるためのHTMLを作成するのは面倒ですが、幸いなことに「SANGO」のカスタマイズガイドに参考コードがありました。

HTML
<div class="yourprofile">
<p class="profile-background"><img src="★背景画像のURL★"></p>
<p class="profile-img"><img src="★プロフィール画像のURL★" width="80" height="80"></p>
<p class="yourname dfont">★名前★</p>
</div>
<div class="profile-content">
<p>★プロフィール文★</p>
</div>
<ul class="profile-sns dfont">
<li><a href="★twitterのURL★"  target="_blank" rel="nofollow" ><i class="fab fa-twitter"></i></a></li>
<li><a href="★facebookのURL★" target="_blank" rel="nofollow"><i class="fab fa-facebook"></i></a></li>
<li><a href="★instagramのURL★" target="_blank" rel="nofollow"><i class="fab fa-instagram" ></i></a></li>
<li><a href="★feedlyのURL★"  target="_blank" rel="nofollow"><i class="fa fa-rss"></i></a></li>
<li><a href="★LINEのURL★" target="_blank"><i class="fab fa-line"></i></a></li>
</ul>
参考 サイドバーや記事下にプロフィール(この記事を書いた人)を設置する | SANGOカスタマイズガイドSANGOカスタマイズガイド

HTMLコードをコピーして、★の部分を書き換えてペーストするだけで、プロフィールをサイドバーに表示することができます。

人気記事一覧ですが、「WordPress Popular Posts」というプラグインを使用して表示しています。
インストールすると、ウィジェットに表示されるので、設定しましょう。

サイドバー

「WordPress Popular Posts」を設定しました。
複数の設定項目があり、あらゆるカスタマイズが可能です。
画像と同じように設定していけば、「SANGO」のデザインにマッチして表示されます。

タイトルの前/後(HTML)
<h4 class="widgettitle dfont"><i class="fa fa-line-chart"></i> / </h4>
投稿の前/後(HTML)
<ul class="my-widget show_num"> / </ul>
投稿の HTML マークアップ
<li><a href="{url}"> <figure class="my-widget__img">{thumb_img}</figure><div class="my-widget__text">{text_title} <span class="dfont views"> {stats}</span></div></a></li>

「HTML マークアップ設定」でHTMLを入力する必要があるので、コピー&ペーストして使ってください。

サイドバー

下層ページには、カテゴリー別の人気記事一覧も表示させました。
これは、ゼロからカスタマイズすると初心者にはすごく大変なのですが、「PORIPU」をインストールすることによって、ウィジェットにかんたんに表示させることができます

サイドバーはトップページも共通のパーツになりますので、トップページでは表示させないための設定が必要になります。
「Widget Options」というプラグインをインストールすることで、ウィジェットの表示に関して細かく設定が行えるようになります。今回はブログページのみ表示するように設定しました。

サイドバー

「追尾サイドバー(PCのみ)」には目次を表示させるために、「Table of Contents Plus」というプラグインをインストールします。
「Table of Contents Plus」をインストールすると「TOC+」というウィジェットが表示されるので、設定しましょう。

ウェブサイトのレイアウトの重要性と設定方法:サイドバー

サイドバーのカスタマイズは自由度が高いので、いろいろ試してみましょう。

Dr.TD

コンテンツ(一覧)

コンテンツ(一覧)

コンテンツの表示は、カスタマイズ画面内の「デザイン・レイアウト設定」内の「記事一覧レイアウト」から設定します。

デフォルトでは、画像のように、投稿したコンテンツがカード形式に一覧で表示される設定になっています。
「SANGO」ではこの他に、表示されるカードを横長にすることができます

コンテンツ(一覧)

「記事一覧レイアウト」をクリックすると、コンテンツの表示方法が設定できます。
「【PC】トップページの記事一覧カードを横長にする」にチェックを入れると、画像のように一覧で表示されるカードが横長になります。

リサ

「Cinema Note」では、デフォルトの表示で設定しました。

コンテンツ(一覧)

スマートフォンでのコンテンツの表示は、PCと同じくカード形式で表示されます。

コンテンツ(一覧)

スマートフォンで同様の設定をする場合は、下にある「【モバイル】トップページの記事一覧カードを横長にする」にチェックを入れましょう

カスタマイズ画面の左下にあるデバイスのアイコンをクリックすると、PCのディスプレイでタブレットやスマートフォンでの表示を確認することができます。

Dr.TD

コンテンツ(一覧)

「PORIPU」の機能として、コンテンツを表示するカードの右下にSNSでのシェア数を表示させることができます。
シェア数の表示は合わせて「SNS Count Cache」というプラグインをインストールする必要があります。

表示させるには、カスタマイズ画面の「PORIPUの設定」にある、「PORIPU:ページ設定」をクリックし、「SNSカウントを記事一覧に表示する」にチェックを入れます

リサ

シェア数が確認できると、コンテンツに対してどのくらい反応があったのかわかるので、その後のコンテンツ制作の参考になりますよね!

コンテンツ(一覧)

カスタマイズ画面の「ヘッダーお知らせ欄」では、ヘッダーの下の部分にお知らせを表示させることができます。
常にトップページに表示されるので、キャンペーンやイベントの開催など、ユーザーに注目してほしい情報を発信しましょう。

「Cinema Note」では、常時開催しているムビチケのプレゼントキャンペーンについて入力しました。
ヘッダーお知らせ欄にはURLを貼りつけることもできるので、入力した文章に関連するページがある場合はURLを入力しておきましょう。

背景色や文字色も設定ができます。背景色は2色設定することで、グラデーションにすることができます。
ヘッダーがアクセントカラーなので、メインカラーとサブカラーを参考にカラーの設定をしました。

コンテンツ(一覧)

「ヘッダーお知らせ欄」の下には、「記事一覧タブ」を4つまで表示させることができます
カスタマイズ画面の「記事一覧タプ切替機能(トップページ)」から設定をおこないます。

「記事一覧タブ」はタブを作成し、「トップページの記事一覧でタブ切り替えを有効にする」にチェックを入れると、表示されるようになります。

1番目のタブには、新着記事一覧が表示される設定になっているので、残りの3つのタブに「私のオススメ映画」、「五つ星映画」、「まとめ」を作成しました。
タイトルを作成し、表示させしたいカテゴリー、もしくはタグを指定します。

「記事一覧タブ」はタブを作成し、「トップページの記事一覧でタブ切り替えを有効にする」にチェックを入れると、表示されるようになります。

1番目のタブには、新着記事一覧が表示される設定になっているので、残りの3つのタブに「私のオススメ映画」、「五つ星映画」、「まとめ」を作成しました。
タイトルを作成し、表示させしたいカテゴリー、もしくはタグを指定します。

タブは、2つ、もしくは4つの偶数になるように作成しましょう。

Dr.TD

「記事一覧タブ」は、カラーの設定もできます。
タブの背景色、文字色、選択中のタブの背景色が設定できますので、ウェブサイトのカラーを意識して設定しましょう。

選択中のタブの背景色は2色設定することで、グラデーションにすることができます。
「ヘッダーお知らせ欄」と同様に、メインカラーとサブカラーを参考にグラデーションを設定しました。

コンテンツ(一覧)

コンテンツの下部には、「トップに戻るボタン」を表示させました。このボタンをクリックすると、ページのトップへと画面が移動します。
スクロールしてページトップに戻る手間が省けるので、レビューや感想、旅行記など、文章量が多いコンテンツを投稿する場合、表示させておくと便利です。

ボタンの表示は、カスタマイズ画面の「SANGOオリジナル機能の管理」内の「トップへ戻るボタン」から設定できます。
PCとモバイル用の設定があり、それぞれ「トップへ戻るボタンを表示する」をチェックすると、ボタンが表示されるようになります。

色の設定もおこなえます。ヘッダーとフッターと同様のカラーにすると、統一感が出るのでおすすめですよ。

ウェブサイトのレイアウトの重要性と設定方法:コンテンツ(一覧)

リサ

「Cinema Note」のように、カテゴリーやタグが多い場合は、「記事一覧タブ」が便利ですね!

コンテンツ(投稿)

続いて、投稿されたコンテンツページのレイアウトの設定を見ていきましょう。

コンテンツ(投稿)

コンテンツページのレイアウトの多くは、カスタマイズ画面の「SANGOオリジナル機能の管理」から設定をおこないます。
SNSのシェアボタンや関連記事、おすすめ記事の表示の設定や変更ができます。

コンテンツ(投稿)

タイトルの下には、SNSのシェアボタンを表示することができます。
通常のシェアボタンは、「Twitter」、「Facebook」、「はてなブックマーク」、「Google+」、「Pocket」、「LINE」の6つのSNSへのシェアボタンが表示されます。

シェアアイコンは、「タイトル下にシェアボタンを並べて表示」をチェックすることで表示されます。

コンテンツ(投稿)

「Cinema Note」ではタイトル下に通常のシェアボタンが表示されるように設定しましたが、「Lipple inc.」では、タイトル下のシェアボタンを非表示にして、アイキャッチと円形シェアボタンを表示させるように設定しています

コンテンツ(投稿)

「記事タイトル下の円形シェアボタンにテキストを含め、横長ボタン化する」のみにチェックを入れると、「SHARE」の文字が入ったボタンが表示されます。

コンテンツ(投稿)

「シェアボタンを別デザインにする」にチェックを入れると、画像のように通常のシェアボタンのデザインと異なり、グレーの背景の上に小さいサイズのシェアボタンが表示されるようになります。

「Cinema Note」では、通常のデザインの方がコンテンツページに馴染んでいるため、通常のデザインのままにしました。

シェアボタンと円形シェアボタンは、どちらもSNSでの拡散を目的とした機能なので、どちらか片方だけを表示させればOKです。

Dr.TD

コンテンツ(投稿)
コンテンツ下にあるシェアボタンの下に、「フォローボックス」を表示させることができます。
フォローボックスは、アイキャッチ画像の下に自分が持っているSNSのアカウントを表示できるカスタマイズ機能です。

表示できるSNSのアカウントは、「Twitter」、「Facebook」、「Feedly」、「Instagram」の4つです。
「Cinema Note」はInstagramのアカウントがないので、それ以外の3つのアカウントを表示させるように設定しました。

ボックスの上部に「Follow Me!」と書かれていますが、この文字は変更することができます
空欄でもいいですし、目を引くようなキャッチーなキーワードを入れるのもいいでしょう。

コンテンツ(投稿)

コンテンツの下には、「関連記事」を表示することができます。
関連記事を表示させることで、他のコンテンツを読んでもらう機会が増え、ウェブサイトの滞在時間や回遊率アップにつなげることができます。

関連記事には「タイプA」、「タイプB」、「タイプC」の3種類があります。
カスタマイズ画面で反映させながら、自分のウェブサイトのデザインに合うタイプを選びましょう。

「Cinema Note」は関連記事広告と差別化するために、立体感のあるデザインの「タイプB」を選びました。

コンテンツ(投稿)

関連記事の下には、「プロフィールボックス」が表示されています。
これは、管理画面の「ユーザー」内にある「あなたのプロフィール」で設定することができます。

コンテンツ(投稿)

「あなたのプロフィール」でサイト、肩書き、各SNSのURL、プロフィール情報、プロフィール写真を入力すると、自動的にコンテンツページの関連記事の下に表示されるようになります。
どんな人がコンテンツを作成しているのか、ユーザーに対してだけでなくGoogleへの信頼性を上げるためにもプロフィールの作成はおすすめです。

リサ

これで、コンテンツを投稿する準備が整いましたね!
広告やHTMLタグなどの説明は、今後詳しくレクチャーしていきます。

Dr.TD

フッター

フッター

フッターには、最下部のメニューに固定ページの「PRIVACY POLICY」、「CONTACT ME」、「SITE MAP」を、その上の「フッターウィジェット」エリアに、サイドバーと同じような要素を配置しました。

フッター

最下部のメニューは、管理画面の「外観」内にある「メニュー」で設定をおこないます。
フッターメニューを新規作成し、固定ページの「PRIVACY POLICY」、「CONTACT ME」、「SITE MAP」を追加しました。

フッター

続いて、管理画面の「外観」内にある「ウィジェット」でサイドバーと同じ要素をフッターにも設定します。
「フッターウィジェット左」には人気記事一覧、「フッターウィジェット中」には最近の投稿記事一覧、「フッターウィジェット右」には検索、カテゴリー、タグクラウドを配置しました。

リサ

タグクラウドは、タグが雲のようなデザインで表示されるウィジェットですが、「Cinema Note」はタグが膨大なので、カテゴリーを表示しています。

フッター

最下部のメニューに、タイトルの「Cinema Note」とキャッチコピーの「映画を再発見。」が表示されていますが、これは子テーマの「PORIPU」のカスタマイズで設定することができます。

カスタマイズ画面の「PORIPUの設定」内にある「PORIPU:ページ設定」クリックすると、「フッターにロゴを表示する」という項目があるので、チェックを入れます。
そうすると、フッターのメニューの上に、ロゴとキャチフレーズが表示されるようになります。

フッター

「フッターにロゴを表示する」にチェックを入れない場合、メニューの上に「HOME」と表示されるようになります。

ウェブサイトのレイアウトの重要性と設定方法:フッター

リサ

これで、レイアウトのカスタマイズはほぼ完成ですね!
あとはプラグインの設定をおこないましょう!

Dr.TD

プラグインの設定

WordPressのおすすめプラグイン20選と設定方法

WordPressに機能を追加したり、拡張するための外部ツールを「プラグイン」と呼びます。

WordPressは、多くの人が柔軟に活用するために、WordPressのシステムそのものはシンプルに設計されています。
そのため、ウェブサイトに実装したい機能やデザインをWordPressにカスタマイズするには、プラグインをインストールする必要があります。

プラグインの追加や設定は、管理画面のメニュー内の「プラグイン」よりおこないます。

「Cinema Note」でインストールしたプラグインは、こちらになります。

「Cinema Note」でインストールしたプラグイン
  • AddQuicktag
  • Akismet Anti-Spam
  • All in One SEO Pack
  • Broken Link Checker
  • Classic Editor
  • Contact Form 7
  • Google XML Sitemaps
  • Jetpack by WordPress.com
  • Search Regex
  • SNS Count Cache
  • WordPress Popular Posts
  • WP Fastest Cache
  • WP Maintenance Mode

インストールしたプラグインは、コンテンツ制作で役立つプラグインから、運用面で役立つプラグインまでさまざまあります

リサ

プラグインはたくさんあるんですね。
そうなんです。プラグインはたくさん種類がありますが、インストールしすぎると、ウェブサイトが重くなったり、管理が大変になったりと、かえってマイナスになることもあるので、必要なプラグインを、最小限選ぶようにしましょう

Dr.TD

まとめ

まとめ

カラーやウィジェットなどのレイアウトからプラグインまで、細かい設定を完了させたウェブサイトがこちらになります。
WordPressのテーマを利用すると、初心者でもこれだけ本格的なウェブサイトを制作することができますよ。

今回紹介したカスタマイズの他にも、HTMLやCSSを使った細かいカスタマイズをおこなっていますが、基本的にはカスタマイズ画面とプラグインとウィジェットを使うだけでウェブサイトを自分好みにカスタマイズすることができます

ウェブサイトがほとんどできあがったので、次のステップとして、コンテンツを作成し、ウェブサイトをより充実させていきましょう
次回は、WordPressでのコンテンツの投稿の方法をレクチャーしたいと思います。

リサ

ようやくウェブサイトが完了しました〜!嬉しいですね!
お疲れ様です!しかし、ウェブサイトは制作したら終わりではありませんよ!
次はコンテンツの投稿の方法をレクチャーしますね。

Dr.TD

リサ

ここからがスタートですね!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です