Twitter でフォロー

https://www.wordpresstankentai.tokyo

アフィンガー4 有料テーマ・テンプレート

【アフィンガーの使い方】アフィンガーの文字装飾一覧はコチラ>

更新日:

このページでは人気ワードプレステンプレート、【アフィンガーAFFINGER4】の記事装飾の使い方や機能などを紹介します。

アフィンガーはかなり多機能で、使い始めてもう2年ぐらい。

以前からかなり好きで、他のワードプレステンプレートも持っていますけど、なんだかんだでアフィンガーを使ってきました。

 

でも決して完璧という訳では無く、使っていくうちに不満も出てきて。

コレまでのバージョンでは正直、『イマイチ記事装飾機能が弱いな』という印象でした。

でもまあ、そこまで重要じゃないし、と思っていた所、今回のアップデート

 

今回は私の不満が届いたのでしょうか、文字装飾がかなり進化して凄いことになっていてビックリです♪

こんな方におすすめ

  • Affinger4の文字装飾機能の使い方や機能などを知りたい人
  • アフィンガーの文字装飾の種類を知りたい人
  • Affingerを使ってみたいので情報集めをしている人
  • AFFINGER4のカスタマイズのバリエーションを知りたい人

発売してからずっとコマメにアップデートを繰り返してきた【アフィンガー】は、2018年に入ってから更に強力にステップアップしてくれました!

 

今までより更に簡単に、魅力的な装飾が出来る様になってまた惚れ直した感じです♪

このページでは新しくなったアフィンガーの装飾とその使い方を紹介したいと思います。

 

必須TinyMCE Advancedをインストールしておこう

Affinger4の文字装飾機能を楽に使える様に無料プラグイン【TinyMCE Advanced】を事前に導入しておきましょう!

 

アフィンガーの記事装飾が簡単で使いやすい理由

参考 記事の装飾を選ぶには

アフィンガーでは基本設定が済んでいればあとは投稿画面の【スタイル】又は【タグ】部分から全ての装飾が選べる様になっています。

見出しは投稿画面左寄りの【段落】のボックスから選びます。

 

他社製のワードプレステンプレートでは、ショートコードを記入して行くタイプの物もありますが、アフィンガーはその必要も無いので記事作成がダントツ早く便利なのがポイントです。

 

見出しのデザインも自由自在! こんな風にかんたんに変更可能です。

アフィンガーの各見出しは、H2からH5まで自由でデザイン変更可能です。

 

見出しのデザインは『アフィンガー AFFINGER4』のカスタマイズ画面から設定する様になっています。

 

一度設定したら、同じデザインを使う以上サイドいじる必要が無い部分です。 見出し部分は、サイトを立ち上げたら始めに設定しておく事をおすすめします。

 

このサイトではテーマカラーに合わせて紫系で揃えてみましたが、もちろんそれぞれ別々の色にする事も可能です。

⇩⇩⇩⇩⇩⇩⇩⇩

 

『クリップメモ』はこんな感じ

アフィンガーのクリップメモ】はデフォルトではかなり地味な見た目です。

 

ちょっと地味すぎるかも...

⇩⇩⇩⇩⇩⇩⇩⇩

クリップメモ デフォルトではこんな感じ

⇧⇧⇧⇧⇧⇧⇧⇧

 

デフォルトでは上の様に表示されていますが、アイコンの種類、大きさを好みで変えたり、枠線の色を変える事も出来ます。 アイコンはfontawsomeを使う事が出来るようになっています。
こだま
一度好みのデザインを作ったら、『Add Quick Tag』という無料プラグインに登録しておく事ですぐに呼び出せる様になります。

色々なアイコンマークもデフォルトで装備しています。

よく使うマークはデフォルトで装備されているのがポイントです。

⇩⇩⇩⇩ 好みでそれぞれ別々の色に設定可能です。(このサイトでは全て同じ色で設定しました)

 ハテナマーク

 注意マーク

 人物マーク

 チェックマーク

 メモマーク

こだま
このサイトでは全部のアイコンを同じ色に設定しましたが、注意マークを黄色、ビックリマークを赤にするなど、目的に合わせても良さそうだと思いました。

ブログカードはこんな感じです。

アフィンガー『AFFINGER4』のブログカードは【カスタマイズ画面】枠の色、枠線の太さが変更可能になっています。

このブログでは、テーマカラーとは対照的に、目立つ色に変更して太い枠線に設定してみました。

ブログカードを使用するには

