a-blog cmsで写真のスタイルを調整する
この記事は公開日より年以上経過しています
情報が古くなっている可能性がありますのでご注意ください。
a-blog cms で画像をアップすると、基本のCSSでは枠が付くようになっている。 しかし、枠が無い方がいい場合もサイトを作っているとあったりもする。そういう時には、どうするかについてを紹介する。
config.system.yaml を修正する
private/config.system.yaml に以下のような設定があります。
column_image_attr : column_image_attr_label : # column_image_attr : [, '1'] # column_image_attr_label : [枠付き, 枠無し]
そこを以下のように修正しましょう。
# column_image_attr : # column_image_attr_label : column_image_attr : [, '1', '2'] column_image_attr_label : [枠付き, 枠無し, 傾き]
テンプレートを修正する
通常であれば、themes/system/column.html , vicunaの時だけ themes/vicuna/include/unit.html の
<img class="columnImage" src="%{ROOT_DIR}{path}" alt="{alt}" width="{x}" height="{y}" />を
<img class="columnImage{attr}" src="%{ROOT_DIR}{path}" alt="{alt}" width="{x}" height="{y}" />のように修正します。
あとは、columnImage1 , columnImage2 の CSS を書けばいいという事になります。 設定画面は以下のような感じで設定可能です。
今回は、画像のユニットのお話でしたが、column_????_attr : という設定は他にもあります。アイデア次第で何らかの設定も可能です。
更新
