書籍「サクッと学べるデザイン心理法則108」発売中

WordPressでゼロからWEBサイトを作成する手順を徹底解説【初心者でも簡単】

景品表示法に基づく表記:当サイトは広告を使用しています。
ゼロから始めるWordPressサイト制作 作り方を徹底解説

WordPressでWebサイトを作りたいけど、何をすればいいかわからない…

そんな方向けにWordPressでゼロからサイトを作るまでの手順をわかりやすく解説します

本記事で実際にゼロから作成するサイトはこちら。

MONO ROOM
https://mono-room.com

  • WordPressがはじめての人でも大丈夫
  • WordPressサイト公開まで最短5分
  • プログラミングができなくても余裕
  • SSL化とかネームサーバー設定とかも自動
  • デザイン方法まで画像つきで超詳しく解説

WordPressの立ち上げは慣れればすぐに完了しますが、はじめて行う場合は時間がかかります。

すべて網羅的に解説しますので本記事をブックマークして手順通りにゆっくり進めていってください。

目次

WordPressでWebサイトを作成する超効率的な方法

WordPressでWebサイトを制作する超効率的な方法

今回紹介する方法は初心者から上級者まで便利に使える超時短WordPress立ち上げ方法を解説します。

本記事で解説する方法は完全にゼロから制作するためドメインもサーバーも未取得の状態からの方法になります。

WordPressでWebサイト制作の流れ

今回解説する方法の全体の流れは以下のとおりです。

  1. ドメインとサーバーを同時に取得する
  2. WordPressかんたんセットアップでインストール
  3. WordPressの初期設定を行う
  4. 必須となるSEO関連設定を行う
  5. サイトのデザインをノーコードで作成

非常にシンプルな方法なので、初心者でもかんたんに作成することができるでしょう。

具体的な手順は画像つきで詳しく解説します。

最強に便利な『WordPressかんたんセットアップ』

今まではFTPソフトを使ってサーバーにアップロードして、ドメイン設定を行う方法が一般的でしたが、今は誰でも簡単にWordPressがインストールできるようになりました

FTPとかドメイン設定とかよくわからないっていう人でも、まったく心配いりません

WordPressかんたんセットアップを使えば複雑なアップロード作業やサーバー設定は不要。

スマホにアプリをインストールする感じでサクッとWordPressをインストールし、公開することができます。

WordPressかんたんセットアップはサーバー会社が提供している、必要な情報を少し入力するだけでインストールが完了する超便利機能のことです。

WordPressサイトを作るのに必要なものと費用は?

必要となるものは以下の3つだけ!

WordPressサイトを作るのに必要なものと費用は?
  • パソコン(スマホでもできるけどPC推奨)
  • サーバー&ドメイン(月額800円程度)
  • WordPressテーマ(0円~17,000円程度)

本記事で解説する方法ではプログラムを入力したり、特殊なソフトを使ってアップロードするわけじゃないのでブラウザさえ使えればWordPressのインストールが可能です。パソコンのスペックは低くても問題がありません。

費用がかかるのは以下の3つだけ。

ドメインWebサイトのURL
サーバーWebサイトのデータを置いておく場所
テーマWordPressのデザインテンプレート
  • 初期費用:1,000〜20,000円
  • 維持費:775円(月)

レンタルサーバーを契約するとドメインが無料でもらえるので、維持費がかかるのはサーバー代だけ。

テーマは無料のものでもWebサイトは作れますが、一度購入しておけば複数のサイトに使えるし、アップデートも無料。さらに顧客に納品するサイト用にも使えます。

推奨テーマはすべての条件をクリアしたGPL100%で人気の高いSWELL一択。

現在ご覧いただいている当サイトもSWELLで作成しています。

SWELLは最新のWordPressのバージョンにもいち早くアップデート対応されるので企業サイトにも多く使用されています。

WordPressを使ったWebサイトの作り方

WordPressを使ったWebサイトの作り方

WordPressを作ってWebサイトを作る手順を順番に解説していきます。

  • ドメイン&サーバーの契約方法
  • WordPressのインストール方法
  • WordPressの管理画面へのログイン方法

このステップではWordPressの導入を行います。

ドメインとサーバーを取得する

