HalfMadeThemes TYPE: ALPHA

お問い合わせ

HalfMadeThemes TYPE: ALPHA

  • HalfMadeThemesの特徴
  • 初期設定と各種設定ファイル
  • ウェブサイトの作成方法
    • フォルダの作成
    • コンテンツの作成
    • 記事の作成
    • テンプレートの編集
    • 外部スクリプトの設置方法
  • デザインカスタマイズ
    • 配色の変更
    • ウェブフォントやCSS、JSの設置
    • フォームデザインのカスタマイズ
  • アクセシビリティへの対応
  • テーマの購入方法
  • よくある質問
  • お知らせ
お問い合わせ
  • 個人情報保護方針
  • ご利用規約
  • 特定商取引法表示
  • X(旧:Twitter)
  • Instagram
  • Facebook
公開日
2025.09.28

複数枚画像の利用方法

カテゴリ
マニュアル
ブロックエディタ

現在位置

  1. HOME
  2. Information
  3. ブロックエディタ
  4. 複数枚画像の利用方法

機能の概要

記事で利用可能な「複数枚画像」ブロックは、画像をリスト形式で並べて表示することが可能です。
それぞれの画像は、通常の画像と同じように角丸加工・枠線表示が可能なほか、オプションで以下の装飾が可能となっています。

  • 画面幅によるレイアウト調整
  • カラムの高さ制御
  1. このブロックは初期状態では「ウェブページ」で使用できないようになっています。
    ウェブページで同様の表示を実現する場合は「複数カラム(2カラム/3カラム)」を利用してください。

入力欄

このブロックを利用すると、1行に掲載する画像枚数が2〜4枚のブロックを追加できるようになります。

以下は、複数枚画像ブロックの中で「画像を追加(3枚)」を選択した場合の状態です。

なお、基本的な画像のアップロード方法は、MovableType.net標準の画像ブロックと同様です。
「画像を追加」ブロックは、枚数が異なるブロックでも、同じ「複数枚画像」ブロックの中で使用できます。

出力されるHTML

上記のように作成した場合も、HTMLはリスト形式( ul > li > div > img )で画像が並びます。

オプション機能

画面幅によるレイアウト調整

このオプションは以下の3つから選択でき、選択した内容によって幅の狭いデバイスでの列数をコントロールできます。

  • 調整しない
  • 1列で表示
  • 2列で表示

出力イメージ

  • オプション:調整しない
  • オプション:1列で表示
  • オプション:2列で表示

カラムの高さ制御

このオプションは以下より選択可能で、同一カラム内に並ぶ画像の高さを調整することができます。

  • 揃えない
  • 行ごとに高さを揃える

出力イメージ

  • 高さを揃えない場合
  • 高さを揃える場合

行ごとに高さを揃える場合、同じカラム内の一番大きな画像にあわせ、その他の画像を拡大します。
ただし、その際はカラム幅にあわせて左右がトリミングされることにご留意ください。

シンプルで拡張性のあるデザイン。
思い通りのカタチに。

HalfMadeThemes TYPE: ALPHA

〒060-0062
北海道札幌市中央区南2条西7丁目6-2
日宝南2条ビル 6F
株式会社ジャクスタポジション
Tel. 011-252-9652
  • 個人情報保護方針
  • ご利用規約
  • 特定商取引法表示
  • X(旧:Twitter)
  • Instagram
  • Facebook

©2025 Juxtaposition Inc.