ブログカードを使用するには事前に『AFFINGER4管理画面』⇒『投稿固定記事設定』⇒『投稿一覧(管理画面)にサムネイル・ID・文字数を表示』にチェックを入れておきます。

記事IDはコチラにチェックを入れる事で、記事一覧にIDが表示されます。

 

ブログカードは投稿画面の『ブログカード』ボタンをクリックで記事に挿入します。

ブログカードを記事に挿入する場合は、『記事IDを記事内に貼付け』して、IDを選択状態にしてから『ブログカードボタン』をクリックします。

ブログカードの使用には投稿画面のボタンをクリックします。

ブログカードの見た目設定は【外観⇒カスタマイズ】から設定できます。

⇩⇩⇩⇩⇩⇩⇩⇩

Font Awesome 使い方は実は簡単>アフィンガーでFont Awesomeを使ってみる

今回紹介する、便利アイコンサイト【font awesome】(フォントオーサム)では、無料で使えるベクタースタイルのイラストアイコンが提供されています。 ここではワードプレスの人気テーマ『アフィンガー ...

こだま
このブログでは、枠線を太く、水色に設定してみました。

テーブル表の設定も結構色々いじれる

商品の情報などを上手にまとめる際に便利なのがテーブル表です。

アフィンガーAFFINGER4では簡単に枠線の色や見出しの背景色など設定できるので、サイトのテーマカラーに合わせたり、逆に目立つ様にしたりする事も出来ます。

 

AFFINGER4の場合、テーブル表のデザインはカスタマイズ画面から色々な設定が出来る様になっています。

  1. 枠線の色
  2. 偶数行の色/奇数行の色
  3. 縦一列目の色/横一列目の色
  4. 縦一列目の背景色/横一列目の背景色
  5. 縦一列目を太字にする/横一列目を太字にする

⇩⇩⇩⇩⇩⇩⇩⇩


こだま
個人的にはこの、見出しに色が付けられる機能が気に入っています。

これがあるとしっかり見出し感が出しやすいです。

アフィンガーには会話風吹き出しもプラグイン無しで実現

会話風の吹き出しもプラグインを使わずに可能になっています。

これはかなり気に入っている機能です♪

 

このブログでは4つの画像アイコンを設定していますが、最大8個のアイコンを使って吹き出しを設定する事が出来ます。

背景色は、カスタマイズ画面からそれぞれ好みの色に設定出来ます。

⇩⇩⇩⇩⇩⇩⇩⇩

こだま
こんにちは
会話アイコンは8個、別の画像を設定できます。
こんな感じです

 

各画像は、『アフィンガー4管理画面』から設定できる様になっています。

でも吹き出し背景色『カスタマイズ』から設定するので注意です。

 

こだま
画像を右側にしたい場合は、『st-kaiwa1 r』のように【半角を開けて小文字『r』を付けると出来ます。

 

個人的には、『吹き出し背景色をカスタマイズで設定』して、『画像はアフィンガー管理画面で設定する』のが、慣れるまで分かりにくいなと思いました。

箇条書きに便利!チェックリスト・番号リストのタグの設定

アフィンガーAFFINGER4では箇条書きの時に便利な【チェックリストタイプ】と【番号リストタイプ】のデザイン設定が出来る様になっています。

カスタマイズから設定できる箇所は以下の通りです。

  • チェックマーク/番号の色
  • 枠線の色
  • 背景色

⇩⇩⇩⇩⇩⇩⇩⇩

チェックリスト

  • こんにちは
  • こんにちは
  • こんにちは

番号リスト

  1. こんにちは
  2. こんにちは
  3. こんにちは
こだま
このサイトでは、テーマカラーに合わせて紫ベースで設定してみました。

『こんな方におすすめ』ボックス

個人的には【こんな方におすすめボックス】はかなりお気に入りで、記事最初の紹介部分などに設置すると目を引くのでかなり気に入っています。

カスタマイザーで色を変える事ができるので、サイトのテーマカラーなどに合わせやすいです。

色を変更出来る箇所は、枠線、背景色、タイトル文字

タイトル文字下の線は非表示にする事も出来ます。

⇩⇩⇩⇩⇩⇩⇩⇩

『見出し付きフリーボックス』はこんなボックス

見出し付きフリーボックスは、その名の通り見出しが付いたボックスです。

カスタマイザーで背景色や見出し色を変更でき、見出し部分にアイコンなどを挿入する事も出来ます。

⇩⇩⇩⇩⇩⇩⇩⇩

 