サーバー、ドメイン、WordPressのインストールがワンクリックでまとめて完了するConoHa WINGのレンタルサーバーを使用していきます。

今回は私が一番良いと思っているGMOのConoHa WINGで解説しますが、サーバーは以下の条件に当てはまっていればどこを選んでもOK

サーバーはどうやって選ぶべき?

  • 管理画面が使いやすい
  • サーバーの速度が早い
  • かんたんインストールができる
  • 運営企業が信頼できる大企業である
  • 利用者が多い(グーグル検索だけで解決しやすい)
STEP
ConoHa WINGのサイトにアクセス
ConoH WING TOPページ

ConoH WINGのサイトにアクセスしたら申し込みボタンからアカウントを作成していきます。

STEP
アカウントを作成する
会員登録画面解説

はじめてご利用の方の欄にメールアドレスとパスワードを入力します。

パスワードはサーバーのログイン時に使用するものなので忘れないようにしましょう。

STEP
契約期間とプランを選択する
Conohaプラン

契約期間が増えれば増えるほどお得になります。長く保持する予定なら36ヶ月にしておきましょう!

プランは以下の3つがありますが、機能に不足は無いので一番安いベーシックでOK

プランSSD容量転送量(月)
ベーシック300GB27TB
スタンダード400GB36TB
プレミアム500GB45TB

プランはあとから変更することができるので容量が足りなくなったら拡張すればOK!

STEP
初期ドメインとサーバー名を選択

ここの初期ドメインとサーバー名は重要ではないので適当にわかりやすい名前を英数字で入力しておきましょう。

サイトのURLになるドメインは下にある「WordPressかんたんセットアップ」で設定します。

WordPressのかんたんインストール設定

STEP
セットアップの利用設定
かんたんセットアップ1

かんたんセットアップを【利用する】を選択し、セットアップ方法は【新規インストール】を選びます。

STEP
独自ドメイン設定

自分のサイトのURLになるドメインを決めます。

希望するドメインを入力したら【検索】を押して取得できるかチェックしてみましょう。

ドメインはすでに誰かが取得しているものは選べません。

STEP
サイト名とログイン情報を設定する
ログイン情報の入力画面「WordPressユーザー名」と「Wrodpressパスワード」

作成サイト名とWordPressのログイン時に使用するIDとパスワードを設定します。

しっかりメモしておきましょう。

ちなみにサイト名、ユーザー名、パスワードはあとから変更することも可能です

STEP
WordPressデフォルトテーマを選択
WordPressテーマ選択画面

かんたんセットアップでもテーマを選択できますが、ここでは無料のCocoonを選択しておきます。

一番人気のSWELLは購入できないのでここでは購入せずに後ほどテーマ適用を行います。

サーバーの契約を完了させる

残りは基本的な情報を入力して完了です。複雑な工程はありません。

STEP
申込者情報を入力

サーバー管理者の名前や連絡先情報を入力します。

STEP
SMSで本人認証

認証画面が表示されるので、電話番号を入力してSMSに届いた4桁の番号を入力して本人確認を行います。

STEP
支払情報を入力

最後に支払情報を入力したら完了です。

支払い方法は以下の6種類から選択可能。

  • クレジットカード
  • Amazon Pay
  • 銀行振込(ペイジー)
  • コンビニ支払い
  • PayPal
  • Alipay

支払い完了と同時にWordPressがインストールされ、データベース情報が表示されます。
データベース情報はWordPressの引っ越しの際などに必要になるのでメモして保管しておきましょう。

WordPressの管理画面にログインする

WordPressの管理画面にログインする

支払いが完了したらConoHaサーバーの管理画面に切り替わるので、以下の手順でWordPressにログインしてみましょう。

  1. サイト管理
  2. サイト設定
  3. 管理画面URLをクリック
  4. WordPressのIDとPassWordを入力
ログイン画面
WordPressのログイン画面

WordPressのログイン画面が開くので、登録時に入力したユーザー名とパスワードを入力します。

ここで入力するのはWordPressかんたんセットアップ時に入力したものです。

WordPressのIDとPass確認
上図の部分に入力したIDとPassWord
WordPress管理画面 ダッシュボード

