WordPress「Diver」を使って見て、特に便利だな、と感じる機能が「入力補助」。
ショートコード不要で記事の装飾ができるから、「ショートコードって？タグって何？」という初心者でも使いやすいんですよね。
記事内に画像を二つ並べたい、会話風に装飾したい、ランキングを作成したい。
ブロガー、アフィリエイター必須のアイテムが、CSSやPHPを触らなくても使える入力補助機能でできることをまとめました。
Diverの入力補助で出来ること・装飾一覧
Diverの入力補助で出来る装飾は23種類。（Ver4.6.6時点）
記事の構成上、見出しが必要になるケースは多いけれど、通常は初期設定済のタグ（h2～h5）を挿入するだけでカスタマイズしたデザインが反映されます。
入力補助の見出し機能を使うと、そのページだけ見出しデザインの変更が可能。
また、見出しではないけど見出しっぽくしたいという際にも使えます。（タイプを「Div」にする）
ボタン（コンバージョンボタン、CVボタン）は販売ページなどへのリンクを設置することができます。
自分でテキストを設定してリンク先URLを埋め込む方法と、ASPなどの広告タグを埋め込む方法があります。
デザインも13種類（四角：7種類、丸：6種類）あり、カラーは定番カラー選択orカスタムも可能。
アイコンの設置、配置の調整、大きさの選択も入力補助だけで設定できるのは嬉しい。
よく使用するCVボタンは共通コンテンツを使用することで更に管理も楽になります。
バッジは文章の冒頭につけることで、アクセントとして注目させる効果が期待できます。
fa-thumbs-o-upPOINTテキストの前後にアイコンを挿入することもできます。
囲い枠は、記事で注目させたいテキストやリストを、枠で囲って目立たせることができます。
この記事でわかること
②入力補助の使い方や表示の確認
↑上のようにタイトルを付けたりアイコンを入れたり、またはリスト表示にしたり、罫線をつけるなどの装飾もできます。
枠や文字色はボタン同様に基本カラーより選択orカスタムが可能。
枠内のテキストは、エディタと同じように入力できるので、マーカーや太字などの装飾も簡単ですね。
見出しを使うほどではないけど、この記事内容と次の記事内容を線引きしたい、という時に便利な区切り線。
同じ見出し内でコンテンツを区切ることができます。
線の太さ・色・スタイル（一本線・点線・二重線）をカスタマイズできます。
通常のシンプルな黒丸がついたリストを、可愛く装飾してくれるリストデザイン。
リストを使うにはタグの知識が多少必要になりますが、箇条書きリストならulタグ、順序付きリストならolタグを使う事を覚えておけばOK。
テキスト欄を記述する際は、ul→【li→りんご（リスト内容）→li】【li→いちご（リスト内容）→li】【li→みかん（リスト内容）→li】→ulという流れになります。
順序付きの場合はliで囲ったリスト項目全体をolで挟みます。
色もデフォルトの基本カラーorカスタム可能。
Diverでは、FontAwesomeのアイコンが使用できるようになっています。
（↑アイコンの一部です。まだまだあります）
例えば外部リンクを貼る場合に、fa-external-linkマークを付けたり、注意fa-exclamation-triangleやお知らせfa-commenting-oなどのワンポイントになりますね。
グリッドレイアウトは、記事内の分割表示ができる機能です。
記事内で横2等分にしたり、比重を変えた分割も可能。
横2分割を使えば、ボタンや囲い枠を横並びに配置することもできます。
レイアウトオプションの【画面サイズが小さい時に、グリッドレイアウトを解除する】にチェックを入れておくと、スマホ表示などでは横並びが解除されます。
引用文だけでなく、引用元タイトルと引用元URLの入力も簡単にできるのでとても便利。
トラネコ（虎猫）とは、トラのような縞模様を持つネコのことである。タビー(tabby)とも呼ばれる。トラ猫はストライプの他に、縞模様が途切れて、斑模様、薔薇班、細かく縞模様を途切れさせてたもの等があり、多様である。
AMPは簡単に言うとモバイル表示の高速化です。
高速化する代わりにルールが設けられているせいで、デザイン崩れやエラー表示になることがあるのですが、それを防ぐためにAMP表示の際にはこっちのコンテンツ（amp対応コード）に変更する、といった使い方ができます。
横棒グラフは簡単な統計結果などをグラフで表現できる機能。
なんの？なんのデータなの？
吹き出しは会話機能とは別で、テキストを吹き出しで囲むことができる機能です。
グリッド機能と併用すれば、大きな画像に吹き出しを付けることもできます。
やっぱり女子だけっていうのも楽しいよね！好きなものを食べられるし、かわいいカフェにも行けるもの。あー、女子最高！
雑な使い方してるな…
口コミ評価を★マークとコメントで見栄えよく表示できます。
評価も小数点が設定できるので、4.5と入力すれば、★4.5つ分で表示。
初めての有料テーマ
サポートが丁寧なのも助かります。
当ブログでもお馴染みの会話機能。吹き出しとは違って、アップロードした画像をアイコンとしてセットで表示できます。
右から、左から、心の声風、吹き出しのカラー変更なども、入力補助内で設定できます。
プラグインを使うとより簡単に使用できるので、こちらも参考にどうぞ↓
アフィリエイターに必須のランキング機能も、簡単に作成できます。
ランキング順毎に作成します。★評価や説明文、画像の挿入も入力補助内でできます。
リンクボタン（購入ページ/詳細ページ）の挿入も簡単ですね。
ランキング機能まで使わなくても、簡易的なレビュースコア（★表示）を付けることができます。
サイズも大・中・小選べて、中でこれくらいです↓
レビュー表を使うことで、テーブル内にスコアを付けることができます。
フルサイズ・ハーフサイズを指定しての作成が可能です。
| きじとらグッズ |
|
||
|---|---|---|---|
| ちゃとらグッズ |
|
||
| ブルーグッズ |
|
||
| はちグッズ | 完売御礼 | ぶちグッズ | 入荷待ち |
画像の拡大などによく利用されるポップアップですが、画像ならWordPressの機能を使うこともできます。（添付ファイルの表示設定でリンク先をメディアファイルにする）
が、このポップアップ機能を使うと、文章もポップアップにできてしまいます。
↓ポップアップ設定してます。クリックするとどう表示されますか？
ただ、テキストをポップアップする使いどころが見つからないのですが…
Q&Aの使い方・機能はとてもシンプル。
質問と回答を文章で入力するだけです。
そうなんだ…
カスタマイズCSSなどを紹介している当ブログでは必須機能なんですが、HTMLやCSSのコードを直接記述してしまうと、【コード】として読み込まれるので、うまく表示ができません。
コード機能を使うことで、プラグインなしで記事内にコードの記述をすることができます。
トグルでは、一部のコンテンツを非表示にすることができます。目次に使われる【隠す】【見る】の機能ですね。
表示する文章をタイトル欄に、隠したい文章をテキスト欄に入力するだけです。
ページのQRコードを作成することができる機能です。
該当ページURLとサイズを入力するだけで、以下のようにQRコードが自動生成されます。
カテゴリーやランキングで記事一覧を取得し、ショートコードを作成します。
ランキング（リスト）↓
カテゴリー別（グリッド）↓
リスト表示だとこんな感じ↓
※カスタマイズで外枠（水色）がついてます。
入力補助の機能や使い方まとめ
これだけの入力補助があれば、記事装飾も捗りそうですが、よく使う装飾ならAddQuicktagや共通コンテンツを使うとより便利。
記事作成のスピードアップにも繋がるので、ぜひ活用してみてくださいね！
