ブロックエディタ使い方

【WordPress初心者】ログイン方法〜基本の記事投稿の流れを解説 | ブロックエディタ【図解あり】

Cinna

こんにちは、Cinna(シーナ / @web_cinna)です。

今回はWordPressのログイン方法から投稿の仕方を解説します。

この記事はホームページ制作を依頼いただいた担当者さんがwordpressを使うのが初めてということをきっかけに、読めば初心者さんでも簡単に投稿ができる記事を目指し執筆しています。

それでは、1つずつ丁寧に解説していきます。

管理画面にログインする

wordpressのサイトに記事を投稿するには、サイトを編集するための管理画面ページ(ダッシュボードといいます)にログインする必要があります。

それでは、管理画面ページにどうやっていくのかです。

まずは、管理画面ログインURLを確認します!

管理画面ログインURLの調べ方

wordpress管理画面ページのURL

https://〇〇〇〇〇〇〇〇/wp-admin

①水色の下線が引いてある「https://〇〇〇〇〇〇〇〇/」まではご自身のサイトのURLを入れてください。

②ご自身のURLのうしろにwp-adminと付け加えるだけです☻


<例>〜当サイトMeBeの管理画面ログインURLの場合〜

https://mebeblog.com/wp-admin

Cinna

ログインURLを忘れても、サイトURLのうしろにwp-adminとつけるだけだから簡単!

ログインする

1. 普段使っているブラウザ(chromeやSafari、edgeなど)で検索エンジン(Google やYahoo!)を開き、検索欄に管理画面ログインURLを入力
▼URLを入力してEnterをクリックするとこんなページにいきます。
2. 上段にユーザー名もしくは登録しているメールアドレス、下段にログイン用パスワードを入力
▼入力できたらログインボタンをクリック!

Cinna

サイトによって、少し表示される項目は違いますが、このように「ダッシュボード」に入れたらOKです!

投稿記事を作る

投稿画面に移動する

1. 「投稿」をクリックして投稿画面に移動
管理画面の左サイド(背景黒いところ)がメニュー一覧です。「投稿」ボタンは上の方にあります。
2. 投稿画面に移動したら、新しく記事を書く場合は「新規追加」をクリック
左側のメニューにも「新規追加」ボタンあるのでそっちでもOK

Cinna

このような画面に進めたらOKです!


今回はGutenberg(グーテンベルク)というブロックエディタ編集画面の使い方を解説していきます

※使っているテーマやプラグインによって表記は少し変わります。

wordpressの投稿は「Gutenberg」と「Classic Editor」という2種類があります。

【Gutenberg】ブロック型に記事を作っていきます。レイアウトが簡単にできます。
【Classic Editor】wordのように記事を書けるので、文章がメインだと使いやすい。

タイトルを入力する

「タイトルを追加」をクリックすると文字を入力できます
▼記事のタイトルを入力してください

本文を入力する

「文章を入力、または / でブロックを選択」のところをクリックすると文字が入力できます。
▼ 冒頭の挨拶などを入力しましょう
「文章を入力、または / でブロックを選択」の表記がない場合
▼ +ボタンをクリックします
+ボタンをクリックすると追加ブロックメニューが表示されます
▼ メニューから「段落」をクリックします。

カーソルが出て文字が入力できるようになるので、記事の最初は挨拶文などを入力しましょう!

画像を挿入する

+ボタンを押してメニューを表示、さらに「すべてを表示」をクリック
▼ 左側に追加ブロックメニューの一覧が表示されます

「画像」をクリックします
▼ 続いて「アップロード」をクリックします

パソコンのファイルから挿入したい画像を選択
▼「開く」ボタンをクリック
Cinna

画像はうまく表示されましたか?

「文字の入力」と「画像の挿入」ができれば、ひとまず記事は作成が可能です!

文字の大きさを変えたり、マーカーを引いたり、吹き出しやボックスの作り方など投稿記事の装飾の仕方は別の記事で解説していきます!!

投稿記事を公開する

公開の準備をする

公開前に記事の設定を行います。まずは記事の設定欄を表示しましょう!

① 設定ボタン(風車マーク)をクリック
▼設定メニュー一覧が表示されます
② 右サイドのメニューから「投稿」をクリック
▼ この記事の詳細設定がここでできます
Cinna

これで各設定が行えるメニューが表示されます!

URL(パーマリンク)を設定する

①「下書き保存」をクリック、パーマリンク設定を表示
※入力欄が隠れている場合は、パーマリンクvをクリックすると表示されます
② URLスラッグ欄に英数字を入力する
記事タイトルを英語やローマ字に変えたものを入力しよう

URLスラッグは日本語だと文字化けするので必ず英数字にすること

カテゴリーを選ぶ

記事のカテゴリーを選ぶ
▼ カテゴリーは複数選べますが、なるべくシンプルにしましょう

アイキャッチ画像を設定

「アイキャッチを設定」をクリック
▼ 画像を選ぶ画面に移動します
①ファイルをアップロード②ファイルを選択▶︎パソコンの画像を選択
▼ アイキャッチにしたい画像を選択して「開く」をクリック
①画像を選択②アイキャッチ画像を設定をクリック
▼ アイキャッチ画像の設定が完了です

記事を公開する

右上の「公開」ボタンを2回クリックする
▼ 「公開」を1回クリックすると確認画面になるのでもう一度「公開」をクリック
Cinna

お疲れ様でした!記事投稿の基本はコレで大丈夫です!
その他の設定項目は徐々にやっていきましょう♪

右上の「プレビュー」ボタンを押すと、実際の記事がどのように表示されるか確認することができます!公開前にプレビューで確認をおすすめします。

公開後も記事を編集が可能です!編集をした場合は右上「更新」ボタンを必ずクリックしてください!「更新」をしない限りは変更は公開されていません。

管理画面の投稿一覧に戻り方

左上のWマークをクリックすると管理画面に戻れます
※Wマークじゃない場合もありますが、左上の黒の四角をクリックします

いかがでしたでしょうか?
かなり細かく解説したので長くなりましたが、一度記事を投稿してみれば全く難しくはありませんのでご安心ください!ツールやメニューの位置を覚えたら説明書がなくても制作できるかと思います☻

Cinna

wordpress記事投稿の基本編でした!その他の設定や装飾は別記事で紹介するので少しづつ慣れていただければと思います!!

▼VK Blocksの機能を使いながら簡単にサイト型ホームページが作れるWordPressテーマ

Vektor WordPress Solutions

▼MeBeはConoHa WINGレンタルサーバーを使用しています😇

ABOUT ME
Cinna
Cinna
8年間働いた会社を辞めて2年間のwebデザイン長期職業訓練[長期高度人材育成コース]へ 2019年入学▶︎2021年終了 訓練終了後フリーランス 退職後にこれまでの生活を見直し、敏感肌、アレルギー体質を改善するため、肌断食と食事と運動による身体メンテナンスを自分の身体で実験中。体験談をレビュー。