WordPress【THE THOR】ブロックエディタどうやって使うの?簡単に説明♪

THE THORをインストールして、さあブログを書こうと思った時、ブロックエディタになっていると思います。

この記事では、このブロックエディタの使い方を紹介します。

直感的に使いやすいかというと、そこは以前からあるクラシックエディタに負けている点だと思います( ̄▽ ̄;)

このブロックエディタは使い方を始めにわかっていないと、残念なことに使いずらいのです。

でも、このブロックエディタは、ブロックごとにクラシックエディタにして使用することが出来ます♪

この使い多の記事、わかりやすく説明と思うと文が長くなるところが悩ましい所です(笑)

WordPress【THE THOR】ブロックエディタのブロックって何?

ブロックエディタは、見出しや文、画像をそれぞれブロックで管理します。

ブロック単位で管理できるので、このブロック消したいな~という時はブロック単位で消せます。

このブロックにかいた文章は、やっぱりもう少し下に表示させたいな~という時はブロックごと移動できます。

これは意外と使えます♪

ブロックエディタで出来ない事

これは文字に関してです。

私がイラッとしてしまうのが、ブロック内の1単語だったり、1文だけ文字サイズを変更できない事です。

ブロック内の1部の文字色や文字の背景色は変更できるのですが。。。。

この仕様をはやくなんとかしてほしいと思ってしまいます( ̄▽ ̄;)

文字に関しての細かい指定はクラシックエディタにして書くしかありません.

