格安ホームページ制作のことならスマホームページにお任せください。
低コストで高品質なスマホ対応ホームページをご提供します。

ブログ

WP投稿画面 〜テキストエディタの使い方〜

WP投稿画面 〜テキストエディタの使い方〜

前回の画面構成の際の[3番 エディタ]の使い方編です。
WordPress投稿画面の説明

注意

実際に投稿した後の色や太さなどの表示のされ方は、お客様により異なります。
[こんな感じ] サンプルは、あくまでスマホムの場合です。
エディタ上部のボタンは、今後入れ替わる場合があります。
スマホムのお客様向けのため、通常のWordpressとは若干ボタンの種類が異なります。

テキストエディタ

テキストエディタのボタン群

初めにエディタの右上にあるタブが [テキスト] が選択されている事を確認してください。
確認できましたら、入力画面に内容を入力していきます。
入力画面上の改行は、公開されるページでもそのまま反映されます。
改行を2回行うと、段落が分かれます。

長文などを入力する際に、見出しや太字などで強調表現をしたい場合がでてくると思います。
そんなときに、上部にあるボタンを使います。

区切り線
これは単独で使います。区切り線を入れたい箇所にカーソルを合わせボタンを押すと、<hr>となり、投稿後の実際の表示はこんな感じになります。↓


その他のボタンは、適用したい文字列を選択して使います。
選択し忘れた場合、ボタン名に /(スラッシュ) がつきますので、本来の選択範囲の終わり部分にカーソルを合わせて、同じボタンを押してください。

h2
見出しに使います。

h3
小見出しに使います。※[h2]より後しかつかってはいけません。

b
強調表示されます。こんな感じ

i
少し強調表示されます。こんな感じ

big
少し大きな文字で表示されます。 こんな感じ

small
少し小さな文字で表示されます。こんな感じ

link
リンクを挿入したい場合これを押すと、ウィンドウが立ち上がります。
リンク挿入画面のサンプル
URLにリンク先のURLを入力して、リンク文字列に表示する文字を入力します。
別のウィンドウで開いて欲しい場合には、[リンクを新しいタブで・・]にチェックを入れます。
これがサンプルです→ Google

b-quote
引用する際に使います。

こんな感じ

ul ol li
これは、リスト表示したい場合に使います。
使い方が少し特殊になります。
中黒リストの場合 ul を、連番付きリストの場合 ol を使います。
箇条書きの場合、ulol どちらかを押し、次に li を押して1項目目を入力。
入力終わったら、/li もう一度、li を押して、2項目目を入力終わったら /li を押す。
必要分入力が完了したら、/li のあとに、初めに入力した、ulol の /(スラッシュ)がついてるボタンを押す。
これで完了です。
li を押した際に、入力画面上では左に空白が入りますが実際の表示では空白はありませんので、無視しも大丈夫です。

  • ulの中黒はこんな感じ
  • ulの中黒はこんな感じ
  1. olの連番はこんな感じ
  2. olの連番はこんな感じ
  3. olの連番はこんな感じ

Youtubeの貼り付け方

Youtubeを貼り付けたい場合は、まず動画の埋め込みタグを取得する必要があります。
埋め込みタグの取得方法について・・・

Youtube埋め込みタグ取得方法

Youtube埋め込みタグ取得方法2

  1. Youtubeのサイトで動画を表示し、動画下にある共有をクリック
  2. 開いたウィンドウの埋め込むをクリック
  3. <iframe ではじまるタグと呼ばれるものを丸っとコピー
  4. これを投稿画面に貼り付け
  5. 最後に貼り付けた部分を選択し、上部の[Youtube] ボタンをクリックしてください。

↓こんな感じになります。

入力サンプル

テキストエディタ入力サンプル

一通りのボタンを使った入力サンプルがこんな感じです。
特にリストが複雑になるため、実際の表示がうまくいかない場合などに参考にしてください。

繰り返しになりますが、注意点です。
実際に投稿した後の色や太さなどの表示のされ方は、お客様により異なります。
[こんな感じ] サンプルは、あくまでスマホムの場合です。
エディタ上部のボタンは、今後入れ替わる場合があります。
スマホムのお客様向けのため、通常のWordpressとは若干ボタンの種類が異なります。

WP投稿画面 〜テキストエディタの使い方〜

この記事を気に入っていただけたらいいね!フォローをお願いします!