ログインに成功すると上図のような管理画面が表示されます。

今後、WordPressの設定の変更はこの管理画面から行うことになるのでブックマークに保存しておきましょう。

Cocoon

管理画面左上にあるホームアイコンをクリックするとWebサイトが表示されます。

まだコンテンツも何もない状態ですが、自分が作成したドメインにちゃんとサイトが表示されました。

以上でWordPressのインストールが完了です。

WordPressの初期設定とテーマの適用

WordPressの初期設定とテーマの適用

WordPressのインストール後は管理画面から初期設定を行っていきます。

  1. WordPressの基本設定
  2. デザインテーマの適用

サイトの基本設定

設定項目はそこまで多くありませんが、必要箇所が何点かあるので解説します。

STEP
設定→一般
設定画面

設定タブの【一般】を選ぶとサイトの基本情報の編集が可能になります。

サイトのタイトルはすでに入力済みなので、その下にあるキャッチフレーズにサイトの概要などを入れておきましょう。

変更した場合は下部にある【変更を保存】を押しておきます。

STEP
パーマリンク設定
パーマリンク設定

設定の中の【パーマリンク】を開き、共通設定を【投稿名】に変更しておきましょう。

【投稿名】にチェックを入れたら下部にある【変更を保存】を押して完了。

STEP
カテゴリ設定
カテゴリ設定

次は投稿の中にある【カテゴリ】を選択します。

最初はカテゴリがUncategorizedしかないので、追加していきます。

  • カテゴリ名(日本語OK)
  • スラッグ(URLになるので英数字)
  • 親カテゴリ(階層下する場合だけ)
  • 説明(カテゴリの簡単な説明)

【新規カテゴリーを追加】押して完了です。

親カテゴリーを選択してから新規作成すると子カテゴリとなり、カテゴリの中にカテゴリを作ることもできます。

子カテゴリ
STEP
Uncategorizedを削除する
投稿カテゴリの初期設定
Uncategorizedカテゴリ削除の方法
カテゴリ設定で削除可能になる

カテゴリを1つでも追加すればUncategorizedを削除することが可能になります。

設定から【投稿設定】を選び投稿用カテゴリーの初期設定を変更して変更を保存しておきます。

これで今まで消せなかったUncategorizedが削除できるようになります。

Uncategorizedを削除せずに別の名前に変更して使っても問題ありません

テーマを適用する

WordPressのテーマインストールはZIPファイルをアップロードして適用します。

もしまだテーマを所有していない場合はSWELLの公式サイトから購入しておきましょう。

SWELLの価格は17,600円なので若干高いかなと思うかもしれませんが、100%GPLテーマなのでライセンス制限がなく一度購入してしまえば複数サイトで自由に使うことができるのでコスパ最強!

\アップデートも無料/

STEP
SWELLのテーマファイルをダウンロードする
SWELLテーマのダウンロード

SWELL購入後にダウンロード先のURLが届きますのでそこからテーマファイルをダウンロードしましょう。

購入者専用ページにある以下の2つをダウンロードしてください。

  • SWELL(最新版)
  • SWELL子テーマ
STEP
管理画面からテーマを追加する
テーマの追加方法

外観のテーマを選択し【新しいテーマを追加】を選択。

先程ダウンロードしたSWELLのテーマファイルを2つともアップロードします。

STEP
子テーマを適用する
子テーマの有効化

アップロードが完了したら、子テーマの方を有効化してください。

子テーマを有効化して使うことでアップデート時にもカスタマイズが引き継がれるので安心してアップデートすることができます。

STEP
テーマ適用の完了
SWELL適用後画面
SWELL

テーマを適用したらサイトを表示して確認してみましょう。

SWELLを適用して何もデザイン変更していませんがかなりいい感じになっていますね。

これでデザインの変更もノーコードで簡単にできるようになりました。

WordPressサイトのSEO関連設定

WordPressサイトのSEO関連設定

SEOやサイト運営に欠かせない設定を行います。

以前はタグを追加したりと初心者には難しい作業が必要でしたが、現在は難しいことをしなくても簡単にSEO関係の設定を行うことができます。

SSL化は自動で行われる

