Snow Monkey Blocksとは?
mixhostに導入可能なWordPressでは、投稿した記事をネット上に配信することが可能ですが、
PV数を増やすためには、投稿する記事内容もさることながら、記事の内容をデザインして見やすくすることも重要になっていきます。
WordPressにはデフォルトでブロック要素が用意されていますが、
今回紹介するプラグインであるSnow Monkey Blocksでは、ブロック要素を拡張してくれるものですので導入することで、
拡張されたブロックを上手く組み合わせることでより見やすい記事を投稿することが可能です。
Snow Monkey Blocksは無料で導入できるプラグインです。
今回はSnow Monkey Blocksの導入方法から使い方までを解説していきます。
Snow Monkey Blocksの導入方法
導入するサイトのダッシュボードから「プラグイン→新規追加」と移動し【Snow Monkey Blocks】と検索し検索結果から【Snow Monkey Blocks】の【今すぐインストール】をクリックしインストールしましょう。
インストールが完了したらそのまま【有効化】を行ってください。
Snow Monkey Blocksの使い方
Snow Monkey Blocksで追加されるブロックを1つずつ紹介していきます。
尚、本稿では有料版のSnow Monkeyで使用できる「Pro」とついたブロックの紹介は行いません。
Snow Monkey Blocksで使用できる無料版のブロックのみ紹介します。
アコーディオン
タイトルと本文で1セットになっています。
デフォルトではタイトルのみ表示されていて、タイトルをクリックすると本文が表示されるブロックとなっています。
また、設定で本文が最初から開いた状態で表示させることも可能です。
用途としてはQ&Aであったり、ページ全体の縦幅の長さをスッキリさせるため長文になりがちな本文を隠すために使用します。
アラート
タイトルと本文で1セットになっています。
タイプが「ノーマルアラート」、「ワーニングアラート」、「サクセスアラート」、「リマークアラート」の4種類あり、それぞれ背景色が異なります。
また、レ点や電球マーク等のアイコンが用意されており、設定するとタイトル部の文頭につきます。
用途としては背景色がつきますので、閲覧している方に注目してほしいワードを表示させるために使用します。
吹き出し
アバターの画像と名前、吹き出し内の本文で1セットになっています。
アイコンの画像はアバター(デフォルトは人型マーク)をクリックすることでメディアを設定できます。
吹き出しは色を変えることができ、アバターの枠線の色やテキストカラー、吹き出しの背景色が変更可能です。
用途としては吹き出しですので、会話口調の説明を行うときに使用します。
ボックス
箱型の枠線を付けることができます。
ボックス単体では枠線が付くだけですので、コンテナー同様に他のブロックと組み合わせて使います。
枠線の色や影、寸法などを設定することが可能で、角の部分に丸みを付けることで楕円の形にすることも可能です。
ボタンボックス
リード文とボタン、注釈で1セットになっています。
リード文と注釈は任意で入力ですので必要なければ未入力でも構いません。
ボタンは押された時の動作としてリンクを付けることが可能です。
ボタンボックス全体の設定としては、ボタンの色や形を編集することができます。
ボタン
ボタンを追加することができます。
ボタンボックスからリード文と注釈が無くなっています。
設定内容はボタンボックス同様にボタンの色や形を編集することができます。
また、複数のボタンを横並びに配置することが可能です。
用途としてはリンクのボタンのみを配置したいときに使用します。
カテゴリー一覧
WordPressの投稿のカテゴリーを一覧で表示するブロックを配置することができます。
投稿数が0のカテゴリーはデフォルトで表示されませんが、表示させるカテゴリーは「除外カテゴリー設定」で絞ることが可能です。
また、カテゴリー内での表示順の変更も可能となります。
用途としては、記事で紹介している内容の詳細説明の記事や似たようなジャンル記事へ誘導するために使用できます。
コンテナー
横幅の最大幅を決定することができます。
コンテナー単体では何も起きませんので、ボックス同様に他のブロックと組み合わせて使います。
アラートと組み合わせて使用し、「コンテンツの最大幅」を200に設定すると下記の画像のイメージになります。
配置後は「コンテンツの最大幅」を設定するだけですので、横幅の長さを調節したいときに使用できます。
カウントダウンタイマー
設定した日時までのカウントダウンを表示させることができます。
ブロック設定でカウントダウンをさせる日時を指定します。
設定する日時はWordPressで設定されているタイムゾーンを参照しますので、日本の場合デフォルトのUTC+0だと意図した日時に表示されません。
日本の場合はUTC+9に直してから設定するようにしましょう。
閲覧ユーザー側に表示される投稿画面ではカウントダウンが行われた状態で表示されます。
ディレクトリ構造
ディレクトリ構造の図を作成することができます。
フォルダアイコンのディレクトリもしくはファイルアイコンのファイルのいずれかを追加することができます。
また、アイコンの色をマークを変えることも可能です。
星評価
星アイコンで5段階評価が行えるブロックです。
評価は0.1刻みで0~5の範囲内で付けることができます。
また、星アイコンの色や数値の色を変更することができ、数値の位置(左側、右側)と表示非表示の切り替えも可能です。
FAQ
FAQを配置できます。
質問と回答を簡単にまとめることができます。
デフォルトの「Q」や「A」を任意の文字に変更することも可能です。
また、色の変更も可能です。
情報
ラベルと本文で1セットになっているブロックを配置することができます。
ラベルカラムのサイズや、ラベルの横位置と縦位置の調整が可能です。
項目
以下の4つの項目を配置することができます。
- バナー
- 項目(ブロックリンク)
- 項目(自由入力)
- 項目(スタンダード)
それぞれの項目には、画像やリンクを設定することができます。
また、項目ごとに色など異なる設定を行うことが可能です。
期間限定の表示
設定した期間内のみ表示させるブロックです。
単体で使用しても何も表示されませんのでこのブロックを親として期間限定で表示させたいブロックを子にしてセットで使用します。
表示させる機関の開始日時と終了日時を設定することができます。どちらか片方のみの設定も可能です。
設定する日時はWordPressで設定されているタイムゾーンを参照しますので、日本の場合デフォルトのUTC+0だと意図した日時に表示されません。
日本の場合はUTC+9に直してから設定するようにしましょう。
アイコンリスト
アイコン付きのリストを設定することができます。
アイコンの色と種類を設定することができます。
設定したアイコンは編集画面では表示されず、プレビュー画面でのみ表示されます。
メディアとテキスト
メディアとテキストで1セットになっています。
タイトルと説明文、画像を設定することができるシンプルなブロックとなっています。
画像サイズなどを設定することが可能です。
パネル
以下の4つの項目を配置することができます。
- パネル(自由入力/ブロックリンク)
- パネル(自由入力)
- パネル(水平レイアウト)
- パネル(垂直レイアウト)
単体で使用しても何も表示されませんのでこのブロックを親としてパネル状に表示させたいブロックを子にしてセットで使用します。
設定では行当たりのカラム数の数を指定することができます。
価格メニュー
価格メニューはメニュー名と金額をセットで表示できるブロックとなっています。
お店の紹介などでメニューを掲載したい場合に活用できます。
価格表
価格メニューに画像も挿入できるようになったのが価格表です。
複数の料金を並べる際に活用できますので、同じような品物の比較や料金プランを比較などで活用できます。
また、ボタンもデフォルトで設定できますのでリンクを設定すればボタン押下で指定したページで遷移させることも可能です。
設定では、ほかにもカラムサイズを指定することが可能です。
レーティングボックス
レーティングボックスを1つずつ配置できます。
設定ではバーの色とレーティングの長さを決めることができます。
コンテンツスライダー
複数のコンテンツを横方向に自動でスライドしてくれるスライダーを設定することができます。
スライドや画像など、好みのブロックと組み合わせて任意のスライド数をスライダーで表示させることが可能です。
矢印やドットの表示、自動でスライドさせる間隔を秒単位で設定することができます。
ピックアップスライダー
WordPressの投稿のタグに「pickup」を設定されている投稿を横方向に自動でスライドしてくれるスライダーを設定することができます。
ピックアップスライダーで記事を表示させるためにはタグに「pickup」を設定すれば自動的にスライド内容に反映されます。
スライドの最大表示数や自動でスライドさせる間隔を秒単位で設定することが可能です。
スライダー
複数の画像を横方向に自動でスライドしてくれるスライダーを設定することができます。
画像サイズやスライダーに矢印、ドットなどを表示させることが可能です。
また、自動でスライドさせる間隔を秒単位で設定することも可能です。
ステップ
手順ごとに1から順に説明できるステップを設定することができます。
番号の色を設定することが可能です。
順を追って説明を書きたいときに活用できるブロックです。
タブ
タブブロックを設定することができます。
タブのスタイルや向き、位置を変更することが可能です。
お客様の声
アバター(デフォルトは人型マーク)と内容、名前を設定することができます。
商品の評判を書いたり、実際のお客様の声を投稿することができます。