カスタムユニット V17

全般・デザインオプション

画面幅100%での表示を生かすための高機能ユニット。
各要素にマージン・パディングを設定でき、雑誌のページのようなレイアウトを制作できます。

このページではbingo!CMSカスタムユニットの全般設定とデザインオプションについてご説明します。

全般設定

  1. PC・スマートフォンそれぞれのデバイスで閲覧時に、このユニットの表示・非表示を設定します。
  2. PC・スマートフォンそれぞれのデバイスで個別設定を使用するかを設定します。
  3. アンカーメニューを設定時に使用する文字を設定します。
  4. ユニットに任意のクラスを追加します。
  5. レイアウトを設定します。（1列、2列、1列+2列）
  6. 使用可能なプリセット画面を表示します。
  7. カスタムユニット内で使用可能なコンテンツです。（８）にドラッグ&ドロップして使用します。
  8. 設定されているレイアウトです。赤枠内に（７）のコンテンツをドラッグ＆ドロップで配置します。
  9. 列の幅をドラッグ＆ドロップで調整します。（2列又は1列+2列の時のみ）
  10. 左列の上下位置を設定します。
  11. 右列の上下位置を設定します。
  12. PC・タブレット用の設定と、スマートフォン用の設定を切り替えます。（SP設定を「する」に選択した時のみ）

デザインオプション（PC・タブレット設定）

  1. 簡易設定と詳細設定を切り替えます。
  2. [簡易設定] 背景色をつけます。
  3. [簡易設定] 枠線を設定します。
  4. [簡易設定] ユニット下の余白を設定します。
  5. [詳細設定] ユニットの背景色を設定します。
  6. [詳細設定] ユニットの背景画像を設定します。
  7. [詳細設定] 背景画像の繰り返し表示を設定します。
  8. [詳細設定] 背景画像使用時に表示する時のサイズを設定します。
  9. [詳細設定] 背景画像の表示基準位置を設定します。
  10. [詳細設定] 角丸の値を設定します。
  11. [詳細設定] ボーダーの色を設定します。
  12. [詳細設定] ボーダーの太さを設定します。
  13. [詳細設定] ボーダーの種類を設定します。
  14. [詳細設定] ユニット外側の余白を設定します。
  15. [詳細設定] ユニット内側の余白を設定します。

デザインオプション（スマートフォン設定）

  1. 簡易設定と詳細設定を切り替えます。
  2. [簡易設定] スマートフォンで表示した時の2列のカラムのレイアウトを設定します。
  3. [簡易設定] スマートフォンで表示した時の2列のカラムの表示順序を入れ替えます。
  4. [簡易設定] 背景色をつけます。
  5. [簡易設定] 枠線を設定します。
  6. [簡易設定] ユニット下の余白を設定します。
  7. [詳細設定] スマートフォンで表示した時にの2列のカラムのレイアウトを設定します。
  8. [詳細設定] スマートフォンで表示した時にの2列のカラムの表示順序を入れ替えます。
  9. [詳細設定] ユニットの背景色を設定します。
  10. [詳細設定] ユニットの背景画像を設定します。
  11. [詳細設定] 背景画像の繰り返し表示を設定します。
  12. [詳細設定] 背景画像使用時に表示する時のサイズを設定します。
  13. [詳細設定] 背景画像の表示基準位置を設定します。
  14. [詳細設定] 角丸の値を設定します。
  15. [詳細設定] ボーダーの色を設定します。
  16. [詳細設定] ボーダーの太さを設定します。
  17. [詳細設定] ボーダーの種類を設定します。
  18. [詳細設定] ユニット外側の余白を設定します。
  19. [詳細設定] ユニット内側の余白を設定します。

ページトップ