ワードプレスで会社のホームページを自分で作成する手順、初心者でも簡単!

Sponsored Links

ワードプレス

初めてのホームページ作成には有料ソフトが必要。PCインストール型の「ホームページビルダー」「dreamweaver」などが有名です。
ところが、クラウド型CMSを利用すれば、ソフトを購入することなく無料でホームページが作成できます。

CMS(Contents Management System)で有名なのは「WordPress(ワードプレス)」

この記事では「ワードプレス」を使った、簡易な会社ホームページ(コーポレートサイト)の作成手順を記します。

目的は、社名検索で自社のホームページをヒットさせる

インターネットで会社の存在が確認できる。その程度のホームページで構わない方が対象となります。今どき会社のホームページがないのは、ちょっとレアですから。

簡易なホームページといえどもスマホ対応

単なるスマホ対応ではなくレスポンシブルデザイン。プラットフォームだけは時代の先端です。

まずは、暫定ホームページを公開。
その後、ワードプレスのカスタマイズ方法をマスターすれば、もっと素敵なホームページにリニュアルできます。

ホームページサンプル
簡易なホームページであれば自分で1日で作れます。 検索で会社名が表示されるよう、早期にサイトの公開をお勧めします。
この程度なら簡単に作れます

ワードプレスは無料のソフトですが、利用するにはワードプレス対応のレンタルサーバーを契約しなければなりません。
契約されていない方でも、無料で体験することができます。

ワードプレスを無料体験できる、初心者におすすめの最安レンタルサーバーを紹介
サイトやブログが簡単に作成できる「ワードプレス」。無料のソフトですが、利用するにはワードプレス対応のレンタルサーバーが必要です。 一度、試してみたい方。 現在契約中のレンタルサーバーが対応していない又はレ...

ワードプレスの無料体験にお薦めのサーバーは「ロリポップ!」。インストールが最も簡単にできます。

ワードプレスの準備ができたら、早速ホームページをざっくりと作ってみましょう!

Sponsored Links

WordPress(ワードプレス)とは

ワードプレス

サイトやブログが作成できる無料のソフトウェア「ワードプレス」。Web上の約30%がワードプレスで作られています。

レシポンシブデザインでスマホ対策も万全

現在、ワードプレスは2社から提供されています。
ソフトウェア版(wordpress.org)とブログサービス版(wordpress.com)。ソフトウェア版は各自のサーバーにダウンロードして利用。ブログサービス版はアメブロなどと同じネット上のサービスで、有料プランも提供しています。

ここで紹介するのは、利用度の高いソフトウェア版です。

WordPressでホームページ作成

契約またはお試し中のレンタルサーバーからワードプレスを無事にインストールできましたか?
ワードプレス対応のプランであれば、管理画面から簡単に設定できます。

参考記事:「ロリポップ」無料体験でワードプレスをインストール

インストールしたワードプレスへログインするには
サイトURLの末尾に wp-login.php を付け加えると、ログイン画面に移動します。

例えば
https://www.●●.●●/wp-login.php

ログイン画面からアカウントとパスワードを入力すると、ワードプレスの管理画面に移動します。

 

ダッシュボード

WordPressの管理画面にまず表示されるのは「ダッシュボード」。
ここでは特になにもしません。

左側にメニュー。ここから各画面に移動します。

パーマリンク設定

パーマリンク設定

始めにパーマリンクの設定を行います。
後からでも変更できますが、以前のアドレスでアクセス(LINK)するとページが表示されません。一度決めたら変更しないのが無難です。

デフォルトでは「基本」に設定されています(画像は「日付と投稿名」)。このままでも問題はありません。

各ページのアドレスになるので、後から自由に編集できる一番下の「カスタム構造」がお薦めです。※「投稿名」でもOK

ホームページ作成前に、パーマリンク設定をどうするか?
必ず決めてください

パーマリンク「カスタム構造」の設定

パーマリンク

