プラグイン「Emanon Premium Blocks」を有効化すると、「バナーブロック」が利用できます。バナーブロックは、画像の上にタイトルを表示することができます。

設定方法

ブロックエディタからバナーブロックを配置します。画像選択から設定を開始します。画像選択をクリックするとメディアライブラリーから画像の選択または新規アップロードができます。

ブロック配置時の表示

画像設定

サイドバーからバナーブロックの設定をおこないます。

(1) 選択したバナー画像を削除するボタンです。
(2) バナー画像の読み込み遅延を設定できます。
(3) バナー画像の内容を示す代替テキスト(alt属性)を入力します。
(4) バナー画像をクリックした時に遷移したいページのURLを入力します。
(5) バナー画像をクリックした時に別タブで開きます。
(6) バナー画像角の角度を変更できます。
(7) バナー画像を斜め表示変更します。
(8) バナー画像のマウスオーバー時に発生するアニメーション指定です。
(9) バナー画像全体を暗めに設定する機能です。

タイトル設定

(1) 見出タグをh1からh6,divのいずれかに指定できます。
(2) タイトルの配置位置を指定できます。
(3) バナー画像のマウスオーバー時に発生するアニメーション指定です。
(4) 見出しとサブタイトルのスペースを調整する機能です。

アイコン設定

(1) 見出しの左右どちらにアイコンを表示する指定できます。
(2) 見出しに挿入したいアイコンを設定します。

ID属性設定

Googleタグマネージャーを使ってバナー画像のクリックを測定する場合、クリックイベント用のIDをClicK IDに入力します。ClicK IDは他と重複しないユニークなIDにします。

表示例

下記ブロックは、ホバーエフェクトを適用した表示例です。リンクURLは、target="_blank"を指定しています。

下記ブロックは、タイトルの配置位置を指定した表示例です。

下記ブロックは、タイトルにアイコンを配置した表示例です。

下記ブロックは、斜傾を有効化した表示例です。