クラシックエディタに変更するやり方は後半で紹介しています(^^♪

 

WordPressブロックエディタ/ブロックの種類

見出し文と通常文はブロックの種類が違うという事を覚えておいてください。

書いてからブロックの種類を変更したいと思ったら、画像の赤丸の位置にマウスを近づけてください。

「q」のような文字から画像のように上下の矢印に変わりますのでクリックしてください。

選択画面が出ますので、変更したい種類の文字をクリックしてください。

これでブロックの種類が変更できます。

WordPressブロックエディタ/改行

改行するときは「Swift」キー押しながら「Enter」キーを押してください。

私は1行書いてエンターキーを押すとブロック追加になってしまうのは地味に使いづらさを感じました(-_-;)

1行ごとにブロックが違ってもいいのかもしれませんが、ブロックのメニューバー?が表示されるので私は邪魔でした。

私のようにブロックに付いているメニュバーが邪魔だと思った方は、何もない白い部分を「クリック」してください。

消えてくれます。

シフトキー + エンターキー = 改行

エンターキー = 改段落(新しいブロックが追加される)

ビジュアルエディタとコードエディタ変換は?

画面右上の端にある点が3個縦に並んでいるのをクリックして下さい。

表示一覧に「エディター」という項目があります。

「ビジュアルエディター」と「コードエディター」とあります。

ここで、自分の使いたいエディターをクリックすると変更されます。

もう1つの方法

「Ctrl」キー + 「Shift」キー + 「Alt」キー + 「M」 = エディター変更

どちらで変更しても大丈夫です。

WordPressブロックエディタ/画面左上のツールバー

5個の絵が並んでいます。

このプラスの部分をクリックすると、ブロックが追加できます。

矢印は、「戻す」「進む」これは感覚的にわかりますよね?

その横の「 i 」。

タイトル文と見出し文を抜きだしてコンテンツの構造を表示してくれます。

(文字数、見出しの数、段落数、ブロック数もここで分かります)

最後の横線3本。

「 i 」と違って文ではなく、「ブロックの種類」でコンテンツ構造を表示してくれています。

そして、自分が今どのブロックを、編集しているかわかりますし、自分が行きたいブロックをクリックすればその場所に飛ぶこともできます。

これは意外と便利♪

ブロックに付いているツールバー

「段落」ブロックのツールバー

一番左の「q」はブロックの種類を変更したい時にクリックしてください。

順番に段落の「行そろえの方法」、「大文字」、「斜め文字」、「リンク」、「▼」のボタンが並んでいます。

「▼」を押すと、「Inline Image」と表示されます。

この文字をクリックすると「メディア」の画面が表示されます。
ここで選択した画像はこの様にブロックに小さくなって入れることが出来ます。

これは挿入した絵をクリックして幅「50」にしてあります。

横の縦の点3個が並んでいるのは「詳細設定」です。

詳細設定の説明は省きます。

「見出し」ブロックのツールバー

一番左の「T」はブロックの種類を変更したい時にクリックします。

次に並んでいる「H2」「H3」「H4」は見出しの種類です。

横の数字が大きいほど「大」見出しなんだと思ってください。

その次のボタンは「段落」と同じになります。

ブロックの上側や下側にカーソルを近づけても⊕が表示されます。

そして、⊕の上にカーソルを近づけると「ブロック追加」と表示して教えてくれます。

上側の⊕なら、そのブロックの上にブロックを追加してくれますし、下側の⊕ならそのブロックの下にブロックを追加してくれます。

縦の点3個の「詳細設定」からもブロックの「上に追加」か「下に追加」を選択して追加できます。

画面右側の項目の説明

「文書」タブ

画面の中央とでもいえばいいのでしょうか。

何も書かれていない白い部分をクリックすると文書タブが選択できます。

又、画面左側の文書タブををクリックしても選択ができます。

「ステータスと公開状態」

ここで、コンテンツを公開するのか。

そして公開するなら、いつ公開するとするのかを設定できます。

「リビジョン」

「リビジョン」これは自分が書き直したものを保存してくれてある件が表示されています。

クリックしてみてください。

履歴が表示されます。

改稿したけど、やっぱり前に仕上げていた方が良かった気がするぞ!

という時に使用します。

パーマリンク

「パーマリンク」今書いているページのアドレスの最後の部分といえばいいのでしょうか。

その変更もここで設定します。

パーマリンクをクリックして見てみてください。

「URL スラッグ」に日本語が表示されていますか?

そんな時は、検索されやすいように英語に変更して保存することをお勧めします。

私はよく変更し忘れます・・・(;^_^A

「ブロック」タブ

画面のブロックをクリックすると、「ブロック」タブが表示されます。

これは「ブロック」の種類によって表示される項目が違います。

見出しブロック

「見出し」についたメニューバーよりも設定項目がおおいです。

・見出し設定


見出しのメニューバーでは「H4」までしかありませんが、ここでは「H6」までの設定できます。

・Text Color

「Text Color」では選択した状態の文字列の文字色、文字の背景色を変更できます。

・高度な設定

アンカーの挿入がここで出来ます。

ページ内でのジャンプの着地点が「アンカー」です。

私は、これがここにあることに驚きました。

「THE THOR」を使っているのですが、クラシックエディタだとプラグインを入れないと表示されないんです Σ(・ω・ノ)ノ!

「段落」ブロック

・テキスト設定

文字サイズ・文字の種類を設定できます。

・色指定

ブロックの背景色・文字色を変更でききます。

・Text Color

ブロック内の選択した状態の文字列の、文字色・文字背景色を変更できます。

【THE THOR】の「スタイル」を表示

記事を書くための、「ブロックエディタ」の基本となる情報を紹介しました。

次はTHE THOR(ザ・トール)の「スタイル」どこいった問題です(;^_^A

「スタイル」には「マーカー」や「ボックス」などがあって、無いと困ります。

下のリンクで紹介していますので、「Tiny MCE Advancecl」のインストールと設定までしてきてください。

アンカーの追加はしなくてもいいのですが、「スタイル」を表示するように設定してきてください。

>>>THE THOR ページ内リンクが使えるエディタにカスタマイズ

クラシックエディタでのスタイル復活まで終わりましたでしょうか?

次に、「ブロックエディタ」での使い方です。

ブロックの種類を「Crassic Paragraph」にしてください。

ブロックをクリックしてみてください。

ブロック内に「クラシックエディタ」が出てきます。

「スタイル」は表示設定した場所に表示されていると思います。

ここでちょっと注意。

マーカーはブロックごとになりますが、書き終わってからマーカーがいいと思います

ブロックを書き終わったら、ブロックに戻すか判断してください。

私はどうかなぁ・・・ブロックでそろえちゃうかも(゜-゜)

ブロックに変換後、エディターにマーカーは表示されていませんが、プレビューで見るとちゃんと表示されています(;^_^A

WordPress【THE THOR】ブロックエディタどうやって使うの?まとめ

「ブロックエディタ」と「クラシックエディタ」どっちがつかえばいいのか?

悩むところです。

「ブロックエディタ」に初めから書いていれば、このエディタが普通になるのでいいのかなぁとも思うのですが( ̄▽ ̄;)

結局、私はどっちも使ってます(笑)

 

【THE THOR】(ザ・トール)関連記事まとめ

【wordpress】プラグインを使って簡単に文章を囲み枠で装飾♪

文章を目立たせたい時にしようする囲み枠をプラグインを使って装飾する方法を紹介を紹介しています。

【wordpress】文章を囲み枠で装飾する簡単なやり方を紹介♪コピペOK

文章を目立たせたい時にしようする囲み枠をプラグインを使わないで装飾する方法を紹介をしています。

WPの有料テーマ【THE THOR】(ザ・トール)初心者でもわかるテーマの購入後の手順

【THE THOR】(ザ・トール)を購入してからの手順を画像を使って紹介しています。

WPの有料テーマ【THE THOR】(ザ・トール)初心者でもわかる着せ替えのやり方

【THE THOR】(ザ・トール)を購入したポイントにもなっているであろうスタイルの「着せ替え」機能のやり方を紹介しています。

WPの有料テーマ【THE THOR】(ザ・トール)初心者でもわかるページ内リンクボタンの設定

どんな記事が書いてあるのか始めに紹介したい時に使うアンカー。WPの有料テーマ【THE THOR】(ザ・トール)はデフォルトの状態のままだと使用できないので、これを使えるようにするためのカスタマイズ方法を紹介しています。

WPの有料テーマ【THETHOR】(ザ・トール)初心者でもわかる「プロフィール」の設定

【THE THOR】(ザ・トール)の固定ページを使っての「プロフィールページ」のプロフィールの書き方や作成方法を紹介しています。

WPの有料テーマ【THE THOR】(ザ・トール)初心者でもわかる自作ロゴ画像の作成から設定まで

【THE THOR】(ザ・トール)のヘッダーエリアのカスタマイズをしてロゴ画像を変更するやり方の紹介をしています。

WPの有料テーマ【THE THOR】(ザ・トール)初心者でもわかる「お問い合わせ」ページの設定

【THE THOR】(ザ・トール)の固定ページを使っての「お問い合わせ」ページの作成方法や返信文のカスタマイズの紹介をしています。

WPの有料テーマ【THE THOR】(ザ・トール)初心者にもわかる「プライバシーポリシー」ページの作り方

【THE THOR】(ザ・トール)の固定ページを使っての「プライバシーポリシー」ページに書く文章や作成方法を紹介をしています。

WPの有料テーマ【THE THOR】(ザ・トール)カスタマイズで改行設定

【THE THOR】(ザ・トール)の文章を読みやすくする為にCSSを使っての行間をあけるカスタマイズ方法を紹介しています。

WPの有料テーマ【THE THOR】(ザ・トール)初心者でもわかるメニューのカスタマイズ

【THE THOR】(ザ・トール)のロゴ画像の下にあるメニューバーのカスタマイズ方法を紹介しています。

WPの有料テーマ【THE THOR】(ザ・トール)サイドエリアの表示項目をカスタマイズ

【THE THOR】(ザ・トール)のサイドエリアの項目を自分好みにカスタマイズをする方法を紹介しています。

WPの有料テーマ【THE THOR】(ザ・トール)カテゴリページをカスタマイズ

【THE THOR】(ザ・トール)のサイドエリアに表示されている「カテゴリー」のカスタマイズの方法を紹介しています。

WPの有料テーマ【THE THOR】(ザ・トール)サイトマップを作成してカスタマイズ

【THE THOR】(ザ・トール)固定ページで訪問者用サイトマップを作製する方法を紹介しています。

【初心者専用】ブログで使いたいオリジナルのロゴ画像を作る説明

【THE THOR】(ザ・トール)のフェフォルト状態のままだと、デモサイトのロゴが表示されています。 自分のブログのロゴ画像を自分で作成するやり方を紹介しています。

ブログで使いたいフリーイラストとフリー写真のおすすめサイト6選

ブログで使う画像を無料でダウンロードさせてくれるサイト様の紹介をしています。

WordPress【THE THOR】ブロックエディタどうやって使うの?を最後まで読んでくださってありがとうございました。

 

ランキングに参加しているのでバナーをクリックしていただけると嬉しいです♪

人気ブログランキング

私が個人でAmazonアソシエイトに応募して落ちましたが、

「もしもアフェリエイト」を通して申請したら合格しました。 もしもから申請をお勧めします♪