※上記リンクより該当箇所まで移動することができます
WordPressは、ブログを作成するための優れたプラットフォームです。
初めて利用する人にとっては、使い方・操作方法が分からずに戸惑うことがあるかもしれません。特に、初めてのブログ記事を書くときにはいろいろと手間がかかって、上手くできるか不安になりますよね･･･。でも心配する必要はありません。
この記事では、WordPressを初めて触る方に向けて、ブログ記事を作成する具体的な方法を紹介します。
なるべく簡単にやさしく理解できるよう、ステップバイステップで各画面毎に注釈を含めたスライドを使って解説していきます。
まずは、WordPressの基本的な機能や使い方について解説し、次に、記事を書くための具体的な手順・記事を見やすく＋読みやすくするための各種装飾のやり方についても触れてます。
この記事を読めば、初めてのWordPressの記事作成がすんなりと進められるかと思いますので、ぜひ最後まで読んでもらえればと思います。
:
関連記事）WordPressブログ初心者向けの記事はこちら
40代から稼ぐためのWordPressブログの始め方・作り方を詳しく解説します！
https://kosodate-enjoy.com/wordpress-blog-quickstart/
副業ブログのサーバのおすすめはこの2つ！どちらか選べば間違いなし！
https://kosodate-enjoy.com/side-business-blog-rental-server/
:
WordPressの使い方と事前準備
これまでの記事ではWordPressのインストールから初期設定までを解説してきましたが、ここからは実際に記事を投稿していく具体的なやり方について解説していきます。
WordPressでブログ記事を書いていくには、「投稿」をしていく必要がありますが、まずその「投稿」に至るまでに、いくつかWordPressの事前準備について解説しておきたいと思います。
📘WordPressの事前準備
- WordPressへのログイン
- WordPressのダッシュボード
- 「投稿」ページと「固定」ページ
- クラシックエディターとブロックエディター
記事を書きはじめるまでの事前準備を１つ１つ見ていきましょう。
WordPressにログインする
まずWordPress(ワードプレス)にログインしなければ何も始まりません。
事前にレンタルサーバに設定した、あなたのブログの「管理画面URL」にアクセスすると上記画面が表示されます。
「ユーザー名」「パスワード」を入力し「ログイン」でクリック。あなたのブログの管理画面にログインします。
WordPressのダッシュボード
上記の「ダッシュボード」に画面が切り替われば、WordPressへのログインは成功です。
ここまではWordPressの初期設定までの手順にて実施済かと思います。
:
次に「ダッシュボード」の内容について見ていきましょう。
左側にダッシュボードの各メニューがありますので、ここでやりたい項目を選んでいきます。
- 新しい記事の投稿／固定ページの作成
- 画像や動画の挿入
- ブログのデザインなどの各種設定
- プラグインの追加／設定／削除
- ユーザー設定･･･
などなど、
:
投稿ページと固定ページの違い
こちらの画像の左が「投稿ページ」、右が「固定ページ」の例です。
- 投稿ページ：ブログの記事を書くときはこちらから投稿します。
- 固定ページ：「お問い合わせ」「プライバシーポリシー」など、ブログ内に固定的に設置しておくページです。
この記事ではまず「ブログの記事をどうやって書いていくか？」について解説していきますので、「投稿ページ」の使い方をメインに紹介していきます。
:
クラシックエディターとブロックエディター
WordPressの記事作成する画面（エディター）は、2つの種類があります。
クラシックエディター
名前のとおり、１つ古いタイプのエディターです
ブロックエディター
WordPressバージョン5.0以降には標準装備されているエディターです。
これからWordPressをはじめる方の初期設定では「ブロックエディター」が実装されています。
ブログの経験がある方は旧エディターとなる「クラシックエディター」を使っている方も多く、使っている方の割合でいうと半々くらいなのではないでしょうか？
自分だけのブログ運営だけなら「クラシックエディター」を使い続けてもよいですが、もし「Webライター」など他人が所有するWordPressを使って記事を書くことがあるのであれば「ブロックエディター」にも慣れておいたほうがよいでしょう。
この記事では「クラシックエディター」を使って記事を書くやり方を紹介しています。
プラグイン「Classic Editor」を追加
「ブロックエディター」から「クラシックエディター」に変更するやり方は以下の通りです。
- ダッシュボードのメニューバーから「プラグイン」→「新規追加」をクリック
- プラグイン「Classic Editor」を検索して表示させ「今すぐインストール」をクリック
- インストール完了後に「有効化」をクリック
これで投稿画面が「クラシックエディター」に切り替わります。
:
WordPressブログの記事の書き方
ここからは具体的にWordPressでブログ記事を書いていきます。
- 「投稿ページ」を作成する
- 「本文」を入力していく
- 「見出し」を設定する
- 「箇条書き」を設定する
- 「記事の装飾」を行う
- 「画像」を挿入する
1点だけ事前にご連絡！
これ以降の画面を使った解説は、本ブログで使っている「THE THOR」というテーマ使用時の画面をベースに解説していきます。
ご使用のテーマによって、メニュー表示などが一部異なる部分があると思いますので、その点だけご留意ください。
:
❶：「投稿ページ」を作成する
まず「投稿ページ」を作成していきます。
ダッシュボードのメニューから「投稿」ー「投稿一覧」をクリックすると、上記の一覧画面が表示されます。
まだ1つも記事がないときは何も表示されませんが、ここに作成した記事がストックされていきます。
左上にある「新規追加」をクリックして新しい記事のエディター画面を表示させます。
:
❷：「本文」を入力していく
新規投稿画面が表示されたら、さっそくブログ記事の「本文」を入力していきましょう。
上記画像には主な新規投稿画面の使い方を記載しています。
- 記事タイトルの入力
- 投稿本文の入力・編集（※）
- 写真や画像を追加（※）
- 見出しの設定（※）
- 本文へのリンクの挿入
- テキストの書式設定
- 下書き保存とプレビュー表示
- 「ビジュアル」「テキスト」エディター切替え（※）
- 投稿の公開
ビジュアルエディターとテキストエディターの違い
この記事前半では「ブロックエディター」「クラシックエディター」の違いについて記載しましたが、今回は「ビジアルエディター」と「テキストエディター」の違いについてです。
「ブロックエディター」「クラシックエディター」はブログ全体で採用する編集画面「エディター」の選択でしたが、「ビジアルエディター」と「テキストエディター」は記事単位で使用する編集画面「エディター」の選択となります。
いろんなエディターがあって少しややこしいのですけど･･･
違いだけ簡単に説明を記載しておきます。
- ビジュアルエディター：Microsoft「Word」やGoogle「ドキュメント」などと同じように文章を入力して記事を作成できます。自動的にHTMLやCSSなどのプログラミング言語に変換されて、Web画面表示に最適な形にしてくれます。
- テキストエディター：Web画面表示に最適な形にする作業をHTMLやCSSなどのプログラミング言語を使って設定していく画面です。
:
➌：「見出し」を設定する
記事を作成する際には、文字を淡々と書いていくのではなく、大見出しや中見出しなどの「見出し」を設定して見やすい記事にしていきましょう。
見出しに設定したい文章を選択して、「段落」ー「見出し（2〜5）」を選択すれば設定できます。
- 段落：本文
- 見出し2：大見出し（h2)
- 見出し3：中見出し（h3）
- 見出し4：小見出し（h4）
- 見出し5：小見出し（h5）
「見出し」についての記載には、「h2」「h3」などの用語が一緒に表示されることが多いのですが、これは見出しの種類をプログラミング言語で指定するときに使う「見出しタグ」と呼ばれるものです。
上記のとおり、大見出しは「h2」、中見出しは「h3」といった感じで決まっており、先ほど出てきた「テキストエディター」で１つ１つ設定するときには「h2タグ」「h3タグ」を使って表示を設定していくためのものです。
上の画像には、「これはH2見出しです」という大見出し(h2)が設定されていますが、これを「テキストエディター」で見ると「<h2>これはH2見出しです</h2>」として設定されているのがわかります。
ブログ初心者のうちはここまで意識する必要はありませんが、今後のために少し覚えておいてもらえればと思います。
見出しのデザインについて
上図の例では、何の装飾もない一番シンプルな「見出し」にしていますが、見出しのデザインはいつでも変更可能です。ダッシュボードのメニュー「外観」ー「カスタマイズ」に設定があります（使用するテーマによって設定できる内容が異なります）
:
❹：「箇条書き」を設定する
記事本文の中に「箇条書き」を含めて記載すると、本文がスッキリして読みやすい記事になってきます。
一文の中でいくつも記載するよりも、短いセンテンスで箇条書きにしたほうが良いことが多いので、こちらは積極的に使っていきたいですね。
箇条書きには以下２つの種類があります。
- 番号なしリスト：白丸や黒丸で箇条書きにする時に使います
- 番号つきリスト：「1.2.3.4」「①②➂④」などでリスト化する時に使います
見出しと同様に箇条書きについてもデザイン変更することができます。ダッシュボードのメニュー「外観」ー「カスタマイズ」に設定できる項目がありますのでお好きなデザインにしておきましょう！
:
❺：「記事の装飾」を行う
ここでは、本文を装飾したり「吹き出し」「ボックス」「ボタン」などを用いて記事を見やすくしていくやり方について解説していきます。
本文の装飾
まず上の図の左側は「本文の装飾」について基本的な事項をまとめたものです。
- 太字・斜体の設定
- 文字の色の設定
- マーカーの設定
太字や文字の色などについては、普段使っているExcelやパワポなどでもお馴染みなので特に違和感なく使えるかと思います。
また、WordPressでは「スタイル」メニューから様々な装飾をすることができます。
ここではマーカーについて記載してますが、該当箇所を選択して「スタイル」ー「マーカー」から各種設定をすることが可能です（マーカーの太さ×色）。
よく使うマーカーは予めセットしておくこともできますし、マーカー×太字×文字の色などを組み合わせれば、より文章を強調して表示することもできます。
吹き出しの挿入
「プリセットパーツ」ー「吹き出し」から左右どちらでも吹き出しを設定することが可能です。
予め「吹き出し」に用いる画像を設定しておく必要がありますが、上図の例のように「吹き出し」を用いてちょっとしたコメントを入れておくだけで、文字だけの記事とはガラリと印象が変わってきます。
また、画像を２つ設定しておけば、左右で会話しているようにも表示させることもできますので、ツラツラと長い文章の合間に挿入すると、程よく息抜きを入れられるような感じになって記事としても読みやすくなりますので、ぜひ活用してもらえればと思います。
:
ボックスの設定
上の画像の左側は「ボックス」の設定方法に関して記載しています。
「スタイル」ー「ボックス」を表示させると、上記のように予めいくつものボックスが用意されているので、記事内容に沿ったお好みのボックスを設定すればOKです。
例えばボクが良く使うのは「ビックリボックス」で、大事な部分を強調して表示しておきたいときなどに使ってます。以下のような感じですね。
:
ボタンの設定
上の画像の右側は「ボタン」の設定方法についての記載です。
同様に「スタイル」ー「ボタン」を表示させると様々なボタンが表示されるので、好きなボタンを使いましょう。
ボタンを選んで画面に表示させると、そのボタンの設定ができるようになります。
ここでボタンを押したときの「リンク先」のURLを設定しておくことで、読者を別サイトなどに誘導することが出来ます。
予め用意されているデザイン以外にもオリジナルのボックス/ボタンを作ることもできます。ダッシュボードのメニュー「外観」ー「カスタマイズ」に設定できる項目がありますので作成してみてもよいですね！
繰り返しになりますが、使用するテーマによって設定のやり方が異なりますので、使っているテーマのやり方を確認してみてください。
:
❻：「画像」を挿入する
ブログ記事には、多くの写真・画像が使われていますが、ここでは画像の挿入のやり方を見ていきましょう。
ブログ記事に使う「画像」は大きく分けて以下の2種類があります。
- アイキャッチ画像：
記事一覧のページにてサムネイル(小さく表示された画像)として表示されたり、各記事ページの冒頭(記事タイトルの下)に大きく目立って表示される画像のこと。1記事で1枚のみ設定できる。 - 本文に挿入する画像：
見出しのタイトル下に挿入したり、記事の内容に沿って必要な時に挿入する画像。
アイキャッチ画像
ここではアイキャッチ画像の設定のやり方を解説していきます。
- 投稿ページの右下にある「アイキャッチ画像を設定」をクリック
- 「ファイルをアップロード」から画像をアップロード
- 「メディアライブラリ」内にアップグレードされた画像を選択
- 画面右下にある「アイキャッチ画像を設定」で設定
以下画面キャプチャに手順を記載しているので参考にしてみてください。
:
本文に挿入する画像
本文に挿入する画像も基本的な流れは同じですが、取っ掛かりの手順が異なります。
- 本文入力欄の画像を挿入したい箇所にカーソルをセットする
- 投稿ページの左上にある「メディアを追加」をクリック
- 同様の手順で画像をアップロード＆選択して「投稿に挿入」をクリック
こちらも以下画面キャプチャに手順を記載しているので参考にしてみてください。
:
設定・挿入する画像について
画像にも有料／無料のものがありますが、ブログ初心者のうちは、まずは「無料画像」から探していくのがよいかと思います。
以下にボク自身も良く使う、無料で使える画像・イラストのサイトをご紹介しておきます。
- Pixabay：著作権関連の記載は必要なく商用利用可能で使いやすいです。
https://pixabay.com/ja/ - O-DAN：いろんな無料画像サイトからまとめて画像を探すことができます
https://o-dan.net/ja/ - ソコスト：いい感じのイラストが集まっていて透過処理されていて使いやすいです
https://soco-st.com/
無料画像を使う時の注意事項
無料画像とはいえ利用規約がありますので、それぞれのサイトの利用規約を必ずチェックしておくようにしましょう。
使用する画像の中には「クレジット表記」が必要なものもあります。これを記載しないで使用していると、画像のクリエイターや関連する法律事務所などから英語で直接メールが届くなんてこともあるので注意が必要です。
もちろんですが、勝手に他のサイトの画像をキャプチャして自分のブログに掲載するなんてことはしてはなりません。
著作権に絡む案件となりますので、ブログ運営していくにはこの点はきっちりと内容把握してルール違反にならないように注意が必要です。
:
まとめ：はじめてのWordPressブログの書き方(記事作成編)
WordPressは、初めてブログを作成する人にとっても使いやすく、多くのテーマやプラグインがあるため、自分らしいブログを簡単に作成することができます。
今回はWordPressで初めて記事を書く方を想定し、WordPressの基本的な機能や使い方から、記事を書くための具体的な手順と、記事を見やすく＋読みやすくするための各種装飾のやりかたについても解説させてもらいました。
文字だけでなく実際の画面キャプチャに注釈をつけたスライドを用いて説明してきましたので、実際にこちらの記事を見ながら進めてもらえれば、記事本文の作成パートについては問題なく進められるかと思います。
今回は記事本文の作成までの解説でしたので、次のステップは「記事の公開」をして実際に誰でも見てもらえる状態にすることが必要となります。
記事本文の作成だけでもこれだけ長くなってしまいましたので、続きはこちらの記事をご覧ください。
WordPressで初めて記事を投稿するステップ 具体的な記事タイトル・カテゴリ・メタディスクリプション設定のやり方 記事投稿後のインデックス登録のやり方※上記リンクより該当箇所まで移動することができます[…]
:
再掲）WordPressブログ初心者向けの記事はこちら
40代から個人で稼ぐチカラを身につけるには？ Worfpressブログをつくる全体像 レンタルサーバーとドメイン取得の手続き方法 Worfpressブログ開設までの詳しい手順 稼ぐためのブログ初期設定のや[…]
副業ブログのレンタルサーバはこのどちらか選べばOK 副業ブログの開設に必要な最初の3ステップ 間違いなしのおすすめサーバ×2つを紹介※上記リンクより該当箇所まで移動することができますRyu[…]
宣伝）副業ブログのおすすめレンタルサーバはこちらの２つ