ConoHa WINGのかんたんセットアップを使ってインストールしたWordPressサイトは自動でSSL化されます。

インストール直後はSSL化されていませんが、30分〜1時間ほどで完了するので気にせず待っていましょう。

SSL化とは?
SSL(Secure Sockets Layer)はデータの通信を暗号化して送受信させる仕組みです。
要は暗号化して安全な通信を確保したサイトになっているってことですね。
面倒かつ有料が多かったSSL化が無料かつ自動でできるのは非常に画期的!

All in One SEO Packは使わずSEO SIMPLE PACKを使う

SEO関連の登録がまとめてできるプラグイン『All in One SEO Pack』は有名ですが使用はおすすめしません。

最新の有料テーマはすべてSEOに最適化されているので、あまりに多くの機能が重複し、速度が遅くなってしまうためです。

余計な機能を付与せず、速度が早い『SEO SIMPLE PACK』を利用しましょう。

STEP
SEO SIMPLE PACKのインストール
SEO SIMPLE PACKのダウンロード

【プラグイン】から【新規追加】を選択し、キーワード検索でSEO SIMPLE PACKを探して【今すぐインストール】を選択しましょう。

STEP
プラグインを有効化
SEO SIMPLE PACK

SEO SIMPLE PACKをインストールしたら右上のボタンから有効化を押せばインストール完了です。

STEP
サイトの基本設定
SEO SIMPLE PACK設定

最初にSEO SIMPLE PACKの基本設定だけ行っておきます。

左メニューに【SEO PACK】が追加されているので設定メニューを開いて一般設定を行います。

入力する項目は以下の2つ

  • トップページのディスクリプション
  • トップページのキーワード

必須設定ではありませんが、制作するサイトのコンテンツが明確である場合は設定しておきましょう。

ディスクリプションにはサイトの説明を、キーワードはサイトに関連するキーワードをカンマ区切りで入力して完了です。

Google Search Consoleの登録方法

Google Search Consoleはユーザーがどのようなキーワードで検索しているか確認できる必須のSEOツールです。

Google Search Consoleは無料で使うことができます。

STEP
Google Search Consoleにアクセス

Google Search Consoleにアクセスして、Googleアカウントでログインしましょう。

Googleアカウントがない場合はそのまま新規作成してください。

アカウント登録もSearch Consoleの利用も無料です。

STEP
プロパティタイプはURLプレフィックスを選択
サーチコンソール URLプレフィックス

Search Consoleのようこそ画面では右側にある『URLプレフィックス』を選択します。

URL入力欄があるので、そこに自分のサイトURLをコピーして貼り付け、続行を押してください。

STEP
HTMLタグで確認する
HTMLタグの登録

所有権の確認方法がいくつもありますが【その他の確認方法】の中にある【HTMLタグ】を選択してください。

メタタグ情報が開くので【コピー】を選択してコードをコピーします。

この段階ではまだ確認ボタンは押さずに、この画面を開いたままにしておいてください。

STEP
WordPressのSEO SIMPLE PACKに戻る
認証コードの登録先

再びWordPressの管理画面に戻り、SEO SIMPLEの設定画面を開きます。

【ウェブマスターツール】を選択し、Googleサーチコンソールの認証コード欄に先程コピーしたHTMLタグを貼り付けます。

この際、<meta name=~~~>というコードも一緒に貼り付けられますが、使用するのは入力コードの部分だけです。

認証コード入力方法

余計な部分を削除したら下にある【変更を保存する】を押して完了です。

STEP
サーチコンソールで所有者を確認

HTMLタグをコピーしたページに戻り、確認を押して認証。

認証コードをサーチコンソールに登録
所有権の確認完了画面

認証が完了すると、プロパティに移動できるようになります。

サーチコンソールのデータは運営を続けていくと少しずつ溜まっていくので後日確認してみてください。

Google Analyticsの登録方法

Google Analyticsはアクセス数をチェックする際に使う無料のアクセス解析ツールです。

STEP
Google Analyticsにアクセスする
アナリティクスの登録

GoogleAnalyticsにアクセスし【測定を開始】をクリックして登録画面に移行しましょう。

STEP
アカウント名を入力
アナリティクスの登録

