ブログ作成講座6-2 WordPressテーマ cocoonで囲い枠で改行をする方法とは?

ブログ

ブログを書く場合、例えばポイントとかを囲み枠で作成すると見易いですよね。今回は、囲み枠の作り方を説明します。

そして、意外と改行ができないという人もいるので、改行の方法も説明したいと思います。

WordPressテーマ cocoonで囲い枠を作る方法

では、囲み枠の作り方について説明したいと思います。

今回は例として

まず、

囲み枠を使う事でブログが見やすくなる

という文言を囲み枠で表現してみます。

STEP1 囲み枠を作るにはクラシックを使う

まず、ブロックからクラシックを選びます。

もし+を押した時にクラシックが表示されていないなら、検索窓からクラシックと入力して検索してください。クラシックを選ぶとこのような感じになります。

STEP2 ボックスを選ぶ

スタイルを選ぶと色々と出てきますが、この中のボックスと書かれたものが囲み枠になります。色々と種類があるので、ぜひご自分でお気に入りを見つけてください!

今回は白抜きの赤枠でやってみます。

そうすると、このような感じになります。

STEP3 枠の中に文書を書いて完成!

赤枠ができていますよね。あとは、赤枠の中にカーソルを持っていき、記入したい文言を入れます。

これで完成です。↓これが実際のものです。きちんと枠ができていると思います。

囲み枠を使う事でブログが見やすくなる

うまくできたかどうか不安な場合はプレビューで確認でも良いかもですね。プレビューで確認するとこのような感じです。

これで完成です!次は、この囲い込みの中で改行をさせる方法について説明したいと思います。

WordPressテーマ cocoonで囲い枠で改行をする方法

次に囲み枠の中で改行をする方法について説明します。これは少し工夫が必要です。

今回は、例として

・ポイントなどは囲み枠を使えば見やすくなる

・いくつかポイントがある場合は囲み枠で改行を使うことで見やすくなる

こちらの文言を入れてみたいと思います。

STEP1 クラシックを選ぶ

クラシックを選びましょう。選ぶとこのような感じになります。

STEP2 改行してからリストを出す

次が少し分かりにくいです。クラシックを出した後に、一度改行をしてからリストを出します。この改行という意味が最初わかりにくい可能性もあるので、以下のようにまずはやってください。クラシックを出したあとに、改行と書いてエンターキーを押します。そして、リストを選んでそこで書いていく。最後にまた改行をします。ちょっとわかりにくいと思いますが、以下に手順を図で説明します。

改行は今回は例として改行と書きました。改行と書いたらエンターキー((改行させて下さい)そうするとこのような感じになります。

わかりにくいかも知れませんが、改行と書いた下に1つ段落が出ます。この状態からリストを選びます。

・が出たら、そこに文章を入力して、入力したら改行(エンターキー)しましょう。

このような感じで文章を書きます。今回はこの2つの文章を入れたいので、これで終わりです。もう一度エンターを押すとこのような感じでもう一つリストが出ます。

3つ目のリストは不要ですよね。こうなったらもう一度エンターキーを押すと消えます。

消えたら、そこにもう一度改行と書きましょう。

このようになったら、上の改行から下の改行までをドラッグして選びます。

選んだ状態で、スタイルから囲み枠を選びます。

今回はボックス(白抜き)から赤色を選びました。そうすると、このような感じになります。

次に、下の改行のところにカーソルを合わせてバックスペースで消していきます。文章を消した後に、もう一度バックスペースをすると下の枠が消えます。

この状態でもう一度エンターを押すと一番下の枠が消えます。

次に上の枠の改行を同じように消していきます。

上の枠に関しては、deleteキーを押すと消えます。

消えて、このような感じでリストの赤枠だけが残りました!

  • ポイントなどは囲み枠を使えば見やすくなります。
  • いくつかポイントがある場合は囲み枠で改行を使うことで見やすくなります。

これで囲み枠でリストが完成になります。以上になります!

コメント

タイトルとURLをコピーしました