Web制作に役立つa-blog cmsの小粒なTipsをご紹介します。
今回はカスタムフィールドやカスタムユニットでメディア画像を利用する際に便利な小ネタです。

a-blog cmsではメディア画像をカスタムユニットなどで利用する際に、「width」「height」をそれぞれ単体で取得する変数は用意されていません。（今のところ…）
そこで<img>タグに画像サイズを記述したい場合は、以下の様に「@imageSize」と校正オプション「split」を組み合わせて利用し設定することが出来ます。

実装方法とサンプルコード

<img src="%{MEDIA_ARCHIVES_DIR}{imagename@path}" width="{imagename@imageSize}[split(' x ', 0)]" height="{imagename@imageSize}[split(' x ', 1)]">

「@imageSize」を利用すると「1024 x 768」の様に、画像の「幅 x 高さ」の組み合わせで値が出力されます。
この値を校正オプション「split」を使い「 x 」（半角アキx半角アキ）で分割することで「0」に幅、「1」に高さを設定することが可能です。

<!-- 出力例 -->
<img src="/media/001/202404/imagename.png" width="1024" height="768">

最後に

弊社がなぜa-blog cmsを愛用しているのか、a-blog cmsの特徴やメリットとは。
a-blog cmsをお勧めする理由につきましてはこちらのページをご覧ください。
a-blog cmsをお勧めする理由