2019年2月13日ツイートシェアB!はてブポケットWordPressの、便利そうでいまいちよく分からなくて使いこなせないビジュアルエディタ。今回は、WordPressのビジュわアルエディタを最低限使いこなせるように使い方を紹介していきます。便利だと思って採用してる機能ですから使えたほうが便利なのは間違いありません。WordPressはテキストエディタに「TinyMEC」を採用しており、賛否はありますが、今のところ変更するといった話はありません。今後もWordPressを利用していくつもりなら、苦手な感情をなくして置いたほうが、よっぽど有意義だと思います。【追記】WordPress5.0からTinyMCEに代わりGutenbergが標準エディタとなりました。Advanced」をインストールしましょう。デフォルトの状態だと操作に一手間二手間かかってしまうため少しずつイライラが溜まっていきます。Advancedで検索」→「インストール」インストールしたら「有効化」してください。Advancedの設定を行います。ご自身のお好みで良いのですが、分からない方はわたしのおすすめを参考にして設定してください。Advanced」を選択。追加したいボタンをドラッグ&ドロップで追加していきます。ご自身のおこのみで選んでいただければ結構です。list番号付きリスト左寄せ中央揃え右寄せ引用リンクの挿入/編集ブロックを表示テーブルただし、「ブロックを表示」だけは今後の説明でも使いますので必ず入れてください!オプションのチェックオプションが幾つかあります。sizes」にチェックを入れています。Options」は、ulやolのリスト形式の選択で、四角やギリシャ文字などドロップダウンリストから選べるようになります。sizes」は、記載されているフォントサイズを選べるようになります。その他はデフォルトのままで結構です。Advancedをインストールしたところで、実際にビジュアルエディタを使っていきましょう!基本的にはわたしのやり方を紹介する感じですが。ブロックを表示ボタンをクリックブロックを表示ボタンをクリックします。すると、どの部分がどの要素のタグで囲まれているかが一目瞭然になります。ビジュアルエディタのイライラするポイントの1つに、いまどのタグを操作しているのかが分からないということが挙げられます。H2タグを設定してEnterを押して次の文章を書こうとした時に、H2が継続されているのか、それともP要素として書けているのか判断しにくいですよね。ブロックを表示してやると、Enterを押した時に、カーソルがどこにあるかで今編集している要素が直感的に分かるようになります。ビジュアルエディタで編集するときは、ブロックを表示させないととてもじゃないけど作業できません。ビジュアルエディタをそのまま使うなんて、将棋で言うところの目隠し将棋をしているようなものです。Enterを押した時のルールを理解するブロックを表示させてあげるだけでビジュアルエディタでの作業効率は格段にアップするはずです。一つ、Enterを押した時の挙動を押さえておけば、もうWordPressのTinyMECを攻略したと言っても過言ではないでしょう。P要素でEnterP要素でEnterを押した場合の挙動は、P要素が複製され次のブロック要素にカーソルが移ります。具体的に動作を見てみましょう。以下はP要素の最後にカーソルがある状態です。Enterを押してみましょう。P要素が複製され、複製されたP要素の方にカーソルが移っています。6要素でEnterHタグでEnterを押した時の挙動はPタグと異なります。実際に見てみましょう。H2要素の最後にカーソルがある状態です。Enterを押してみましょう。H2要素が複製されるのではなく、P要素が複製され、複製されたP要素の方にカーソルが移っています。H2タグを作った後にまたH2タグ作る人は通常はいませんもんね。TinyMECでもHタグの見出しの後は、P要素ですぐに文章を書けるような設計になっているんだと思います。ブロック要素の途中でEnterブロック要素の途中でEnterを押した場合は、P要素もH2要素も関係なく同じ挙動になります。Pタグの途中にカーソルがある状態でEnterを押してみましょう。同じブロックの要素が複製され、カーソル以降の文字が複製先のブロックに移動します。これはP要素だけの話ではなく、H2やH3、blockquoteなどブロック要素であれば同じ挙動になります。ブロック要素の切り替えP要素やH2要素などのブロック要素は、1クリックで簡単に切り替えることができます。ブロック要素のどこかにカーソルを置きます。この状態で、H2などのブロック要素を押してみましょう。ブロック要素ごと切り替わるのが分かるはずです。H2からH3、など見出しのレベルの切り替えで使うことが多いです。ブロック要素内で改行Enter押すと次のブロックを生成して移ってしまうので、改行どうするんだよ・・・って最初は誰もが思うはずです。この時コードとしては、タグが挿入されます。ブロック要素の文章の途中にカーソルを置きます。Enterを押すと、改行されます。P要素以外の他のブロック要素(H1~6、blockquote、pre)などでも同様に改行されます。インライン要素をあてる次は、太文字や文字色、リンクなどのインライン要素のあてかたです。インライン要素をあてたい文字をドラッグしてボタンをクリックすることで適応されうようになります。インライン要素をクリックと要素が適応されます。@haniwa008以上、ビジュアルエディタの使い方でした。P要素やH要素で記事の構成を作っていき、太文字や背景色、リンクなどインライン要素で彩りをつけていくようなイメージで作っていくと作りやすいと思います。ビジュアルエディタを使えると装飾の効率が大きく変わってきます。リンクこのページが役に立ったらいいね!お願いします運営の励みになります...。Syn...前の記事Eclipseにサブバージョン(SVN)を導入する方法とWordPressプラグイ...はにわまんWordPressが好きなフリーのWebコーダー。300件以上のWordPressカスタマイズを対応してきました。