マニュアルトップ » ブログ機能編 » ブログの書き方 - 画像を設定する

画像を設定する

画像登録の方法

画像を表示させるために、写真ブロックまたは分割写真ブロックが用意されています。
これらのブロックに画像を登録することで、画像が表示されるようになります。

画像の登録方法は、以下の2種類あります。

以下、分割写真ブロックも含めて単に「画像ブロック」と呼び説明していきます。

ドラッグ&ドロップで登録する

画像ブロックと、画像が入っているフォルダを同じ画面内で開きます。
フォルダ内の画像をドラッグして、画像ブロックの黒いエリアにドロップします。

ファイルをクリックしたまま移動することをドラッグ、ドラッグしたファイルを離すことをドロップと言います。

画像が設定されると黒いエリアはなくなりますが、設定されている画像上に画像をドラッグ&ドロップできるようになっています。
画像設定済みの画像ブロックに新しい画像をドロップすると、新しい方の画像が設定されます。

メディアボックスを使用して登録する

画像ブロックの黒いエリアをクリックします。
メディアボックスが開きます。
左上の[
画像アップロード]をクリックすると、ファイル選択のウィンドウが開くので、画像を選択してアップロードします。

アップロードできる画像はJPEG、PNGのみです。

ファイル選択時に複数画像を選択すると、複数枚一括でアップロードできます。
アップロードした画像（複数アップロードした場合は画像ブロックに表示させたい画像）をクリックして選択します。
選択したら、メディアボックス下の[追加する]をクリックします。

分割写真ブロックの場合は画像を複数選択できます（表示されるのは最大4枚です）。
画像ブロックに選択した画像が表示されました。

画像を変更する場合は、画像ブロックに表示されている画像をクリックします。
するとメディアボックスが開くので、同様の手順で画像を登録し直します。

画像ブロックの設定

画像ブロックでは、1枚の画像を表示できます。
画像ブロックの上部に、画像の設定項目があります。

title: 画像にtitleを設定する事が可能です。
設定する事で、画像下に文言が表示され、Google等のロボットにもtitleが認識されます。

titleは、画像を一言で表せる文言を設定します。
alt: 画像にaltを設定する事が可能です。
altはどういった画像なのかを詳しく記述する部分になります。

記述した文章は記事上には表示されません。
設定する事で、Google等の画像検索にも引っかかる可能性が出てきます。
リンク: 画像をクリックした際に、画像を表示するか、指定したURLに移動するか選択できます。
[有り]に設定すると、次の[URL]で設定したURLに移動します。
URL: 上の[リンク]を[有り]に設定した際に入力できるようになります。
画像をクリックした際に指定したURLに移動します。
リンクの開き方: リンクの設定をした際、リンク先のページに同じタブ内で移動するか、新しいタブで開くか設定します。

分割写真ブロックの設定

分割写真ブロックでは、1～4枚の画像を表示できます。

分割写真ブロックの上下に設定項目があります。
上部はブロック全体、下部は画像ごとの設定項目です。

画像タイプ

画像の表示の仕方は以下の4通りあります。

長方形(切り取り): 表示領域に合わせて拡大・縮小して表示します。
表示領域からはみ出た部分は非表示となります。
表示される画像のサイズは全画像で同じになります。
アスペクト比を固定: 縦横比を維持したまま拡大・縮小して表示します。
縦横比が異なる画像を並べると、横長の画像ほど上下に隙間ができます。
角丸(切り取り): [長方形(切り取り)]の状態から、画像の四隅を丸めます。
角丸 (アスペクト比を固定): [アスペクト比を固定]の状態から、画像の四隅を丸めます。

title/altテキスト