アカントの詳細に任意のアカウント名を入力します。

アカウント名を入力したら【次へ】を押して次へ進みます。

STEP
プロパティ名を入力
アナリティクスのプロパティの設定

任意のプロパティ名を入力して次へ進みます。

ついでにタイムゾーンや通貨はあとから変更できますが、日本に変更しておきましょう。

STEP
ビジネス情報の入力
アナリティクス利用規約

ビジネス情報を入力し、規約に同意をします。

STEP
データストリーム設定を行う
データストリーム設定

プラットフォーム選択では【ウェブ】を選択します。

ウェブストリームの設定

ウェブサイトのURLと、ストリーム名を入力して【ストリームを作成】をクリック。

STEP
測定IDをコピー
測定IDをコピー

作成されたウェブストリームの詳細が表示されるので、右上にある【測定ID】をコピーします。

STEP
SEO SIMPLE PACKのアナリティクス設定
SEO SIMPLE PACKの設定画面

WordPressのSEO SIMPLE PACKの設定に戻り、Googleアナリティクスタブにある【測定ID】欄にコピーしたIDを貼り付けます。

設定を保存をクリックしたらGoogle Analyticsの設定は完了です。

これでAnalyticsでアクセスが測定されるようになりました。

XMLサイトマップ設定

XMLサイトマップ設定を行います。

STEP
プラグインをダウンロードして追加する

XML Sitemapsを作成するプラグインを以下のサイトからダウンロードします。

本プラグインも無料で使用することができます。

以前は「Google XML Sitemap」が主流でしたが、現在は上記の「XML Sitemap & Google News」がおすすめです。

STEP
プラグインを追加して有効化する
プラグインのアップロード

WordPressに戻りプラグイン設定から【プラグインのアップロード】を選択し、先ほどダウンロードしたZIPファイルをインストールしましょう。

インストールが完了したら【有効化】を押して完了です。

WordPressでトップページデザインをノーコードで作る方法

本記事ではブログ型ではなく、サイト型で制作していきます。

ブログ型であれば特別デザイン変更しなくてもほぼ完成にできますが、今回はサイト型なのでトップページを完全オリジナルで作成する設定に変更して作業していきます。

SWELLのカスタマイズ機能でトップページを編集する

サイトのタイトルやメインビジュアルはSWELLのカスタマイズ機能を使うと簡単に作ることができます。

あらゆるサイトで使うであろうカスタマイズの方法を解説します

カスタマイズ方法

最初にWordPressの管理バーの【カスタマイズ】を選択してカスタマイズ設定を開きましょう。

STEP
サイトタイトルをロゴに差し替える
タイトルロゴ差し替え
  1. 設定メニューの中の【ヘッダー】を選択
  2. ロゴ画像の設定で画像を選択してロゴ画像をアップロード
  3. レイアウト・デザイン設定でロゴの配置箇所を設定
タイトルロゴの切り替え H1

これだけでタイトル部分を画像に差し替えることができました。

サイズや配置はあとからでも変更が可能なので必要に応じて数値を変更してください。

メインビジュアルの上にロゴを表示するということも可能です

STEP
メインビジュアルの設定
メインビジュアル設定
  1. トップページ
  2. メインビジュアル
  3. メインビジュアルの表示内容
  4. 画像または動画をアップロード

メインビジュアル設定で自動でスライド表示する画像や動画を設定することができます。

画像の高さやフィルターもかんたんに設定可能です。

メインビジュアルを設定したくない場合は表示内容のチェックを【なし】に入れておきましょう。

STEP
ウィジェットを追加
ウィジェット設定

ウィジェット設定からサイドバーやフッターに「カテゴリ」や「人気記事」などを簡単に配置することができます。

トップページには専用のサイドバー項目があるのでトップページだけに表示させたいという場合はトップページ専用サイドバーを利用してください。

STEP
グローバルメニュー設定
メニュー設定
  1. メニュー設定
  2. メニューの名前を入力
  3. メニューの位置をグローバルナビに
  4. 項目を追加をクリック
  5. 固定ページやカテゴリなどのリンクを追加する

追加したメニューはクリックすることで名前を変更することができます。

長い名前の場合は省略した短い言葉に変更しておくと良いかもしれません。

