AFFINGER

AFFINGER5

【アフィンガー/AFFINGER5】よく使うデザインカスタマイズ

アフィンガーって設定が多すぎてどうすればいいか悩むなぁ
アフィンガーでよく使うデザインの使い方を知りたいわ

 

こんな悩みを解決します。

 

アフィンガー5は機能がもりだくさんで、とても優れたテーマです。

こんなこともワンクリックでできてしまいます。

だけど、正直なところこんなのは使いませんよね。。。

 

この記事のポイント

  • アフィンガー5初心者向けの記事です。
  • 最もよく使うデザインを厳選して紹介します。
  • アフィンガーを使って記事をサクサク量産できるようになります!!

 

 

 

【アフィンガー】デザインの超基本(太字・マーカー)

まずは超基本から。

太字とマーカーの設定方法をご紹介します。

 

太字

まずは太字です。

 

太字の設定方法

  1. 太字にしたい文字を選択
  2. メニューバーの B をクリック

 

 

マーカー

マーカーの設定方法です。

 

マーカーの設定方法

  1. マーキングしたい文字を選択
  2. メニューバーのスタイル → マーカー → 黄マーカー をクリック

 

 

【アフィンガー】BOXの作り方

箇条書きなどを囲むBOXの作り方です。

ワンクリックで設定できます。

 

シンプルグレーBOX

グレーBOXの設定方法

スタイル → ボックス → グレー  をクリック

 

デザイン例

シンプルグレーBOX

ワンクリックで設定できます!

 

 

コメント付きBOX

コメント付きBOXは、次の手順で作成することができます。

コメント付きBOXの設定方法

  1. タグ → ボックスデザイン → マイボックス → 基本
  2. コメント、色の設定を 好みに応じて変更する

 

 

 

ショートコードのパラメータ

[ st-mybox title="コメント" fontawesome="アイコンの種類" color="コメントの色" bordercolor="枠線の色" bgcolor="枠背景の色" borderwidth="2" borderradius="5" titleweight="bold" fontsize="" myclass="st-mybox-class" margin="25px 0 25px 0"]

[/st-mybox]

 

このショートコードの場合は 下のBOXのようなデザインになります。

[ st-mybox title="コメント付きBOX作成例" fontawesome="fa-heart" color="#03A9F4" bordercolor="#f44336" bgcolor="#FFF3E0" borderwidth="2" borderradius="5" titleweight="bold" fontsize="" myclass="st-mybox-class" margin="25px 0 25px 0"]

[/st-mybox]

 

コメント付きBOX作成例

 

 

 

【アフィンガー】会話風ふきだしの作り方

記事の書き出しなどで とてもよく使うデザインですね。

アフィンガー5ではたったのワンクリックで会話風吹き出しを作ることができます。

会話風ふきだしの設定方法

タグ → 会話ふきだし → 会話1~会話8

アフィンガーは吹き出しも1クリックで簡単設定できるよ!!

 

アフィンガーではふきだしのアイコンを8種類設定できます。

プラグインを追加するとアイコンの数を増やすことができます。

会話アイコンの設定方法

 

会話アイコンの設定方法

  1. アイコンを準備する(100px以上)
  2. ダッシュボード 『AFFINGER5管理』 → 『会話・ファビコン等』 → 『アイコン画像を設定』

 

 

 

【アフィンガー】コメント付きボタンの作り方

アフィリエイトに必須のリンクボタンの設定方法です。

次のようなボタンが1クリックで作成できます。

とっても簡単です!!

太字のテキスト

今すぐ申し込む

※マイクロコピーを書いてみよう

 

ショートコードのパラメータ

[ st-mcbutton url="リンク先URL" title="ボタンのテキスト" rel="" fontawesome="" target="" color="#fff" bgcolor="#039BE5" bgcolor_top="#29B6F6" bordercolor="#00acee" borderwidth="1" borderradius="5" fontweight="bold" fontsize="120" width="90" fontawesome_after="fa-chevron-right" shadow="#039BE5" ref="on" mcbox_bg="#fafafa" mcbox_color="" mcbox_title="ボタンの上のテキスト"]ボタンの下のテキスト[/st-mcbutton]

 

コメント付きボタンの設定方法

  1. 『タグ』 → 『カスタムボタン』 → 『MCボタン』 → オレンジ ~ ブルーを選択
  2. リンクURL、各部分のテキストの修正

 

【アフィンガー】よく使うデザインカスタマイズのまとめ

まとめ

アフィンガー5を使ってブログを書く初心者の方向けに、最低限覚えておくべきデザインカスタマイズの設定方法をご紹介しました。

この記事で紹介した装飾ができれば、十分です。

後は記事を量産することに時間を費やしていきましょう。

 

 

他にもカスタマイズ方法を紹介しています。

AFFINGER
【アフィンガー/AFFINGER5】トップページをカード型で表示する方法

続きを見る

AFFINGER
アフィンガー5のメリット・デメリットを解説|ブロガーの評判は?

続きを見る

 

今がチャンス

当サイトからAFFINGER5を申し込んだ方

今なら期間限定で次のプラグインが無料でついてきます。

2,500円の「クレジット削除プラグイン」

4,980円の「STINGERタグ管理プラグイン 3」

いつまで配布できるか未定ですので申し込みはお早めに!

 

稼ぎたいなら今すぐAFFINGER5を導入しよう

-AFFINGER5

© 2021 Door Blog (ドアブログ) Powered by AFFINGER5