WordPressの初心者向け基本操作とカスタマイズマニュアル
WordPressの基本的な操作方法を、初心者の方でも理解しやすいように画像を多く使って分かりやすく説明します。
・WordPressを自分で制作する方
・WordPressを他の方に制作していただきこれから自分で更新作業をする方
など、皆さまのご参考になれば幸いです。
なお、必要最小限な項目にかぎって説明しております。
他にもたくさんある便利なWordPressの機能をお知りになりたい場合はGoogleなどで検索してお調べください。
(検索例:「WordPress 文字の大きさ 変更」)
※WordPress(ワードプレス)のテーマ「Lightning(ライトニング)」の画面キャプチャを使ってマニュアルを作成しています。
このマニュアルは基本的なWordPressの機能説明ですので、Lightning以外のテーマでも参考になります。
(ただし、テーマによってはWordPressの基本機能と異なる場合があります。
その場合はそのテーマのマニュアルや参考WEBサイトをご参考にしてください)
Contents
お試しいただく前提条件
このサイトの説明は、WordPressの管理画面にログインし、ダッシュボードを開いている状態から説明します。
![WordPress管理画面画像001](https://yoshinobu.pro/wp-content/uploads/2023/06/0a6776942e1715ac5f46bd2d57ab269d-e1685685226290.jpg)
もし、WordPressの管理者URLが分からない、ログイン方法が分からない、などの場合はお手数ですが
・WordPressをインストールされた方
(ご自分の場合はご自分のインストール履歴など。他の方に制作していただいた場合は制作していただいた方など)
にご確認されてください。
WordPressの「テキスト」や「画像」などが入力されている場所
WordPressの「テキスト」や「画像」が入力されている場所は、おもに下記の①〜⑤です。
WordPressは基本的に「固定ページ」と「投稿」ページにて構成されています。
①固定ページ
(普通のWEBサイトのページ)
![WordPress固定ページ001](https://yoshinobu.pro/wp-content/uploads/2023/05/50a73abb273232f3c0411c404f22debc-1-e1685509577843.jpg)
②投稿
(ブログなどを掲載していく投稿用の「固定ページ」)
![WordPress投稿ページ001](https://yoshinobu.pro/wp-content/uploads/2023/05/633b0659d9f141a970aec0e8edd34c54-1-e1685509618804.jpg)
また、「固定ページ」と「投稿」ページには(WordPressのテーマにもよりますが)、ページ内に
・「ヘッダー」
・「フッター」
・「サイドバー」
という場所が通常あります。
これは「固定ページ」や「投稿ページ」の中の上、下、右(または左)に位置します。
なお、「ヘッダー」「フッター」は基本的にありますが、「サイドバー」は設定しない場合もあります。
③ヘッダー(上)
(通常は、メニューなどが表示されています。
![WordPressヘッダー画像001](https://yoshinobu.pro/wp-content/uploads/2023/05/50a73abb273232f3c0411c404f22debc-2-e1685509674951-wpp1685509705709.jpg)
④フッター(下)
(通常は、メニューやサイトマップなどが表示されています)
![WordPressフッター画像001](https://yoshinobu.pro/wp-content/uploads/2023/05/d95d4ebee90276dbf6528bb7c5e5beaa-e1685428067385-wpp1685428115984.jpg)
⑤サイドバー(右または左)
(通常は目次や、ブログのタイトル、広告などが表示されています)
![WordPressサイドバー画像001](https://yoshinobu.pro/wp-content/uploads/2023/05/9b40f8c5d5275b89ea323f91205e8431-e1685428177230-wpp1685428210846.jpg)
「固定ページ」と「投稿」について
⚫︎固定ページ
![WordPressメニュー画像001](https://yoshinobu.pro/wp-content/uploads/2023/05/50a73abb273232f3c0411c404f22debc-e1685427564199-wpp1685428398599.jpg)
WordPressの「固定ページ」とは「作成頻度が少ないページ」です。
会社のホームページなどで使われているページが該当します。
なお、「作成する頻度が少ない」ですが、「更新する頻度」は多い場合があります。
・作成頻度:新規にページを追加作成する頻度
・更新頻度:作成されている内容(テキストや写真などのコンテンツ)を更新する頻度
⚫︎投稿(投稿する固定ページ)
(「投稿」する「固定ページ」(例:ブログ一覧が掲載されているページ)を、以下「投稿」ページと例えます)
![](https://yoshinobu.pro/wp-content/uploads/2023/05/633b0659d9f141a970aec0e8edd34c54-e1685426286666-wpp1685428525163.jpg)
WordPressのもう一つの「投稿」ページも「作成頻度が少ないページ」です。
が、「投稿」ページ内に作成される、いわゆる「ブログ」や「記事」(以下「ブログ記事」と例えます)などは、高頻度に作成されます。
WordPressでは、「投稿」ページ内で、多数の新規追加された「ブログ記事」などをまとめて表示します。
各「ブログ記事」を見る方法は、通常は「投稿」ページの下記などから「ブログ記事」を選択します。
・「ブログカード」(ブログの写真と概要が表示された、横長のバナーみたいな大きなリンクボタン)
・「最近の投稿」
・「カテゴリー」
・「アーカイブ」
「固定ページ」の開き方
![WordPress管理画面固定ページ画像001](https://yoshinobu.pro/wp-content/uploads/2023/05/6f6ee3424642d25ad347a6e3da7ccc42-e1685428603254-wpp1685428833486.jpg)
WordPressの管理者画面の左側に、背景が黒色の「メニューバー」があります。
その中から「固定ページ」を選択します。
「固定ページ」を新規作成する方法
※この部分は最初に作成して設定すれば、そのあとは触らない作業です。
他の人がWordPressを制作した場合は、基本的にここは設定済です。
そのため、固定ページのテキストを編集したり、写真を更新する方は作業不要です。
ここでは固定ページを新規作成する説明は省略します。
固定ページの新規作成方法を知りたい方は、Google検索などで
・「WordPress 固定ページ 作成」
などで検索してお調べください。
例えば下記のようなWEBサイトが参考になります。
編集する「固定ページ」を選択
![WordPress管理画面固定ページ画像002](https://yoshinobu.pro/wp-content/uploads/2023/05/891150b03b691041ee22386ee6e47343-e1685428715871-wpp1685429182591.jpg)
左側のメニューの「固定ページ」を選択すると、すでに作成された固定ページの一覧が表示されます。
編集をする固定ページを選択します。
テキスト(文章)の編集方法(作成・更新・削除方法)
WordPressの基本的な操作方法の「テキスト(文章)」の作成方法、更新方法(変更方法)を説明します。
テキストの編集
![WordPress管理画面固定ページ画像003](https://yoshinobu.pro/wp-content/uploads/2023/05/fdad9b0c7328fbbf795e56ce01a2c433-e1685429356223-wpp1685429391971.jpg)
編集したいテキストをクリックします。
そうすると、通常のテキスト編集と同じように文字(テキスト)の追加、更新、削除ができます。
改行する場合は「シフト(shift)+エンター(enter)」キー(「シフト」を押しながら「エンター」を1回クリック)で改行してください。
「エンター」キーだけを押すとすると、新しい段落が作成されて、テキストの文章と文章の間に隙間が発生します。
間違って作成した場合は、作成された「ブロックを選択するには「/」を入力」をクリックして、「バックスキップ」キーをクリックしてください。
基本的な文章作成は、下記のサイトが参考になります。
編集した内容を保存(確定)
![WordPress管理画面固定ページ画像004](https://yoshinobu.pro/wp-content/uploads/2023/05/0b4bd6469418bff3810fe9ed2ae6f058-e1685429483393-wpp1685429532204.jpg)
編集が完了したら、必ず右上の「更新」をクリックしてください。
これをクリックしないと、編集した内容が保存されないのでご注意ください。
![WordPress管理画面固定ページ画像005](https://yoshinobu.pro/wp-content/uploads/2023/05/61b174460445940feaad7844726bb92f-1-wpp1685513225500.jpg)
逆に、編集内容を保存しない場合は、ブラウザの「更新」ボタンをクリックしたり、「左上のメニューに戻るアイコン」をクリックしてください。
(慣れないうちは、「更新」をクリックし忘れやすいので気をつけてください)
画像(写真、イラストなど)の編集方法(作成・更新・削除方法)
WordPressの基本的な操作方法の「画像(写真、イラストなど)」の作成方法、更新方法(変更方法)を説明します。
編集する画像の選択
![WordPress管理画面固定ページ画像006](https://yoshinobu.pro/wp-content/uploads/2023/05/61b174460445940feaad7844726bb92f-e1685429705228-wpp1685429785697.jpg)
編集したい画像をクリックします。
そうすると、画像の周辺(上側か下側)に「ブロックツールバー」が表示されます。
「ブロックツールバー」の中の右側にある「置換」を選択します。
画像データの参照先を選択
![WordPress管理画面固定ページ画像007](https://yoshinobu.pro/wp-content/uploads/2023/05/b4d470e354ec6eb02affa836c864c9f7-e1685508091285-wpp1685508405832.jpg)
使いたい画像データの元データの場所を、「メディアライブラリを開く」または「アップロード」のいずれかから選択します。
「メディアライブラリから開く」から参照する場合
![WordPress管理画面固定ページ画像008](https://yoshinobu.pro/wp-content/uploads/2023/05/b4d470e354ec6eb02affa836c864c9f7-1-e1685509240198-wpp1685509330657.jpg)
すでにWordPress内に画像データが保存されている場合は「メディアライブラリを開く」を選択します。
(WordPressへの画像のアップロード方法はの後ほど説明します)
![WordPress管理画面固定ページ画像メ008メディア](https://yoshinobu.pro/wp-content/uploads/2023/05/0238bb0c7d17b488f4885406edad255c-1-e1685509484258-wpp1685509511205.jpg)
画面の中に新しく「メディアの選択またはアップロード」の画面が開きます。
左上のタブに「アップロード」と「メディアライブラリ」があります。
WordPress内の画像から選択する場合は「メディアライブラリ」を選択します。
![WordPress管理画面固定ページ画像009メディア](https://yoshinobu.pro/wp-content/uploads/2023/05/0238bb0c7d17b488f4885406edad255c-e1685508542782-wpp1685508836262.jpg)
「メディアライブラリ」の中から、新たに変更したい画像を選択します。
選択後、右下の「選択」をクリックします。
編集した内容を保存(確定)
![WordPress管理画面固定ページ画像010](https://yoshinobu.pro/wp-content/uploads/2023/05/6cff98ded140b00d1aee6d003382d080-e1685511784511-wpp1685511806542.jpg)
元の画面に戻りますので、右上の「更新」をクリックして保存(確定)します。
これをクリックしないと保存されないのでご注意ください。
![WordPress管理画面固定ページ画像011](https://yoshinobu.pro/wp-content/uploads/2023/05/6cff98ded140b00d1aee6d003382d080-1-wpp1685513283877.jpg)
逆に、編集内容を保存しない場合は、ブラウザの「更新」ボタンをクリックしたり、「左上のメニューに戻るアイコン」をクリックしてください。
(慣れないうちは、「更新」をクリックし忘れやすいので気をつけてください)
「メディアライブラリから開く」内の「アップロード」から参照する方法
WordPress内にまだ画像をアップロードしていない場合は、画像をアップロードします。
「メディアの選択またはアップロード」の左上のタブの「ファイルをアップロード」からアップロードできます。
![WordPress管理画面固定ページ画像012メディア](https://yoshinobu.pro/wp-content/uploads/2023/05/59280718f0e1160b347da2b85679a481-e1685510037391-wpp1685510168124.jpg)
「ファイルをアップロード」タブをクリックします。
「ファイルを選択」をクリックします。
![WordPress管理画面固定ページ画像013メディア](https://yoshinobu.pro/wp-content/uploads/2023/05/f8106944bf293d4df04e137c9bdcef96-e1685513807763-wpp1685513843936-e1685514195943.jpg)
パソコンのフォルダウィンドウが開きます。
フォルダの中から新しく変更したい画像を選択します。
選択後、右下の「開く」をクリックします。
「メディアライブラリ」の画面に移って、アップロードした画像が選択できるようになります。
![WordPress管理画面固定ページ画像014メディア](https://yoshinobu.pro/wp-content/uploads/2023/05/0238bb0c7d17b488f4885406edad255c-e1685508542782-wpp1685508836262.jpg)
ここから再度、変更したい画像を選択します。
画像を選択したら右下の「選択」をクリックして画像を決定します。
「アップロード」から参照する場合
編集したい画像をクリックして開くと、画像の周辺(上側か下側)に「ブロックツールバー」が開きます。
ここからも、画像を「アップロード」をすることもできます。
アップロードする方法は、前述の
「メディアライブラリから開く」内の「アップロード」から参照する方法」
と同じ方法です。
![WordPress管理画面固定ページ画像015メディア](https://yoshinobu.pro/wp-content/uploads/2023/05/b4d470e354ec6eb02affa836c864c9f7-2-e1685510983951-wpp1685511017268.jpg)
「ブロックツールバー」の「アップロード」を選択します。
![WordPress管理画面固定ページ画像016メディア](https://yoshinobu.pro/wp-content/uploads/2023/05/41ec85bd9593cfbfd2fe2520327fea40-e1685514005594-wpp1685514064743.jpg)
パソコンのフォルダウィンドウが開きますので、フォルダの中から新しく変更したい画像(変更後の画像)を選択します。
選択後、右下の「開く」をクリックします。
![WordPress管理画面固定ページ画像017メディア](https://yoshinobu.pro/wp-content/uploads/2023/05/0238bb0c7d17b488f4885406edad255c-e1685508542782-wpp1685508836262.jpg)
「メディアライブラリ」の画面に移って、アップロードした画像が選択できるようになります。
ここから新たに変更したい画像(変更後の画像)を選択します。
選択後、右下の「選択」をクリックします。
編集した内容を保存(確定)
![WordPress管理画面固定ページ画像018](https://yoshinobu.pro/wp-content/uploads/2023/05/6cff98ded140b00d1aee6d003382d080-e1685511784511-wpp1685511806542.jpg)
右上の「更新」をクリックして保存(確定)します。
これをクリックしないと保存されないのでご注意ください。
![WordPress管理画面固定ページ画像019](https://yoshinobu.pro/wp-content/uploads/2023/05/6cff98ded140b00d1aee6d003382d080-1-wpp1685513283877.jpg)
逆に、編集内容を保存しない場合は、ブラウザの「更新」ボタンをクリックしたり、「左上のメニューに戻るアイコン」をクリックしてください。
(慣れないうちは、「更新」をクリックし忘れやすいので気をつけてください)
ブログの作成方法
WordPressの基本的な操作方法の「ブログ」や「記事」(以下「ブログ記事」と例えます)の作成方法を説明します。
①ブログ用「固定ページ」を「投稿ページ」に設定
※この部分は最初に作成して設定すれば、そのあとは触らない作業です。
他の人がWordPressを制作した場合は、基本的にここは設定済です。
まずは、ブログ用の固定ページを作成します。
次に、作成した「固定ページ」を「投稿ページ」に設定します。
設定する方法は、下記のWEBサイトに詳しく書かれていますので参考になります。
(上記WEBサイトの文中の「投稿ページを作成する」に設定方法が記載されています)
②ブログ用「固定ページ」を「メニュー」に設定
※この部分は最初に作成して設定すれば、そのあとは触らない作業です。
他の人がWordPressを制作した場合は、基本的にここは設定済です。
WEBサイトの「メニュー」から「投稿」ページ(ブログ用の固定ページが)表示できるように設定します。
左側の「外観」から「メニュー」を選択します。
左側の「メニュー項目を追加」の中の「固定ページ」の中の「すべてを表示」タブを選択します。
ブログ用に作った「固定ページ」を選択して、下にある「メニューを追加」をクリックします。
右側の「メニュー構造」に、ブログ用に作った固定ページが追加されます。
メニューの表示する場所を設定したり、サブメニューなどに設定して完了です。
「固定ページ」と「投稿」の違い
※この部分の説明は、慣れると分かってくるので読み飛ばしても大丈夫です。
・「投稿」に「新規追加」をすると「ブログ」や「記事」など(「ブログ記事」と例えます)が追加されます。
・「固定ページ」に「新規追加」をすると「固定ページ」が追加されます。
「固定ページ」と「投稿」の違いを(無理やり)要約すると下記です。
⚫︎「固定ページ」
・作った固定ページの数だけ、WEBサイトのページが増える。
⚫︎「投稿」
・「投稿」用に作る「固定ページ」は基本1ページのみです(「投稿」ページと例えます)。
・たくさん作る、投稿(ブログ記事)は、全部「投稿」ページに表示されます。
もう少し詳しく説明したのが下記です。
ややこしそうに見えますが、慣れるとすぐに理解できますのでご心配されなくて大丈夫です。
WordPressの 管理者メニュー | 「固定ページ」 | 「投稿」(ここに固定ページの「投稿」ページが紐づけられています) |
新規追加場所 | 管理者画面の左側の「固定ページ」を選択して開いた画面 | 管理者画面の「投稿」を選択して開いた画面 |
新規追加されるモノ | 「固定ページ」の「新規追加」をすると、追加するごとにWEBサイトの「固定ページ」が増えていく。 | 「投稿」の「新規追加」をすると、追加するごとにWEBサイトの「投稿」ページ内の「ブログ記事」が増えていく。 |
新規追加で作成した ページのタイトル | 「固定ページ」につけたタイトルは、WEBサイトのページのタイトルになる。 | ブログ記事につけた「タイトル」は、「ブログ」ページ内の「ブログカード」や「ブログのカテゴリー一覧」に表示される。 |
メニューとの関係 | 通常は、固定ページにつけた「タイトル」を「メニュー」項目に設定する。 通常、作成した固定ページの数だけヘッダーの「メニュー」の項目が増えていく。 | 「投稿」ページにつけたタイトル「(例)ブログ」が、ヘッダーの「メニュー」項目に設定される。 通常は、ブログ記事が増えても、全てのブログ記事は(ブログカードやブログのカテゴリー別などの表示で)、「投稿」ページ内に追加される。 |
表示される場所 | 「メニュー」から作成された「固定ページ」のタイトルを選択して表示させる。 | 「メニュー」から「ブログ」を選択して「投稿」ページを表示させる。 その「投稿」ページ内に表示されている、「ブログ記事」の「ブログカード」や「ブログのカテゴリー一覧」から「ブログ記事」を選択して表示させる。 |
「ブログ記事」にタイトル、テキストを追加する方法
投稿を「新規追加」する方法を説明します。
「投稿」の開き方
![WordPress管理画面002](https://yoshinobu.pro/wp-content/uploads/2023/05/cec7a4860c01d6c6d01f17efde9f334d-e1685514545802-wpp1685514587218.jpg)
WordPressの管理者画面の左側に、背景が黒色の「メニューバー」があります。
その中から「投稿」を選択します。
![WordPress管理画面投稿ページ画像002](https://yoshinobu.pro/wp-content/uploads/2023/05/36dc7ee828add51eb53fd5ffe4622b8c-e1685515088243-wpp1685515136513.jpg)
開いた画面の左上にある「投稿」の、右隣にある「新規追加」をクリックします。
![WordPress管理画面投稿ページ画像003](https://yoshinobu.pro/wp-content/uploads/2023/05/8a247669643013ad23a5e81cc49e28d8-e1685515294849-wpp1685515455262.jpg)
開いた画面のそれぞれの場所にテキスト(文章)を入力していきます。
入力する場所と、入力する内容は下記です。
入力内容 | 入力する場所 | 入力する内容 |
タイトル | 「タイトルを追加」 | ブログ記事のタイトルを入力します。 |
テキスト (文章) | 「ブロックを選択するには「/」を入力」 | ブログ記事の内容を入力します。 改行する場合は「シフト(shift)+エンター(enter)」キー (「シフト」を押しながら「エンター」を1回クリック)で改行してください。 「エンター」キーだけを押すとすると、新しい段落が作成されて、テキストの文章と文章の間に隙間が発生します。 文章の段落として隙間を1行分くらい開けたい場合は、「エンター」キーだけを押してください。 |
編集した内容を保存(確定)
![WordPress管理画面投稿ページ画像004](https://yoshinobu.pro/wp-content/uploads/2023/05/cb4dfeae32cda961a1c980f6f0c2af46-e1685515520528-wpp1685515552887.jpg)
編集が完了したら、必ず右上の「下書き保存」か「公開」をクリックします。
これをクリックしないと保存されないのでご注意ください。
(「下書き保存」のままだとWEBに公開されないので、完成したら「公開」をクリックしてください)
慣れないうちは、「更新」をクリックし忘れやすいので気をつけてください。
逆に、編集内容を保存しない場合は、ブラウザの「更新」ボタンをクリックしたり、「左上のメニューに戻るアイコン」をクリックしてください。
「ブログ記事」に画像を追加する方法
方法1:画像を追加する場所を選択して、 +
を表示させる方法
![WordPress管理画面投稿ページ画像005](https://yoshinobu.pro/wp-content/uploads/2023/05/60daea7847c8b71adf427266cc05ecc7-e1685515713131-wpp1685515753278.jpg)
文章の上や下のスペースの空白部分で、カーソルをゆっくり動かすと、「黒字に白十字」のマークが浮かび上がるのでそこをクリックします。
![WordPress管理画面投稿ページ画像006](https://yoshinobu.pro/wp-content/uploads/2023/05/d6d8a3ab48c4fcab1af1422817146133-e1685515894993-wpp1685585818388.jpg)
開いた画面の「すべてを表示」をクリックします。
![WordPress管理画面投稿ページ画像007](https://yoshinobu.pro/wp-content/uploads/2023/05/63636d67b10e82951c2e2f61fa49f38d-e1685585021564-wpp1685585049580.jpg)
「すべてを表示」をクリックすると、左側にメニューが大きく表示されます。
![WordPress管理画面投稿ページ画像008](https://yoshinobu.pro/wp-content/uploads/2023/06/ef983d02f5e337b749e18cce0c9aedb5-e1685586392149-wpp1685586472473.jpg)
検索ボックスに「画像」と入力します。
![WordPress管理画面投稿ページ画像009](https://yoshinobu.pro/wp-content/uploads/2023/06/f49d8dcdd488254e1795f23cae4ee553-e1685586545343-wpp1685586606573.jpg)
表示された「画像」のアイコンをクリックすると、画像を追加できるブロックが表示されます。
方法2:「ブロックを選択するには「/」を入力」から画像ブロックを追加する方法
![WordPress管理画面投稿ページ画像010](https://yoshinobu.pro/wp-content/uploads/2023/05/8a247669643013ad23a5e81cc49e28d8-1-e1685516302794-wpp1685516321458.jpg)
「ブロックを選択するには「/」を入力」に、カーソルを合わせて、「/」(スラッシュ)を入力します。
パターン1:表示された画面に「画像」がある場合
![WordPress管理画面投稿ページ画像011](https://yoshinobu.pro/wp-content/uploads/2023/06/7bdfdf9725fbec6b1cdef582492dc5e2-e1685585722174-wpp1685585763369.jpg)
表示された画面に「画像」があれば画像をクリックします。
![WordPress管理画面投稿ページ画像012メディア](https://yoshinobu.pro/wp-content/uploads/2023/06/9e4785fe09cba4d277dbed0aa4e060e6-e1685585611788-wpp1685586087848.jpg)
「画像」を追加できるブロックが追加されます。
パターン2:表示された画面に「画像」がない場合
![WordPress管理画面投稿ページ画像013メディア](https://yoshinobu.pro/wp-content/uploads/2023/05/1c45613403b685bac0052ab90e253d23-e1685516185398-wpp1685516220676.jpg)
上の画像のように、表示された画面に「画像」がない場合は、下記の方法で画像ブロックを追加します。
![WordPress管理画面投稿ページ画像014メディア](https://yoshinobu.pro/wp-content/uploads/2023/06/55a76b7ea025dd81372963b6b6475b39-e1685587257668-wpp1685587290624.jpg)
「/」(スラッシュ)の後に続けて「画像」と入力します。
![WordPress管理画面投稿ページ画像015メディア](https://yoshinobu.pro/wp-content/uploads/2023/06/30804a96c6c837fec85e75a4e9e4d557-e1685587391930-wpp1685587417207.jpg)
「画像」に関連するブロックが表示されるので、その中から「画像」をクリックします。
![WordPress管理画面投稿ページ画像016メディア](https://yoshinobu.pro/wp-content/uploads/2023/06/9e4785fe09cba4d277dbed0aa4e060e6-e1685585611788-wpp1685586087848.jpg)
「画像」を追加できるブロックが追加されます。
方法3:画面の左上にある「青地に白十字」から画像ブロックを追加する方法
![WordPress管理画面投稿ページ画像017メディア](https://yoshinobu.pro/wp-content/uploads/2023/06/03969799ecebd3db526dedf44f09b624-e1685587862698-wpp1685587888761.jpg)
画面の左上にある「黒字に白十字」をクリックします。
![WordPress管理画面投稿ページ画像018メディア](https://yoshinobu.pro/wp-content/uploads/2023/05/63636d67b10e82951c2e2f61fa49f38d-e1685585021564-wpp1685585049580.jpg)
「段落」や「見出し」などのメニューが表示された四角いウィンドウが表示されます。
「すべてを表示」をクリックすると、左側にメニューが大きく表示されます。
![WordPress管理画面投稿ページ画像019メディア](https://yoshinobu.pro/wp-content/uploads/2023/06/ef983d02f5e337b749e18cce0c9aedb5-e1685586392149-wpp1685586472473.jpg)
検索ボックスに「画像」と入力します。
![WordPress管理画面投稿ページ画像020メディア](https://yoshinobu.pro/wp-content/uploads/2023/06/f49d8dcdd488254e1795f23cae4ee553-e1685586545343-wpp1685586606573.jpg)
表示された「画像」のアイコンをクリックすると、画像を追加できるブロックが表示されます。
画像データの参照先を選択
![WordPress管理画面投稿ページ画像021メディア](https://yoshinobu.pro/wp-content/uploads/2023/06/b89b60b540d908f95e7adcf5ceb7069b-e1685589936832-wpp1685590004301.jpg)
「画像」ブロックの中に
「画像ファイルをアップロード」「メディアライブラリ」「URLから挿入」
を選択できる場所があります。
![WordPress管理画面投稿ページ画像022メディア](https://yoshinobu.pro/wp-content/uploads/2023/06/b89b60b540d908f95e7adcf5ceb7069b-1-e1685590277263-wpp1685590307739.jpg)
記載されている場所の下にある「アップロード」「メディアライブラリ」「URLから挿入」のうち
「アップロード」「メディアライブラリ」のどちらかを選択してください。
画像データの追加方法
画像データの追加の方法は、基本的に前述の
「画像(写真、イラストなど)の編集方法(作成・更新・削除方法)」
と同じですのでご参考にしてください。
編集した内容を保存(確定)
![WordPress管理画面投稿ページ画像023メディア](https://yoshinobu.pro/wp-content/uploads/2023/06/c4cd118ffb10b020565165452f3cae19-e1685597470262-wpp1685597501984.jpg)
編集が完了したら、必ず右上の「下書き保存」か「公開」をクリックします。
これをクリックしないと保存されないのでご注意ください。
(「下書き保存」のままだとWEBに公開されないので、完成したら「公開」をクリックしてください)
編集画面の右側に「設定」を表示させる方法
ここからは、ページの右側の「設定」を操作します。
最初に、ブログ記事の画面や、固定ページ画面で「設定」画面が表示されていない時に、表示させる方法を説明します。
![WordPress管理画面投稿ページ画像024](https://yoshinobu.pro/wp-content/uploads/2023/06/17152a6a0305cccaf19d4e9aa793b03d-e1685600872166-wpp1685600894646.jpg)
画面の右側の「設定」(赤枠線内部分)が表示されていれば大丈夫です。
![WordPress管理画面投稿ページ画像025](https://yoshinobu.pro/wp-content/uploads/2023/06/0b54eafc19ac8b6e8ce476be1e8d2837-e1685600848794-wpp1685600992211.jpg)
「設定」が表示されていない場合は、画面右上の四角枠のようなアイコンをクリックします。
(カーソルを当てると「設定」と表示される部分です)
「設定」アイコンをクリックすると、設定部分が表示されます。
画像のサイズを小さくする方法
![WordPress管理画面投稿ページ画像026](https://yoshinobu.pro/wp-content/uploads/2023/06/7c9602bca1688455f0620e2e724cb3f0-e1685597855889-wpp1685597916568.jpg)
サイズを変更したい画像を選択します。
画面の右側の「ブロック」タブをクリックします。
![WordPress管理画面投稿ページ画像027](https://yoshinobu.pro/wp-content/uploads/2023/06/b8bd4d95deceff6c058aa67650fde31a-e1685597985672-wpp1685598023575.jpg)
「画像の寸法」の場所にある、「25%」「50%」「75%」から縮小したいサイズを選択します。
![WordPress管理画面投稿ページ画像028](https://yoshinobu.pro/wp-content/uploads/2023/06/cece231c0b9f77eb0e94e59c9cc78600-e1685598143955-wpp1685598168497.jpg)
編集が完了したら、必ず右上の「下書き保存」か「公開」をクリックします。
これをクリックしないと保存されないのでご注意ください。
(「下書き保存」のままだとWEBに公開されないので、完成したら「公開」をクリックしてください)
「カラム」でレイアウトを2列にする方法
文章を2列や3列に分けたり、写真の隣に文章を書く方法を説明します。
レイアウトを2列や3列にするために「カラム」を追加して、それぞれのブロックに写真や文章を設置する方法です。
前述の画像の追加方法だけでは、画像が1列表示にしかならないので、写真の左右に文章(や画像)は配置できないです。
(画像の上や下に文章を追加することはできます)
「カラム」ブロックの追加方法
「段落」や「見出し」などのメニューが表示された四角いウィンドウを表示させます。
「ブログ記事」に画像を追加する方法」
と同じ方法です。
![WordPress管理画面投稿ページ画像029](https://yoshinobu.pro/wp-content/uploads/2023/06/82bb87f8f36e58c83e8305e856159a13-e1685598807581-wpp1685598832199.jpg)
検索ボックスに「カラム」と入力します。
![WordPress管理画面投稿ページ画像030](https://yoshinobu.pro/wp-content/uploads/2023/06/a166b786d2856aab5f5d9a3899683d8d-e1685599144890-wpp1685599189296.jpg)
アイコンの「カラム」をクリックします。
表示された、希望するカラムのレイアウトをクリックします。
![WordPress管理画面投稿ページ画像031](https://yoshinobu.pro/wp-content/uploads/2023/06/8cee388033c509f3daf56ef8c6d53987-e1685599285121-wpp1685599318999.jpg)
編集したいカラム(列)のブロックをクリックします。
ここでは「画像」を追加する画面で説明します。
なお、「画像」のブロックを追加する方法は前述の
「ブログ記事」に画像を追加する方法
を参考にしてください。
「カラム」のブロックに画像を追加する方法
![WordPress管理画面投稿ページ画像032](https://yoshinobu.pro/wp-content/uploads/2023/06/6ce6807318c6a18cc8afabc3b5768179-e1685599378860-wpp1685599425659.jpg)
追加する画像を選択します。
なお、画像を追加する方法は前述の
「ブログ記事」に画像を追加する方法
を参考にしてください。
![WordPress管理画面投稿ページ画像033](https://yoshinobu.pro/wp-content/uploads/2023/06/b33e4d2f8de2c66beaf942e2156eb5f8-e1685599719639-wpp1685599744586.jpg)
これで左側のブロックに画像が追加されました。
次に、右側のブロックに文章を追加する方法を説明します。
![WordPress管理画面投稿ページ画像034](https://yoshinobu.pro/wp-content/uploads/2023/06/d24ac8de9f92cbdd27eedb00aea6f873-e1685600099871-wpp1685600147634.jpg)
右側のブロックをクリックします。
表示された画面から「段落」のアイコンをクリックします。
![WordPress管理画面投稿ページ画像035](https://yoshinobu.pro/wp-content/uploads/2023/06/3902102b3ae166862c55c89894aaf6d2-e1685600201354-wpp1685600243606.jpg)
文章を入力します。
これで、「カラム」を使って画像の横に文章を表示するレイアウトができました。
編集が完了したら、必ず右上の「下書き保存」か「公開」をクリックします。
これをクリックしないと保存されないのでご注意ください。
(「下書き保存」のままだとWEBに公開されないので、完成したら「公開」をクリックしてください)
「ブログ記事」にカテゴリーを設定
カテゴリーの作成
※この部分は最初に作成して設定すれば、そのあとは触らない作業です。
他の人がWordPressを制作した場合は、基本的にここは設定済です。
「ブログ記事」のカテゴリー設定は、左側のメニューの「投稿」の中にある「カテゴリー」から設定します。
基本的に、最初にいくつかカテゴリーを設定していれば、あとは新規追加をしていくだけです。
詳しくは下記のWebサイトが参考になります。
カテゴリーの設定
「ブログ記事」を作成したら、その記事を上記で設定してあるカテゴリーに分類(設定)します。
![WordPress管理画面カテゴリーページ001](https://yoshinobu.pro/wp-content/uploads/2023/05/c7a6d9c3e84ef9a0e3f303850163925e-e1685601555143-wpp1685601715640.jpg)
ブログ記事の右側に「設定」が表示されています。
表示されていない場合は、画面の右側の上にある「設定」アイコンをクリックして、「設定」画面を表示させます。
「設定」アイコンの場所は
編集画面の右側に「設定」を表示させる方法
を参考にしてください。
![WordPress管理画面カテゴリーページ002](https://yoshinobu.pro/wp-content/uploads/2023/05/287cf21401194bd6cad06775293b6f6f-e1685602104336-wpp1685602137431.jpg)
「設定」画面の中の、「投稿」タブをクリックしますす。
「カテゴリー」の場所にある(事前に登録した)カテゴリーから、作成した「ブログ記事」に最も近い分類のカテゴリーを選択します。
編集が完了したら、必ず右上の「下書き保存」か「公開」をクリックします。
これをクリックしないと保存されないのでご注意ください。
(「下書き保存」のままだとWEBに公開されないので、完成したら「公開」をクリックしてください)
「ブログ記事」にアイキャッチ画像を設定
アイキャッチ画像の設定場所
![WordPress管理画面アイキャッチ001](https://yoshinobu.pro/wp-content/uploads/2023/05/b1e542de538f509a591913fe111f5b90-e1685602477556-wpp1685602507174.jpg)
ブログ記事の右側に「設定」が表示されています。
表示されていない場合は、画面の右側の上にある「設定」アイコンをクリックして、「設定」画面を表示させます。
「設定」の下の方にある、「アイキャッチ画像」の場所にある「アイキャッチ画像を設定」をクリックします。
![WordPress管理画面アイキャッチ002](https://yoshinobu.pro/wp-content/uploads/2023/05/c9c0ef7f54758e7279d44ab4e3acd2c0-e1685602748527-wpp1685602786973.jpg)
「メディアの選択またはアップロード」の画面が開きます。
そこから画像を選択して、右下にある「アイキャッチ画像を設定」をクリックして保存します。
この操作は前述の「画像(写真、イラストなど)の編集方法(作成・更新・削除方法)」もご参考にしてください。
編集が完了したら、必ず右上の「下書き保存」か「公開」をクリックします。
これをクリックしないと保存されないのでご注意ください。
(「下書き保存」のままだとWEBに公開されないので、完成したら「公開」をクリックしてください)
「ブログ記事」のスラッグの設定
ブログ記事を新規で作成した時に行う作業です。
※この部分は「ブログ記事」だけでなく「固定ページ」でも同じ作業をしますが、
「固定ページ」に最初に設定してあれば基本的にそのあとは触らない作業です。
逆に、「ブログ記事」を作成した場合は、毎回この部分の作業はしてください。
スラッグとは
インターネットの中のWEBサイトをブラウザで開いたときに、画面の上に表示されるURLの一部のことです。
このURLを最初に分かりやすいものに設定しておく必要があります。
①英数・記号の一部(アルファベットや数字、記号の一部)で設定します。
・設定しないと、設定した「タイトル」の日本語表示のままURLに表示されてしまいます。
そうすると基本的に日本語が英数記号に自動変換されて、見た目が非常に長く分かりにくいURLになってしまいます。
②分かりやすいスラッグにします。
・自分でも理解しやすいスラッグにすると、WEBサイトを見た方も分かりやすくなります。
③スラッグは基本的に変更しない。
・スラッグはそのブログ記事のURLの一部になります。
・GoogleなどのインデックスにURLが登録されると少しずつ閲覧されやすくなります。
が、スラッグを変えるとURLも変わるので、閲覧されやすさが再度一からスタートになります。
スラッグは最初に設定したら、ずっと変えないつもりで設定しましょう。
スラッグの場所
![WordPress管理画面スラッグ001](https://yoshinobu.pro/wp-content/uploads/2023/05/56166fd0408c5182df14c3598cde335d-e1685665756814-wpp1685665809668.jpg)
左側のメニューの「投稿」または、「投稿」の中の「投稿一覧」を選択します。
![WordPress管理画面スラッグ002](https://yoshinobu.pro/wp-content/uploads/2023/05/1c73687d2ad75c9182cf913addc41e74-e1685665904543-wpp1685665950487.jpg)
その中に、作成したブログ記事のタイトルの一覧が表示されます。
そのタイトルにマウスをあわせると(ホバーすると)、下に「編集」「クイック編集」「ゴミ箱へ移動」「プレビュー」が表示されます。
その中の「クイック編集」を選択します。
![WordPress管理画面スラッグ003](https://yoshinobu.pro/wp-content/uploads/2023/05/6b93cb099252c1b123af471a89171808-e1685666092423-wpp1685666153684.jpg)
「クイック編集」の画面が表示されます。
画面の中に「タイトル」「スラッグ」などが表示されます。
「スラッグ」の部分には、デフォルトで「タイトル」と同じ内容が自動反映されています。
![WordPress管理画面スラッグ004](https://yoshinobu.pro/wp-content/uploads/2023/06/1011d5b61673c23e5b647c6e680a4bbf-wpp1685680160178.jpg)
「スラッグ」はWEBサイトの「URL」の一部に反映します。
デフォルトの「スラッグ」は「タイトル」と同じですので、このままだと「URL」の一部は「タイトル」と同じになってしまいます。
![WordPress管理画面スラッグ005](https://yoshinobu.pro/wp-content/uploads/2023/05/0cc0ac6e00db9edc1ace74fbd32d47ab-e1685666291292-wpp1685666332766.jpg)
「スラッグ」の内容を、自分で入力して設定します。
「スラッグ」はURLの一部となり、変更しない方がSEO的に有利なので、適切なスラッグにしてください。
![WordPress管理画面スラッグ006](https://yoshinobu.pro/wp-content/uploads/2023/06/4425175486d1859ac61ae944cebd2978-wpp1685680878929.jpg)
変更した「スラッグ」がURLに反映されます。
![WordPress管理画面スラッグ007](https://yoshinobu.pro/wp-content/uploads/2023/06/5ee358ad697253e8550ae3932b1cdbec-e1685757594632-wpp1685757609429.jpg)
編集が完了したら、「更新」をクリックします。
これをクリックしないと保存されないのでご注意ください。
「ブログ記事」や「固定ページ」に「抜粋」と「メタディスクリプション」を入力
ブログ記事を新規で作成した時に行う作業です。
この入力は「ブログ記事」だけでなく「固定ページ」でも同じ作業をします。
「ブログ記事」を作成した場合は、毎回この部分の作業はしてください。
(「固定ページ」に最初に設定してあれば基本的にそのあとは触らない作業です)
最初に、「抜粋」と「メタディスクリプション」について説明します。
いろんなWEBにいろんなことが書いてありますが、要約すると下記だと思います。
・「抜粋」も「メタディスクリプション」もGoogle検索の順位には「直接」関係ない。
・でも、クリック率に影響がある。クリック率が上がると訪問数が増えるので、その結果Google検索の順位に影響する。
・だから「抜粋」も「メタディスクリプション」もきちんと入力しよう。
です。
下記のWEBサイトが分かりやすいので参考になります。
「抜粋」の入力場所
![WordPress管理画面メタディスクリプション・抜粋001](https://yoshinobu.pro/wp-content/uploads/2023/05/9c582ccf6026031d0196366b0e240780-e1685679518741-wpp1685679558268.jpg)
ブログ記事(または「固定ページ」)の右側に「サイトバー」が表示されています。
表示されていない場合は、画面の右側の上にある「設定」をクリックして、「サイドバー」を表示させます。
「サイドバー」の下の方にある、「抜粋」の場所にある「抜粋を入力 (任意)」に入力します。
![WordPress管理画面メタディスクリプション・抜粋002](https://yoshinobu.pro/wp-content/uploads/2023/05/f7f51afaa20c053ab231f2648b721e38-e1685679612473-wpp1685679633986.jpg)
入力する内容は、ブログ記事(または「固定ページ」)の要約です。
自分のWEBサイト内に表示される、ブログ記事の要約(ブログカード)に反映されますので、読まれる方の興味を惹く内容にしてください。
編集が完了したら、必ず右上の「下書き保存」か「公開」をクリックします。
これをクリックしないと保存されないのでご注意ください。
(「下書き保存」のままだとWEBに公開されないので、完成したら「公開」をクリックしてください)
「メタディスクリプション」の入力方法
メタディスクリプションを入力する方法は主に2つです。
①WordPressのソースのHTMLファイルに直接入力する
(コーディングが出来ないと難しい)
②プラグインを使って入力する
(「All in One SEO」や「Yoast SEO」など)をインストールして、ページ内で書き込む(初心者でも出来る)
なお、メタディスクリプションを入力しなくても、Googleなどの検索エンジンが自動生成します。
ただ、検索結果を見ている方に、自分のWEBサイトをクリック(スニペットをクリック)して欲しいので、基本は自分で考えて入力します。
「メタディスクリプション」の入力場所
ここではプラグインの「All in One SEO」のメタディスクリプションの入力場所を説明します。
![WordPress管理画面メタディスクリプション・抜粋003](https://yoshinobu.pro/wp-content/uploads/2023/05/34ea15ca84d3a3447045cee7b7b17e9d-e1685681203713-wpp1685681310691.jpg)
ブログ記事(または「固定ページ」)を開いて、下の方までスクロールします。
![WordPress管理画面メタディスクリプション・抜粋004](https://yoshinobu.pro/wp-content/uploads/2023/05/af17f7e2016acab8d1921263bae7059d-e1685681382607-wpp1685758035513.jpg)
そうすると、WordPressの標準的な画面の下に、「AIOSEO」という場所が表示されます。
これは、プラグインの「All in One SEO」をインストールしている場合に出てくる表示です。
![WordPress管理画面メタディスクリプション・抜粋005](https://yoshinobu.pro/wp-content/uploads/2023/05/6bb7a3f29aeaa5f5204e4a11e33a153c-e1685681504363-wpp1685681608810.jpg)
その中に「メタディスクリプション」を入力できる場所があります。
そこに手入力で文章を入力します。
「抜粋」と同じで、ブログ記事(または「固定ページ」)の要約を入力します。
「メタディスクリプション」の入力場所に、「投稿抜粋」や「投稿コンテンツ」などの「タグ」が自動設定されていることがあります。
そのタグの内容で良ければ、追加で入力不要です。
タグの前後に文章を追加したい場合は、タグの前後に文章を入力します。
なお、文章を全部手動で入力する場合は、そのタグを削除して、手動で文章を全部入力してください。
![WordPress管理画面メタディスクリプション・抜粋006](https://yoshinobu.pro/wp-content/uploads/2023/05/c38f27fca85e6a705d8e1be3a0e8278f-e1685681785352-wpp1685681841751.jpg)
Googleなどの検索結果に表示される、スニペットに反映されますので、読まれる方の興味を惹く内容にしてください。
編集が完了したら、必ず右上の「下書き保存」か「公開」をクリックします。
これをクリックしないと保存されないのでご注意ください。
(「下書き保存」のままだとWEBに公開されないので、完成したら「公開」をクリックしてください)
![WordPress管理画面メタディスクリプション・抜粋007](https://yoshinobu.pro/wp-content/uploads/2023/06/890d844e7848a204213bd982cda010d3-e1685682813384-wpp1685683051791.jpg)
「スニペット」がGoogleなどの検索結果で表示されている例です。
また、メタディスクリプションについて下記のWEBサイトが分かりやすいので参考になります。
![](https://yoshinobu.pro/wp-content/plugins/vk-block-patterns/patterns-data/images/pr_3.jpg)
お問い合わせ
ご依頼及び業務内容へのご質問などお気軽にお問い合わせください