Twenty Seventeen(無料テーマ)でホームページを作る

WordPressは「テーマ」と呼ばれるテンプレートでデザインを変更することができます。

無料のものから有料のものまでありますが、今回はWordPressの公式テーマ「Twenty Seventeen」というデフォルトのテーマを例に作成していきますので、特に設定の必要はありません。

WordPressには他にもいろいろなテーマがあります。テーマごとに独自の機能がありますので、自分が作りたいものに合ったものと、なるべく配布元が安全なところかどうか確認してから選びましょう。

管理画面から編集を行いますので、まずはログインして表示します。

 

固定ページの作成

固定ページは、「店舗情報」や「会社概要」といったブログのように頻繁に更新しない、常に見せたい情報を載せるページのことです。自分の必要なページを追加していきましょう。

(1)「固定ページ」→「新規追加」をクリック
(2)ページのタイトルを入力
(3)パーマリンク(アドレス)が日本語なので、「profile」など英数字に変える
(4)本文を入力
(5)公開ボタンをクリック

sevev01

文章だけだと味気ないので、見出しや左上の「メディアを追加」から適度に画像を入れると見やすいです。
画像を横に並べて表示したい時は、「ギャラリーを作成」で画像を選択しましょう。

投稿ページを作成

投稿ページには、ブログ記事を書いていきます。

(1)「投稿」→「新規追加」をクリック
(2)ブログ記事のタイトルを入力します
(3)パーマリンク(アドレス)が日本語なので、英数字に変えます
(4)記事の本文を入力します
(5)カテゴリーを分けたい時は「新規カテゴリーを追加」で追加します
(6)アイキャッチ画像を選択すると、ブログ記事を目立たせることができます
(7)「公開」ボタンをクリック

seven02

本文は見出しを入れる、画像を入れるなどして単調にならないようにメリハリを付けて書いていきましょう。

メニューの作成

(1)「外観」→「メニュー」で新しいメニューを作ります。
(2)「メニュー名」に適当なメニューの名前を入力
(3)「メニューを作成」をクリック

seventeen03

 

(1)先ほど作った固定ページにチェックを入れます
(2)「メニューに追加」ボタンをクリック

seventeen04

 

メニューの順番は、マウスでドラッグして入れ替えられます。
「トップメニュー」にチェックを入れて、「メニューを保存」を押します。

seventeen05

これで、各ページにメニューが表示されます。

 

ヘッダー画像を変更する

トップページ上部の大きな画像を変更します。
「外観」→「カスタマイズ」から「ヘッダーメディア」を選択。
トップに表示させたい画像を選択して、入れ替えます。
seven08

seven09

ヘッダー画像が入れ替わります

seven13

 

サイドバーを作成する

各ページの横に常に表示される情報です。
「外観」→「ウィジェット」から表示させたい情報を右側の「ブログサイドバー」にドラッグして移します。
「フッター1」と「フッター2」には、下部に表示させたい情報があればドラッグしましょう。

seventeen06

トップページに紹介文を表示させる

トップページのブログの上に、常に表示させたいお店の紹介文などを設定します。
「外観」→「カスタマイズ」から「固定フロントページ」をクリック。
seven10

 

固定ページで作った「トップ」のページを表示させます
(1)固定ページをクリック
(2)フロントページ表示の時は「トップ」ページを選択
(3)ブログ投稿ページの表示の時は「ブログ」を選択

seven11

次に、「外観」→「カスタマイズ」から「テーマオプション」をクリック。
seven07

 

先ほど、トップに表示させるページで「固定ページ」を選択したので、ブログが表示されていない状態になっています。
「フロントページ第1セクションのコンテンツ」→「ブログ」を選択して、「保存して公開」をクリック
トップページの下にブログを表示させましょう。

 

ここまででホームページの大まかな部分はできあがりです。
seven14

次は、お問い合わせフォームやオプション機能を付けていきます。

2017年7月21日 4:54 PM カテゴリー:WordPress講座


WordPressの初期設定をする

ワードプレスの初期設定

WordPressをインストールできたら、初期設定をしましょう

まずは管理画面にログインして、左メニュー「設定」→「一般」を開きます。

ワードプレスの初期設定1

 

(1)「サイトのタイトル」変更する場合は、書き換えます
(2)「キャッチフレーズ」ホームページの説明文を入力します。

ワードプレスの初期設定2

 

入力したら、画面下側の「変更を保存」を押します。

ワードプレスの初期設定3

 

左上のタイトルにカーソルを合わせて「サイトを表示」を押すと、サンプルのタイトルが書き変わっています。

 

ワードプレスの初期設定4

ワードプレスの初期設定5

 

各ページのアドレスの見え方を設定

ブログ記事やページを作成したときの、アドレス表示の仕方を設定します。
この設定は必ず記事を書く前に行います。途中からアドレスを変えてしまうと、リンク切れなどが発生してしまい、せっかくのSEO対策もリセットされてしまいます。

管理画面の「設定」→「パーマリンク設定」をクリック

ワードプレスの初期設定6

 

共通設定で「投稿名」を選択
「変更を保存」ボタンを押します。

ワードプレスの初期設定7

 

※パーマリンク設定の項目選択のメリットデメリットはいろいろありますが、ここではSEOと各記事の管理のしやすさを優先して「投稿名」にしています。

 

コメントの投稿をオフにする(任意)

WordPressの各記事にコメントを受け付ける機能があるのですが、中にはスパムコメントなど迷惑なを投稿される場合が多いので、必要がなければ無効にしておきましょう。

「設定」→「ディスカッション」をクリック。