こだま
一度好みのデザインを設定したら、『Add quick Tag』というプラグインを使って、複数の色やデザインを登録しておくと、毎回簡単に呼び出す事ができます。

『マイボックス』はこんなボックス

マイボックスはカスタマイザで設定したチェックアイコンがデフォルトで設定されています。

枠線の色、アイコンの種類と色、背景色を個別に設定する事ができます。

⇩⇩⇩⇩⇩⇩⇩⇩

マイボックス

マイボックスのデフォルトデザインはこんな感じです>

いくつかバリエーションを作ってみました。

⇩⇩⇩⇩⇩⇩⇩⇩

ポイント

ボックス内の文字は通常の記事内の文字色と同色です。この様に表示されます。

ポイント

ボックス内の文字は通常の記事内の文字色と同色です。この様に表示されます。

ポイント

ボックス内の文字は通常の記事内の文字色と同色です。この様に表示されます。

 

こだま
一度好みのデザインを設定したら『AddQuickTag』に設定しておくと簡単に呼び出す事が出来ます。

メモボックスはこんな感じ

メモボックスはこんな感じです。

カスタマイズ画面枠線と文字色を変更できます。

⇩⇩⇩⇩⇩⇩⇩⇩

メモ

枠線と文字色のみ変更可能です。

こだま
メモや注釈が必要な時にサッと使えるのが便利です。

 

メモボックス2はこんな感じです。

アフィンガー4には【メモボックス2】というボックスもあります。

ボックス内の文字は通常のフォントに比べて小さく表示されます。

また、このボックスでは見出し部分のアイコンが変更出来ません。

⇩⇩⇩⇩⇩⇩⇩⇩

メモボックス2

ここに記載した文章は通常のフォントよりも小さく表示されます。

こだま
アイコンが変更できないのが難点だけど、これも便利なボックスです。

スライドボックスは【Q&Aに便利】

スライドボックスは「Q&A」形式の質問が簡単に作れます。

カスタマイズ画面で色を設定する事が出来ます。

この機能が始めから付いているワードプレステンプレートは中々無いので、かなり気に入っています。

⇩⇩⇩⇩⇩⇩⇩⇩

+コチラをクリックすると...

こんな感じで答えが現れます♪

こだま
色はカスタマイズで好きな色に設定する事が出来ます。

テーマカラーに合わせて色いろ試してみて下さい。

目次表示機能はこんな感じで設定できます。

アフィンガー4では『Table of contents』といいう無料プラグインを導入する事でオリジナルデザインを使える様になっています。

このサイトでは紫で統一したイメージにしました。(無駄な主張が無い方が良いと思ったので。)

好みで好きな色にしても面白いと思います。

変更可能箇所は以下の通りです。

  • 目次色
  • 第1リンク文字色
  • 第2リンク以降の文字色
  • 下線と第3リストアイコン
  • ボーダー色(枠線色)
  • 背景色

⇩⇩⇩⇩⇩⇩⇩⇩

こだま
デフォルトだと結構地味なデザインの『Table Of Contents』ですが、アフィンガーではかなり整った見やすいデザインになるのが気に入っています。

ワードプレスの目次プラグイン『Table of Contents Plus』のインストール方法、設定方法を紹介しています。

【ワードプレス プラグイン】 目次を【Table Of Contents Plus】で設定してみた!カンタンな使い方>

【ワードプレスプラグイン】目次プラグインの定番【Table of contents Plus】のインストールから設定方法までを紹介します。 ワードプレスで作ったページのトップによく見かける【目次】を表 ...

星マークも簡単に挿入できます!

アフィンガー4では☆マークを簡単に挿入できる様になっています。

商品の評価などにも使いやすいと思います

☆は最大五個までです。

使い方も簡単で、投稿画面の【タグ】をクリックし、一番下から【スター】を選択します。

投稿画面内ではデフォルトで『star5』というタグが表示されますが、ここの数字部分を変えると☆の数を変更する事が出来ます。

⇩⇩⇩⇩⇩⇩⇩⇩

星5つ

星4つ

星3つ

星2つ

星1つ

ボタンも2種類装備しています

アフィンガーは簡単にボタンを設置する事ができます。

とりあえず『2種類のボタン』がすぐに使える様になっています。

投稿画面に挿入ボタンがあります。

ボタンAが赤いボタンで、ボタンBが青いボタンです。

それぞれリンクを付ける事も出来ます。

各ボタンは投稿画面のに『ボタンA』『ボタンB』と表示されている所をクリックする事で記事に挿入できます。