トップページを自由にカスタマイズする方法

前述したカスタマイズ機能で以下の項目は設定が可能です。

  • ヘッダー
  • サイドバー
  • フッター

それ以外のメインとなる部分はデフォルトだと、新着記事が並ぶだけのブログ系レイアウトになっています。

サイト型を作成する場合は以下の手順で固定ページがトップページになるように設定しましょう。

STEP
トップページとなる固定ページを作成
固定ページを作成

固定ページから【新規追加】を選択します。

ここで作成する固定ページがトップページの代わりになり、サイトにアクセスした際にトップに表示されるようになります。

STEP
タイトルとパーマリンクだけ入力して公開
固定ページ作成

固定ページの新規作成画面が開いたら、とりあえずタイトルパーマリンクだけ入力して公開します。

パーマリンクはtop-pageなどわかりやすい名称にしておきましょう。

パーマリンクが編集できない場合は下書き保存すると表示されます

STEP
固定ページをホームページに指定する
表示設定

WordPressの管理画面に戻り、設定の【表示設定】を開きます。

ホームページの表示を【固定ページ】に切り替えて、タブから先ほど作成した固定ページを選択して保存します。

これで固定ページがサイトのホームページになりました。

後は先程タイトルしか入れていなかった固定ページをデザインしていきます。

固定ページを使ってイチからトップページをデザインする

先程ホームページに変更した固定ページを再度開いて編集画面に入ります。

現在のWordPressのブロックエディタは非常に優秀で、基本的なデザインを行うだけであればコーディングが必要ありません。

ブロックエディタはブロックを組み合わせて作る

WordPressのブロックエディタの使い方を解説します。

STEP
ブロックを追加する
ブロックの追加

編集画面左上にあるボタン、または文章入力箇所の右端にあるからブロックを追加できます。

今回は機能が充実している青い方のボタンをクリックしましょう。

STEP
投稿したいブロックタイプを選ぶ
WordPressのブロック選択画面

画面左側にブロックリストが表示されます。

上図のとおり、たくさんのブロックが用意されておりブロックタイプを選択するだけでCSSでデザインされたブロックが追加されます。

SWELLブロックというのはSWELLのテーマだけに存在するブロックです(他のテーマでは使用できません)

ブロック選択画面ではカーソルを合わせるだけでブロックの説明が表示するのではじめて使用する場合でも困ることがありません

STEP
左右分割レイアウトでデザインする
トップページデザイン

初心者には難しいflexboxもカラム機能を使えばクリックだけで簡単実装。

「スマホのときは1列」「PCのときは3列」など自由に選択することもできます。

カラムブロックの使い方は以下のとおりです。

STEP
カラムブロックを追加
カラム設定

前述した方法でブロックリストの中から『カラム』を選択すると、カラムのパターンが表示されます。

この分割パターンはあとから変更も可能ですが、一番近いものを選んでおきましょう。

STEP
枠の中にブロックを追加する
カラムの追加

カラムブロックを追加すると、カラムの中に+枠が表示されカラム内にブロックを追加できるようになります。

STEP
カラムオプションを設定する
カラムブロック設定

デフォルトのままでも問題ありませんが、画面サイズによる変更などを行いたい場合はブロックオプションから変更が可能です。

  • カラム数
  • 枠のデザイン変更
  • スマホでの行数設定
  • デバイスごとの非表示設定
  • 左右のスクロール設定

カラムブロック全体を選択中にはカラム数やカラムのスタイルを変更できます。

また、カラム内の子カラムを選択した状態からはカラムの分割比率を個別に変更することができます。

レイアウトの際はレイアウトの基本とコツも参考にしてみてください。

STEP
フルワイドブロックでインパクトのあるデザインに

フルワイドブロックを使用することで、画面の端までブロックを広げることが可能になります。

サイト幅に調整したほうが見やすくはなりますが、背景画像などを入れたい場合はフルブロックを使うとサイト型っぽいデザインになります。

フルワイドブロックの使い方は以下のとおり。

フルワイドブロックの使い方
  1. フルワイドブロックを選択
  2. 全画面幅のブロックが作成される
  3. フルワイドブロックの中に通常のブロックを追加
  4. ブロックオプションから背景色や画像背景を変更

