【AFFINGER５】ボックスデザイン枠の色を変えるやり方

【AFFINGER】ボックスデザイン枠の色を変えるやり方、カスタマイズを紹介

2020年9月23日 2021年12月30日

ムロ

このブログは、AFFINGERのテーマを買ったけど使い方がわからない！？そんな初心者さんに、記事作成ツールの使い方や、AFFINGERでSEOを効率よくするための記事を書いているブログです( ^ω^ ) 私も、AFFINGERのテーマを購入したときはかなり苦戦しました。そんな経験を元に使い方を記事で紹介していきます。

AFFINGER プラグインセット販売価格29,800円（税込）

＼当サイト限定特典付き／

AFFINGER プラグインセットショップはコチラ

AFFINGERボックスデザイン枠のカラーを変えたい場合のやり方、ボックスデザインのカスタマイズ方法を詳しく紹介していきます。

ムロ

AFFINGER5は、ボタン1つで色々なデザインのボックスを使えるから便利ですね。
しかも、ボックス内の背景色や線の色などをもっと自分好みに変更することも可能！！めちゃくちゃ、使える機能です

このボックスの枠の色を変えます。→青色に

こんな感じになります。

他のにも、

デフォルト

サンプル

カスタマイズしたら

サンプル

ボックスデザインはたくさんあるのですが、全てでこのカスタマイズができますので自分の好きなようにできます。

もくじだよ

1 AFFINGER、ボックスデザインの枠の色を変えるやり方
2 ボックスデザインのカスタマイズを紹介、自分のオリジナルを作る
3 まとめ：自分好みのボックスデザインでブログをお洒落にしよう

AFFINGER、ボックスデザインの枠の色を変えるやり方

基本的な例として、枠の色を変えるやり方を説明します。

step
1タグからマイボックスを選ぶ

タグ＞ボックスデザイン＞マイボックス＞しかく（枠のみ）

参考

bordercolorこれが枠のことで、＝”0000FF"これがカラーパターン

これを変更すると枠の色が変えられます。

こんな感じになります。

ムロ

めちゃくちゃ簡単でしたね！！

ムロ

今回、初心者でも使えるようにマニュアルを作りました。この記事を読んでもらえればAFFINGER５の使い方がよくわかります。【最新版2021年】AFFINGER5の使い方とインストール方法、補足マニュアルと不具合の修正を紹介本ブログの人気記事です。

ボックスデザインのカスタマイズを紹介、自分のオリジナルを作る

ここさえ覚えておけば、ボックスデザインを自分の思うようにカスタマイズできますので覚えときましょう！！

このボックスを実例として（見出し付きフリーボックス）

⬇️

見出し（全角15文字）

これのコードはこちら⬇️

 command
[st-midasibox title="見出し（全角15文字）" fontawesome="" bordercolor="" color="" bgcolor="" borderwidth="" borderradius="" titleweight="bold" myclass=""]
 
[/st-midasibox]

title	見出し	bgcolor	背景の色
fontawesome	アイコン	borderwidth	枠線の太さ
bordercolor	枠線の色	borderradius	枠線の丸み
color	見出しテキストの色	titleweight	見出しテキストの色