空欄に「利用可能なタグ」をドラッグ。複数の組み合わせも可能です。
投稿または固定ページ画面、タイトル欄下に設定したパーマリンクが自動に表示されます。このアドレスをタイトルに合わせたURLに編集することができます。

テーマ

テーマ

管理画面の「外観」>「テーマ

ワードプレスは「テーマ」があって初めて機能します。テーマとはデザインテンプレートのようなもの。

2018年はテーマ「Twenty Seventeen」がデフォルト設定(毎年更新される)されてます。

管理画面の「外観」から選択した(有効)テーマが確認できます。上部にある「新規追加」をクリックすれば、たくさんのテーマが候補として表示されます。

各テーマでは書体、文字の装飾、大きさ、色、レイアウトなどが異なります。テーマ選びはホームページの印象を大きく変えます。

テーマの選択、変更はいつでも可能です。先にコンテンツ作りを進めましょう。

固定ページ

固定ページ初期

管理画面の「固定ページ」>「固定ページ一覧

企業サイトは「固定ページ」で作成。ここでは「トップページ」「会社概要」「お問い合わせ」「BLOG」を作成します。

用意された「サンプルページ」は要らないので削除。

2018年5月にリリースされた「WordPress 4.9.6」からGDPR(EU一般データ保護規則)対応として「プライバシーポリシー」が用意されています。EU向けに情報発信をされる方は要チェックですが、ここでは下書きのまま。興味のある方は内容を確認し、プライバシーポリシーガイドを参照の上、完成させてください。

プライバシーポリシーガイド

それでは固定ページの作成に入ります。

新規固定ページ

※画像は旧エディタ(クラシックエディタ)

タイトルを入力して、一旦「下書きとして保存」。

上述の「パーマリンク設定」で◎カスタム構造を選択すると
タイトル欄下にパーマリンクが表示され、編集できます。※投稿も同じ

パーマリンク

ここでは、トップページなので「top」にしました。

同様にして、残りページもタイトルだけ先に作成。
トップページ会社概要お問い合わせBLOGの4ページ、タイトルだけのダミーページを「公開」(保存)します。

コンテンツは後から作成します。

重要 固定ページ「BLOG」だけは、タイトル以外は空欄で構いません。

投稿

投稿一覧初期

管理画面の「投稿」>「投稿一覧

投稿一覧には「Hello world!」、最初の投稿が用意されています。編集もしくは削除してブログを始めます。

メニュー

メニュー

管理画面の「外観」>「メニュー

通常はヘッダー下に表示される「メニュー」を作成。まずはメニュー名に何かしらを入力し 「メニューを作成」 クリック。

メニュー作成

左欄が鮮明になったら
固定ページ」すべて選択して「メニューに追加」クリック。

固定ページ選択

メニュー構造

メニュー構造
好みに合わせメニューの表示名(ラベル)を編集し、位置をドラッグして変更
メニュー設定
メニューの位置をチェックして 「メニューを保存」 クリック。

ラベル

メニュー保存

※「メニューの位置」チェックを忘れるとメニューは表示されません

ウィジェット

ウィジェット初期

管理画面の「外観」>「ウィジェット

固定ページ&投稿の表示画面は、作成したコンテツを中心にヘッダー(上)、サイドバー(横)、フッター(下)で構成されます。サイドバーに表示する情報はウィジェットから挿入します。

ウィジェット削除

ブログサイドバー
はデフォルトで、いくつかのウィジェットが既にセットされています。
企業サイトには全部不要なので、すべて削除しても構いません。
①②の手順で削除してください。取り敢えず「検索」だけ残しました。


利用できるウィジェット
から カスタムHTMLをドラッグして「検索」上に挿入。

ウィジェットテキスト

同じウィジェットを何個でも追加できます。

ウィジェットテキスト記入
ウィジェットの
カスタムHTML
を開いて、タイトルと内容を記入。ウィジェット内では改行位置に<br>を入れます。

ホームページの表示設定

表示設定

管理画面の「設定」>「表示設定