サイトのデザインの細かい部分に関しては以下の記事を参考にしてください。

お問合せフォームの設置

サイトの信頼性を上げるためにも、欠かせないお問い合わせフォームを設置していきます。

STEP
WPForms Liteをインストール
WPForms Liteをインストール

お問合せフォームはWP Forms Liteを使用しましょう。

  • 無料で利用できる
  • 操作が非常にかんたん
  • 項目のカスタマイズ可能

とてもかんたんに設置できるのでご安心ください。

プラグインの追加画面で「WPForms Lite」と検索すると出てくるのでインストールして有効化してください。

STEP
フォームの新規作成
WPForms新規作成

有効化すると「WPFormsへようこそ」画面が表示されるので下にある【最初のフォームを作成】を選択します。

フォームの作成

フォームの名前を入力し、空のフォーム【Create Blank Form】を選択します。

STEP
必要な入力項目をD&Dで追加
フィールドを追加

フォーム作成画面が開くので、左にあるフィールドからドラッグ&ドロップして必要な項目を追加していきます。

下部にある装飾フィールドを使用する場合は有料になるので今回は使用しません。
無料の基本フィールドだけで十分です。

STEP
保存して埋め込み用のショートコードを取得
保存と埋め込み

お問合せフォームが完成したら【保存】→【埋め込む】を選択してください。

ページ埋め込み設定

埋め込むを押すと埋め込みオプションが出てくるので、ショートコードを使用するをクリックしてショートコードを表示させます。

【新規ページを作成】を選ぶとお問い合わせ用の固定ページを新たに作成してくれます。

どちらを選んでもOKです。

任意の場所にお問合せフォームを設置したい場合はSTEP5へ進みましょう。

STEP
任意の箇所にお問い合わせフォームを設置
お問合せフォームを追加

ショートコードを取得しておけばトップページでもプロフィール画面でも好きな場所にお問合せフォームを設置することができます。

  1. ブロックタイプをショートコードに変更
  2. ショートコードを入力

これだけでお問合せフォームの設置が完了します。

試しに問い合わせフォームから送信してみましょう。無事にメールが届けば完了です。

WordPressは簡単!さっそくサイトを作ってみよう

wordpressはかんたん

長くなりましたが以上でWebサイトが形になりました。

  1. サーバーとドメインの手配
  2. WordPressのインストールと設定
  3. SEO関連の設定と登録
  4. トップページのデザイン作成

全体をとおすと面倒に思える作業ですが、ここの作業自体は難しいものはありません。

ブロックエディタを使ったWordPressであれば初心者であっても問題なくサイトを作成&運用できるのでぜひお試しください。

ポートフォリオとして

今回作成したような独自ドメインのWebサイトを所有していると信用にも繋がります。

インターネットで仕事を探す場合、就職活動を行う場合、いろいろなシーンでポートフォリオサイトは役立ちますよ。

特に役立つであろうのがクリエイター系の職業。

  • Webデザイナー
  • 動画編集・制作
  • イラストレーター
  • YouTuber

自分が過去に作成した制作物をWordPressで作成したサイトに公開し、自己PRに繋げてみてはいかがでしょうか?

ブログとして活用

仕事としてではなく、趣味としてのサイトを所有するのもおすすめです。

サイト型でなく、ブログ型にして日々の記録や伝えたいことを世界に発信してみませんか?

ブログ型としてデザインする場合は以下の記事も参考にしてみてください。

シェアしてくれると嬉しいです

コメント

コメント一覧 (2件)

  • ブログ立ち上げできました!本当にありがとうございました。

    ちなみにまだ検索しても出てこないのですが、検索結果に乗るのはどれくらいかかりますか?

    • 無事サイト作成できてよかったです。
      「検索に出てくる=インデックス登録された」ということになりますが、新規ドメインだとインデックス登録されるまでには1週間以上かかることがあります。
      ◯日経てば〜という基準はありませんが、1週間〜1ヶ月程度で反映されると思います。
      SNSや別サイトからのリンクがあれば早くなりますので露出を増やしてみるのも良いかもしれませんよ。

コメントする

目次