ワードプレスの初期設定9

 

「投稿のデフォルト設定」に付いているチェックを全て外して、「変更を保存」を押します。

ワードプレスの初期設定10

 

これで、設定は完了です。

2017年6月29日 4:04 PM カテゴリー:WordPress講座


WordPressをサーバーにインストールする(ロリポップ!)

ワードプレスをインストールする

まずは、ロリポップ!の管理画面にログインします。

(1)サーバー申し込み時の「アカウント」を入力
(2)「ドメイン」を選択
(3)パスワードを入力
「ログイン」をクリック。

ロリポップの管理画面からログイン

 

ロリポップ!の管理画面の左側、「簡単インストール」にマウスを合わせ、「WordPress」をクリックします。

ワードプレスインストール1

 

WordPressの「利用する」をクリック。

ワードプレスインストール2

 

必要事項を入力していきます。
(1)インストール先URLは何も入力しないでOK。
(2)WordPerssホームページのタイトルになります。後からでも変えれます。
(3)管理画面ログイン時のユーザー名です。半角英数字で入力。
(4)管理画面ログイン時のパスワードです。なるべく自分が覚えやすいものを入力。
(5)再度パスワードを入力。

「入力内容確認」ボタンを押します。

ワードプレスインストール3

 

「承諾する」にチェックを入れて「インストール」を押します。

ワードプレスインストール4

 

以上でインストールは完了です。

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

(1)「サイトURL」は、独自ドメインのアドレスです。
(2)インストール完了画面の「管理者ページURL」がWordPressの管理画面になります。ここをクリック。
※ログインするときに必要なURLなので、必ずメモやお気に入り登録しておきましょう。

ワードプレスインストール5

 

WordPressのログイン画面が表示されるので、先ほど決めた「ユーザー名」と「パスワード」を入力してログインします。

ワードプレスインストール6

 

管理画面が表示されればOKです。

ワードプレスインストール7

2017年6月27日 4:33 PM カテゴリー:WordPress講座


ロリポップ!のサーバーに独自ドメインを設定する

ドメインをサーバーに設置

独自ドメインとレンタルサーバーの申し込みができたら、ドメインをサーバーに設定しましょう。

「【ロリポップ!】お申込み完了のお知らせ」のメールの中から、「ユーザー専用ページ」のアドレスをクリック。

独自ドメインの設定1

 

(1)メールに記載された「アカウント」を入力
(2)「ドメイン」を選択
(3)申し込みの時に決めたパスワードを入力
「ログイン」をクリック。

独自ドメインの設定2

 

ユーザー専用ページから「独自ドメイン」→「独自ドメイン設定」をクリック。

独自ドメインの設定3

 

(1)ムームードメインで取得した独自ドメイン名を入力。
(2)「公開 (アップロード) フォルダ」は、自分が分かりやすいフォルダ名を半角英字で付けます。
「独自ドメインをチェックする」をクリック。

独自ドメインの設定4

 

「【ムームードメイン】ご契約完了のお知らせ」のメールに記載されている、
(1)ムームーIDを入力。
(2)パスワードを入力。
「ネームサーバー認証」をクリック。

独自ドメインの設定4

 

内容を確認して、「設定」をクリック。

独自ドメインの設定6

 

以上で、独自ドメインの設定は完了です。お疲れさまでした。
ドメインが反映されるまで1時間ほどかかりますので、しばらくお待ちください。

設定自体は難しくないですが、あのパスワードなんだっけ?と忘れがちなので、まとめてメモをとって一か所に保管しておくと管理が楽です。

2017年6月22日 2:28 PM カテゴリー:WordPress講座


レンタルサーバーの借り方(ロリポップ!)

サーバーとは

サーバーとはホームぺージのデータを置いておく「場所」のことです。
レンタルサーバーを借りることで、自分で作ったホームページのデータが管理できるようになります。
ここではロリポップ!サーバーの申し込み方法を説明します。

ロリポップ!サーバーの申し込み

ロリポップ!」のホームページを開きます。
「まずは無料の10日間ではじめよう」ボタンを押します。

レンタルサーバー1

 

プラン一覧が表示されるので、「スタンダードプラン」を選んで進みます。
「ライトプラン」はWordPressサイトが1つだけ作れます。また電話サポートはありませんので、手軽に始めたい人向けです。
あとでプラン変更するのが面倒・サポートを手厚くしたい場合は、「スタンダードプラン」がオススメです。

レンタルサーバー2

 

(1)屋号など自分の好きな言葉を入力します。
(2)好きな末尾を選びます。

アカウント情報入力画面にすべて入力し、「お申し込み内容入力」をクリック。
※ムームードメインで取得した独自ドメインは、後ほど設定します。独自ドメインを使わない場合、ここで指定したロリポップ!のドメインが自分の屋号アドレスになります。

レンタルサーバー3

 

次の画面の「お申込み内容入力」で、必要事項をすべて入力します。

初めてホームページを作る場合、「サーバー移行ですか?」のところは「いいえ、サーバー移行ではありません」のままにしておいてください。

下のほうの「任意」の部分は気にせずそのままです。後からでも登録できます。
入力したら、「お申し込み内容確認」をクリックします。

レンタルサーバー4

 

内容を確認し、利用規約とプライバシーポリシーに同意したら、「無料お試し開始」をクリック。

レンタルサーバー5

 

完了の画面が表示されたら、お申し込み完了です。
ロリポップ!からメールが届いています。

※継続してサーバーを借りる場合は、早めにお支払い手続きを済ませましょう。

2017年6月21日 3:30 PM カテゴリー:WordPress講座


1 2 3