ホームページの表示は、●固定ページを選択。①
下段の
ホームページ:は、固定ページの「トップページ」を選択。②
投稿ページ:は、固定ページの「BLOG」を選択。③

ここでの「ホームページ」は一番最初に表示されるページ(トップページ)、ホームページ本来の意味
現在ではウェブサイトをホームページと呼ぶことが広く浸透しています
投稿ページで固定ページを選択すると、選択されたページ(URL)には投稿の一覧が表示されます。固定ページの内容は表示されません

ホームページのプレビュー

完成HP1

作成中のホームページ(ウェブサイト)をパソコンのブラウザーから確認してみます。

デフォルトのテーマ「Twenty Seventeen」は少々クセがあるので、比較的オーソドックスな「Twenty Sixteen」に変更しました。メニューをヘッダーのタイトル下に表示するテーマが多いですが、このテーマは横並びです。

もちろんレシポンシブデザイン。
画面幅をドラックするとレイアウト表示が変わります。スマホで見ると
メニューはボタン化され、サイドバーはメインコンテツの下にレイアウト変更されます。
スマホ画面

ワードプレスのテーマを変えてみます

twentyseventeen

テーマ「Twenty Seventeen」で見ると、サイドバーが表示されません。ブログをクリックするとサイドバーが表示されました。固定ページではサイドバーを表示しない仕様のようです。

この様にテーマによって、まったく違った見え方になるのがワードプレスです。

ワードプレスでホームページを完成

以上で各ページ(ダミー)とパーツは仮完成。

後は各ページのコンテツを作成。編集画面のエディタより文章を作成し、「メディアを追加」ボタンから写真を挿入して完成です。

いかがでしたか、簡単ですよね?

コンテツの作成、エディタの使い方などが分からない方は
書籍などをご参考にして下さいm(_ _)m

会社・お店のホームページを拡散させる

ホームページの完成後は「Googleマイビジネス」の登録も忘れずに。無料でGoogleマップに掲載、会社存在をアピールして顧客を呼び込むことができます。

Google マイビジネス - Google で顧客エンゲージメントを促進
Google マイビジネスの無料のビジネス プロフィールを使うと、Google 検索や Google マップで近隣ユーザーによる顧客エンゲージメントを促進できます。

Googleマイビジネスは営業時間や電話番号、ホームページのURLも表示できます。

Googleマイビジネスに登録して検索結果ページで会社を目立たせる方法
貴方の会社、「Googleマイビジネス」に登録してますか? Googleマイビジネスは無料のビジネスリスティング。 登録後は、Googleマップで貴方の会社・お店を表示します。 Googleマイ...

会社のアピールはSNSも有効な手段。SNSではホームページURLも登録できます。

ブログを書いたらSNSで情報発信!

ホームページを登録する

ホームページが完成したら
Googleの「Search Console」と「Analytics」に登録しましょう。

Google Search Console
Google Marketing Platform - Unified Advertising and Analytics
Introducing Google Marketing Platform, a unified marketing and analytics platform for smarter marketing measurement and better results.

内容を理解するのは、ずっと先でも良いので、ホームページ完成後は直ぐに登録するのがお薦めです。データが集まれば(半年後ぐらい)、ホームページのアクセス解析や診断に役立ちます。


ホームページのスマホ対応(レスポンシブル)とhttps化は必須!
2015年4月、Googleはスマホ対応のウェブサイト(モバイルフレンドリー)は、モバイル検索結果で優遇するアルゴリズム変更を適用しました。 翌年(2016年)の5月に、モバイルフレンドリーアルゴリズムを更に強...
Sponsored Links
関連記事
ウェブサイト
記事をシェアする
Sponsored Links
noma

有限会社ノマド。名古屋の建築設計&不動産会社。主に一級建築士と宅地建物取引主任士のスタッフが記事をしたためています。

Amazonランキング大賞2018

数億種類の取り扱い商品からAmazonでの販売データをもとに集計
年間のカテゴリー別
「Amazonランキング大賞2018」
ちょっと気になりませんか?

のまろぐ2.0