Diver入力補助「囲い枠」の使い方を徹底解説！

ばにら営業部長

こんにちは。今回はDiverの囲い枠について解説します。

この記事はWordPressのテーマDIVERの入力補助機能「囲い枠」の使い方を解説しています。

これからWordPressを始めてテーマをDIVERにしている方が使い方の参考になるようレビューしています。

今回は「囲い枠」を使った記事をどんな風に書けるのかと記事中でどのように使うのかをレビューします。

DIVER入力補助「囲い枠」の種類

囲い枠とはそのなの通り文書を枠で囲っている機能です。

目立たせたい部分や強調したいところなどを枠で囲って見やすくする演出です。

それではどうゆうものか見てみましょう。

まずDIVERの入力補助機能「囲い枠」の種類ですがWordPressエディター「Gutenberg」では6種類あります。

これで通常の文書よりも目立つことが出来ますね。上の「囲い枠その１」の部分がタイトルになります。

そしてテキスト部分は文書以外も入力が可能なため結構便利な使い方が出来ます。

テキスト以外の使い方はURLを埋め込んだりショートコードを埋め込んだりと普通のブロック同様に使えて便利です。

上の囲い枠は上側部分全体がタイトル欄になっています。

上の囲い枠は下側がタイトル部分になっています。

上の囲い枠は左上部分がタイトル部分です。

上の囲い枠は枠線自体にタイトルが入っています。

上の囲い枠はタイトル部分がなく囲い枠ののみになっています。

DIVERの「囲い枠」の色設定

枠線色の設定

囲い枠の枠線の色は11種類＋カスタムカラーが選べます。

この色を枠線に設定することでテキストを強調することが可能になります。

カラー設定の枠線は自分の好きな色をクリックすればすぐにその色を設定可能です。

また出先でブログを更新する場合などiPhoneで作業する場合も枠線の設定と色を変更する作業はサクサク行えます。

iPhoneの場合は設定画面に切り替えて作業する必要があります。

背景色の設定

背景色を設定すれば囲い枠をさらに強調することが可能です。

しかし設定する色によっては明るいイメージと暗いイメージになるため気を付けて設定する方が良いです。

このように背景色によってかなり目立たせることが可能です。特に強調したいところなどで使えます。

DIVER入の力補助機能「囲い枠」の使い方「gutenberug」ブロックエディターの場合

DIVERの入力補助機能「囲い枠」の便利な使い方もご紹介します。

使い方は簡単でブロックエディターの場合はブロックの選択で囲い枠を選択して枠線を選ぶだけです。

その後、枠線の色設定やタイトルを入力して最後にテキストを入力するだけです。

ここでいくつかの使い方をご紹介します。

まず私が良く使うのが他のページのリンクを貼る時にURLを囲い枠の中に埋め込みます。

下記の画像のようにすれば簡単にリンクを貼ることが出来ます。

囲い枠にURLを埋め込むと下記のようにページを貼れます。

囲い枠を使ってURLを貼ろう！

WordPressが難しいと思う初心者がブログを始めるためにやること10選！

2020.9.3

WordPressを今から始めようと考えている方にWordPressを始める場合の流れを詳しく解説。初心者がWordPressを始めるためにどのようにしては始めたのか？実際に私が行...

もう１つご紹介します。下の画像は「会話」を囲い枠の中に入れています。

囲い枠の中には全てのブロックを表示させることが可能です。

実際には下の画像のようになります。囲い枠の中でだけ会話をしているように設定出来ますね。

囲い枠に会話を入れています。

バニラ

囲い枠の中に会話を入れているよ。

囲い枠にの中にはテキストやURLの埋め込み、動画の埋め込みなどあらゆるブロックを埋め込むことができるため普通にブロックを使うのと同じように囲い枠を使うことが可能です。

まとめ

DIVERの入力補助機能「囲い枠」はブログまたはサイトの目立たせたい部分を枠で囲って表示させる便利な機能です。

使い方によって目を引くような鮮やかな色にしていればブログを訪れた方も見てしまうことでしょう。

アピールしたいものや目立たせたいものに便利に使えます。

囲い枠はどのタイプが良いのかは使う方の好みで自由に選べて６種類の中から自分のブログにあったものをチョイスすればオリジナル性も高くなります。

合わせて読みたいDiver入力補助まとめ

[WordPress] Diver入力補助の使い方まとめマニュアル！[Gutenberg]編

2020.9.1

ばにら営業部長こんにちは！ばにら営業部長です WordPressテーマDiverの入力補助機能を解説しているコンテンツはたくさんあるけどいまいちわからない事ってありますよね。 それ...