グリッドユニット

画像

bingo!CMSグリッドユニット編集画面の中のパーツのうち、画像についてご説明します。

PC・タブレット設定

  1. 画像を選択します(素材管理のライブラリが開きます)。
  2. マウスホバー時の画像を選択します(素材管理のライブラリが開きます)。
  3. 画像の代替テキスト(alt)を入力します。
  4. 画像サイズのタイプを設定します。
  5. 画像のwidthを設定します(初期値:100%)。※(4)でサイズ > 指定サイズ選択時のみ表示されます。
  6. 画像のheightを設定します(初期値:auto)。※(4)でサイズ > 指定サイズ選択時のみ表示されます。
  7. 左右位置を設定します。
  8. 画像の表示エリアの背景に色をつけます(カラーパレットが開きます)。
  9. 画像の表示エリアの角丸の大きさの値を設定します。
  10. 画像の表示エリアの角丸の大きさの単位を設定します(px/%)。
  11. 画像をクリックした時の動作を設定します。
  12. リンク先のURLを入力します。※(11)でリンク:●●設定時のみ表示されます。
    • _self
      同じウィンドウで表示
    • _blank
      新しいウィンドウで表示
    • _parent
      ウィンドウがフレームで分割されているとき、一つ上位のフレームを分割してその上に表示
    • _top
      ウィンドウがフレームで分割されているとき、全ての分割を解除して最上に表示
  13. 画像にキャプションをつけるときは、ここにテキストを入力します。
  14. キャプションの左右位置を設定します。
  15. キャプションの行間の値を設定します。
  16. キャプションの文字間の値を設定します。
  17. キャプションの文字サイズの値を設定します。
  18. キャプションの文字サイズの単位を設定します(px/em/%)。
  19. キャプションの文字の太字にします。
  20. キャプションの文字に色をつけます(カラーパレットが開きます)。
  21. 画像表示エリア外側の余白の値を設定します。
  22. 画像表示エリア内側の余白の値を設定します。

SP設定を「する」にした場合、「SPも同じ内容で更新」のチェックボックスが表示されます。
チェックボックスにチェックを入れて保存すると、チェックした項目の編集内容がスマートフォン設定の同項目に反映されます。
「サイト設定」の「SPも同じ内容で更新」の初期値 で「チェックを入れる」が設定されていると、ユニットの編集画面を開いた際に自動でチェックが入ります。

スマートフォン設定

  1. 画像を選択します。
  2. altに設定するテキストです。
  3. 画像サイズのタイプを設定します。
  4. 画像のwidthを設定します(初期値:100%)。※サイズ=指定サイズの時のみ。
  5. 画像のheightを設定します(初期値:auto)。※サイズ=指定サイズの時のみ。
  6. 左右位置を設定します。
  7. 画像表示エリアの背景色を設定します。
  8. 画像表示エリアの角丸の大きさを設定します。
  9. 画像表示エリアの角丸の大きさの単位を設定します。
  10. 画像をクリックした時の動作を設定します。
  11. リンク先のURLを入力してください。※クリック時の動作をリンク:~に設定時のみ
  12. キャプションの文章を入力してください。
  13. キャプションの左右位置を設定します。
  14. キャプションの行間を設定します。
  15. キャプションの文字間を設定します。
  16. キャプションの文字サイズを設定します。
  17. キャプションの文字サイズの単位を設定します。
  18. キャプションの文字の太字を設定します。
  19. キャプションの文字色を設定します。
  20. 画像表示エリア外側の余白を設定します。
  21. 画像表示エリア内側の余白を設定します。

ページトップ