⇩⇩⇩⇩⇩⇩⇩⇩

こだま
簡単に記事の好きな所に挿入する事ができるので便利です!

この記事が気に入ったら
いいね ! しよう

Twitter で

アフィンガーwingの紹介タグ

このサイトでは【AFFINGER 5 WING 】を使っています。

2018年3月下旬に【アフィンガー5 WING】が発売されました。

強力な機能追加もそうですけど、【とてもやわらかい印象のデザイン】から、【カチッとしたビジネスっぽいデザイン】まで、幅広く設定できるのが好感が持てます。

 

WING(affinger5)を使ってみて

実際に使ってみた感じでは、ボタンデザインやランキングデザインがかなり洗練された見た目にアップデートされて、かなり今風になってます。

それから最新版ではカルーセルスライダー(横向きに画像が動くスライダー)機能が追加されてかなり使い勝手がアップしています!

また、ありとらゆる文字や画像、アイコンなどをアニメーション機能でかんたんに動かす事ができるようになったのがスゴいと思います。

こだま
アニメーション機能は投稿画面でサッと選ぶ事が出来ます。 プラグインも必要ないのがうれしいです。

【AFFINGER5 WING】のおすすめポイント

  1. 美しくかんたんになったデザイン!いろんなサイトに使いやすい
  2. やっぱり速い表示速度!
  3. 便利なスマホ用スライドメニュー
  4. 記事作成パーツがアップデート(投稿画面から簡単挿入)
  5. 【カテゴリー一覧ショートコード】でトップページが作り込める
  6. ランキングラベルも作れる【記事一覧ショートコード】
  7. カルーセルスライダーも搭載!記事の好きな場所に設置可能
  8. 色々なボタンを簡単に設置可能
  9. 吹き出しのアイコンがピョコピョコ動く
  10. 一回購入で複数のサイトに使用可能だからお得
  11. アニメーションが簡単!アイコンや文字など投稿画面からかんたん設定可能です。

【AFINGER WING】はインフォトップというサービスを仲介しての購入になります。

このサイトからの特典も付属しますので、以下の注意点をしっかり確認した上で購入する様にしてください。

こだま
インフォトップの決済ページでは”外注化マニュアルキットNEO”が 表示されていることを必ずご確認ください。

左のボタンにチェックが入っている事も忘れずに確認してください。

 

表示がない場合はレビュー報酬&特典は受け取ることが出来ませんのでご注意ください。

※クッキーが有効になっていないと”外注化マニュアルキットNEO”は表示されませんので、 クッキーをチェックしてください。

当サイトの特典について

当サイトから【AFFINGER5 WING】を購入すると、【外注化マニュアルキットNEO】が特典が貰えます。

 

今付属の特典【外注化マニュアルキットNEO】は、アフィリエイターの為の記事外注化マニュアルになります。

どうやって記事を外注すれば効率化できるのか知っておきたいポイントがまとめられている、とてもわかりやすい教材です。

記事作成を加速させる為には必要不可欠の情報が満載ですのでこの機会にどうぞ♪

【AFFINGER5 WING】 単品での購入はコチラ⇩ 1万4800円

当サイト限定特典付き

WING AFFINGER5 特典付きはコチラ

※外注化マニュアルキットNEO付き

AFFINGER PACK3(WING対応) 3万9800円

【Affingert wing】本体と【タグマネージャー3】、【ABテストプラグイン】のセットです。)

当サイト限定特典付き

AFFINGER PACK3(WING) 特典付きはコチラ

※外注化マニュアルキットNEO付き

こだま
【PACK3】はAFFINGER WING本体と、タグ管理マネージャー、それからクリック率の比較などに便利なABテストプラグインのセットです。

3つを別々に買うと5万1400円もする所、3万9800円と1万円以上も安いのがポイントです。

ただ、値段が高い事と、後で必要があれば買い足していける事を考えると、始めはAFINGER WING単品購入でも良いかと思います。

 

  • この記事を書いた人
  • 最新記事

こだま

アフィリエイトは2013年ぐらいから始めて、ワードプレスは知識ゼロで2015年ぐらいから使い始めました。 このブログではワードプレスのテーマやプラグインの機能などを比較しながら初心者にも分るように紹介していきます。 『簡単に出来る』ワードプレスやアフィリエイトの情報発信をを心がけています♪

-アフィンガー4, 有料テーマ・テンプレート
-

Copyright© ワードプレス探検隊 , 2019 All Rights Reserved.