ブログ

AFFINGER6(アフィンガー6)の使い方を徹底解説

AFFINGER6(アフィンガー6)の使い方を徹底解説
AFFINGER6(アフィンガー6)の使い方を徹底解説
悩む人

最近、AFFINGER6(アフィンガー6)を購入したブログ初心者です。

しかし、AFFINGER6(アフィンガー6)の使い方がまったくわかりません。

そこで、AFFINGER6(アフィンガー6)の使い方を初心者でもわかるように教えてください。

こんな疑問を解決します。

本記事の内容

  • AFFINGER6(アフィンガー6)とはどんなテーマなのか?【前提知識】
  • AFFINGER6(アフィンガー6)の使い方を徹底解説

この記事を書いている「まぁや」も、ブログ開始当初からAFFINGER6(WordPressテーマ)を導入して楽しんで、収益もあげています。

Masatoshi

AFFINGER6(アフィンガー6)は、かなり優秀なテーマです。

しかし、優秀なテーマだけに、ブログ初心者にとって、わからない箇所などが多数あります。

そこで今回は、AFFINGER6(アフィンガー6)の使い方を徹底解説します。

この記事を読めば、ブログ初心者でも簡単に使い方をマスターできるので、最後まで読んでみてください。

では、いきましょう。

これからブログも始めたい方には、【はじめて】10分でできるWordPressブログの始め方を解説にて丁寧に解説していますのでご覧ください。

 本気でブログで稼ぎたい方へ

結論、アフィリエイトASPに登録しておきましょう。

ぶっちゃけ、AFFINGER6を購入しただけでは、スタートラインに立っただけです。

ASPへ登録しつつ、アフィリエイトで収益を伸ばしていくべしです。

以下は、すべて無料登録ができるものをまとめておきました。

>>【初心者】おすすめの人気アフィリエイト【ASP16選】

AFFINGER6(アフィンガー6)の使い方を徹底解説

AFFINGER6(アフィンガー6)の使い方を徹底解説
AFFINGER6(アフィンガー6)の使い方を徹底解説

その前に、

AFFINGER6(アフィンガー6)とは?【使い方を知る前に】

最初に、AFFINGER6(アフィンガー6)の使い方を知る前に、AFFINGER6(アフィンガー6)についてサクッと解説しておきますね。

AFFINGER6(アフィンガー6)の基本情報

 AFFINGER6(アフィンガー6)の基本情報

商品名AFFINGER6(WordPressテーマ)
機能性
カスタマイズ性
操作性(使いやすさ)
料金¥14,800円(税込)
AFFINGER6(アフィンガー6)の基本情報

WordPressの有料テーマの中では、比較的コスパのいい値段設定になっています。

また、AFFINGER6(アフィンガー6)には、さまざまなプランがありますが当サイトでは1番シンプルなプランであるACTION(AFFINGER6版)を利用しています。

AFFINGER6(アフィンガー6)のメリット

AFFINGER6(アフィンガー6)のメリット

  • 複数サイトで運用OK
  • SEO内部対策がバッチリ
  • モバイルの表示速度が速い
  • カスタマイズ性がかなり高い
  • 有名なテーマなので信頼性あり

このように、AFFINGER6(アフィンガー6)には、多くのメリットがあります。

AFFINGER6(アフィンガー6)は、アフィリエイトに特化しているテーマなので、ブログでマネタイズを考えているブログ初心者には最適です。

実際、AFFINGER6(アフィンガー6)を使って月に7桁以上稼いでいるブロガーさんがゴロゴロいます。

Masatoshi

「もう少し実際、AFFINGER6(アフィンガー6) について知りたいな...。」という方は以下の記事で詳しく解説しているので、そちらを読んでみてください。

>>AFFINGER6はブログ初心者でも使える?

AFFINGER6(アフィンガー6)の使い方を10選を解説

AFFINGER6(アフィンガー6)の使い方を10選

  • AFFINGER6(アフィンガー6)の使い方①:カスタマイズ編
  • AFFINGER6(アフィンガー6)の使い方②:文字の装飾編
  • AFFINGER6(アフィンガー6)の使い方③:ボックス編
  • AFFINGER6(アフィンガー6)の使い方④:ボタン編
  • AFFINGER6(アフィンガー6)の使い方⑤:吹き出しの出し方編
  • AFFINGER6(アフィンガー6)の使い方⑥:ランキング編
  • AFFINGER6(アフィンガー6)の使い方⑦:グラフ(表)編
  • AFFINGER6(アフィンガー6)の使い方⑧:目次の作り方編
  • AFFINGER6(アフィンガー6)の使い方⑨:Google連携編
  • AFFINGER6(アフィンガー6)の使い方⑩:SNS編

ひとつひとつ解説していきますね。

AFFINGER6(アフィンガー6)の使い方①:カスタマイズ編

AFFINGER6(アフィンガー6)の使い方①:カスタマイズ編
AFFINGER6(アフィンガー6)の使い方①:カスタマイズ編

まずは、ブログの顔でもあるAFFINGER6(アフィンガー6)のカスタマイズについてお話ししていきます。

AFFINGER6(アフィンガー6)をカスタマイズする上で重要な点は以下の3つです。

  • 読者を引き込めるか
  • 読んでいて疲れないか
  • シンプルすぎず派手すぎないか

上記の3つの点を100%実現できるテーマがAFFINGER6(アフィンガー6)です。

具体的な、AFFINGER6(アフィンガー6)のカスタマイズ方法はAFFINGER6のデザイン・カスタマイズを解説【画像付き】にて詳しく解説しています。

よくある質問:カスタマイズにどれくらい時間がかかる?

 カスタマイズですが、実際にかけた時間は1時間ほど。

ブログのカスタマイズにあまり時間をかけずに、AFFINGER6(アフィンガー6)なら「いい感じ」にできます。

Masatoshi

AFFINGER6(アフィンガー6)の使い方②:文字の装飾編

AFFINGER6(アフィンガー6)の使い方②:文字の装飾編
AFFINGER6(アフィンガー6)の使い方②:文字の装飾編

AFFINGER6(アフィンガー6)なら以下のように文字装飾ができます。

  • 太文字
  • 小文字
  • 大文字

また、ひとことで文字の装飾と言っても、AFFINGER6(アフィンガー6)では、さまざまな文字の装飾ができます。

 文字装飾の具体例

これはメモです

これは吹き出しです

これは注意です

これはマルです

このように、読者に印象の残りやすい文字の装飾ができます。

文字装飾を使うメリット

AFFINGER6(アフィンガー6)で文字装飾を使うメリットは、以下のとおりです。

  • 読者に飽きさせない
  • 読者の印象が残りやすい
  • 読者にわかりやすく説明する

つまり、単にブログを書くだけが読者のためになるのではなく、文字の装飾などを行うことでも読者のためになります。

また、いきなりすべての文字の装飾を使おうとするのではなく、まずは、3つ程度使うものを決めておき、慣れてきたら増やしていけばOKです。

実際、わたしもAFFINGER6(アフィンガー6)を導入した1ヶ月目は2つほどしか、文字の装飾を使っていません。

Masatoshi

文字装飾の使い方

次に、AFFINGER6(アフィンガー6)の文字装飾の使い方を説明していきます。

タグ」→「テキストパーツ」→「クリップメモ」→「メモ」をクリックすると、文字の装飾(メモ)が表示されます。

あとは、文字の装飾の中に表示させたい文字を下記の画像の箇所に入力すればOKです。

間違えずに文字を入力すれば、下記のように反映されます。

文章の装飾

AFFINGER6(アフィンガー6)の使い方③:ボックス編

次は、AFFINGER6(アフィンガー6)で表示できるボックスの使い方を解説していきます。

表示できるボックスの例

 表示できるボックスの例

ポイント

メモ

注意

このように、さまざまなボックスをAFFINGER6(アフィンガー6)であれば表示できます。

ボックスを使うメリット

ボックスを使うメリット

AFFINGER6(アフィンガー6)でボックスを使うメリットは、以下の3つです。

  • 読者の離脱を下げる
  • 言葉の強調などができる
  • 他サイトとの差別化ができる

ボックスを使うことで、読者に言葉の強調などができます。

文字の装飾などでも言葉の強調はできますが、ボックスの方が有効的です。

Masatoshi

よくある質問①:どれくらいの頻度でボックスを出すべき?

 よくある質問①:どれくらいの頻度でボックスを出すべき?

結論、文章が4行以上続いた場合、ボックスを使うべき。

なぜなら、文章が続いてしまうと、読者がブログから離脱してしまう可能性が高いからです。

そのため、1つの見出しの中で文章が4行以上続いたら、必ずボックスを使いましょう。

よくある質問②:ボックスは何種類使うべき?

 よくある質問②:ボックスは何種類使うべき?

基本的にボックスの種類は2種類までにしましょう。

その理由は、ボックスが増えるということは、読者の印象に残りづらくなるからです。

結果、あなたのブログを読んでも何も得られなかったという印象だけが残ります。

それを防ぐためにも、1つの記事で使用するボックスは基本的に2種類までにしましょう。

ボックスの使い方

AFFINGER6(アフィンガー6)のボックスの使い方は、かなり簡単です。

タグ」→「ボックスデザイン」→「マイボックス」→「基本」で基本のボックスを出すことができます。

また、ボックスの中に文字を入れる場合は、以下の画像の空白の箇所に入力すればOKです。

ボックスには、さまざまな種類があるので自分の中でお気に入りを見つけてください。

Masatoshi

AFFINGER6(アフィンガー6)の使い方④:ボタン編

AFFINGER6(アフィンガー6)で表示できるボタンは、主に以下の3種類です。

  • ノーマルのボタン
  • 光るボタン
  • 吹き出しがあるボタン

ノーマルのボタン

比較的に、シンプルなボタンです。

アフィリエイトを行う上で、押し売りはNGでして、押し売り感をあまり出したくない方向けのボタンですね。

ボタン

光るボタン

ノーマルのボタンが光るタイプのボタンです。

一見、ボタンが光ると押し売り感が強くなる印象ですが、実はそれは大きな間違いです。

ボタンの種類を変えるだけで、アフィリエイトのクリック率が大きく変わります。

ボタンは、そもそもクリックされないとアフィリエイトの成約まで持ち込めませんから、第一段階のクリック率をあげることはかなり重要です。

ボタン

吹き出しがあるボタン

 光るタイプのボタンに吹き出しがついているタイプのボタンです。

吹き出しがあることによって、ノーマルのボタンよりも付加価値が付くため、通常よりもクリック率が上がる可能性が高いです。

とはいえ、あまりにも多くの文字を吹き出しに入れてしまうと、読者が混乱してしまうので注意が必要です。

\吹き出しを作れる/

ボタン

ボタンの使い方

今回は、ノーマルのボタンの使い方を解説します。

タグ」→「カスタムボタン」→「ノーマル」→「基本」をクリックすると、ノーマルのボタンが表示されるコードが出ます。

少しごちゃごちゃとしたコードが出てきましたが、まったく焦る必要性なしです。

ここで入力することは以下の2つだけです。

  • url="アフィリエイトのURL"
  • title="ボタンに表示するタイトル"

他の光るボタンや吹き出しがついているボタンでも、上記と同様の事項を入力すればOKです。

ボタンの色を変える方法

AFFINGER6(アフィンガー6)には、元々6色ほどのボタンの色の種類があります。

また、AFFINGER6(アフィンガー6)のデフォルトの状態であるボタンの色以外のものを使いたい場合は、color="#000000"という箇所を変更すればOKです。

カラーコードについては、カラーコード一覧表を参考にしてみてください。

AFFINGER6(アフィンガー6)の使い方⑤:吹き出しの出し方編

AFFINGER6(アフィンガー6)では、吹き出しの出し方といっても、吹き出しには2種類あります。

 吹き出しの種類

  • 人物の言葉の吹き出し
  • 文字やアイコンの吹き出し

では、順に説明していきます。

吹き出し①:人物の言葉

悩む人

こんにちは

こんにちは

Masatoshi

人物の言葉の吹き出しを使うことによって、読者視点で物事を解説できます。

では、AFFINGER6(アフィンガー6)で人物の言葉の吹き出しを出す方法をご紹介していきますね。

アイコンの設定を行う

アフィンガー6管理」→「会話・ファビコン管理」→「会話風アイコン」で設定できます。

  • アイコン下に表示される名前
  • アイコンで表示する画像

上記の2点を記入してください。

人物の言葉の吹き出しの出し方

タグ」→「会話吹き出し」→「会話1」を選択してください。

※「会話1」とは先ほど設定した画面に表示されている番号です。

選択すると、2つのかたまりのコードが表示されるので、間に吹き出し部分に記載したい言葉を入力すればOKです。

なお、吹き出しは色などを変えることができまして、詳しくはAFFINGER6(アフィンガー6)で会話の吹き出しを出す方法【カスタマイズできる】にて解説しています。

吹き出し②:文字やアイコン

文字やアイコンの吹き出しの具体例は、以下のとおりです。

自由なメモ

ココがポイント

さらに詳しく

文字やアイコンの吹き出しを使うことで、読者の注意を引くことができます。

では、文字やアイコンの吹き出しの出し方を解説していきますね。

文字やアイコンの吹き出しを出す

タグ」→「テキストパーツ」→「複合」で文字やアイコンの吹き出しを出せます。

文字を入力していく

さまざまなコードが出てきましたが、上の画像で「ここに入力」という部分に文字を入力すればOKです。

AFFINGER6(アフィンガー6)の使い方⑥:ランキング編

AFFINGER6(アフィンガー6)は、ランキング形式の装飾に特化しています。

ランキング1位

ランキング2位

ランキング3位

上記のとおりでして、AFFINGER6(アフィンガー6)では、ボタン1つでランキング形式の装飾を表示させられます。

ランキングを使うメリット

AFFINGER6(アフィンガー6)でランキングを使うメリットは、ブログを収益化させるためです。

また、ブログを収益化させるには、アフィリエイトを始める必要がありまして、以下の記事では、ブログ初心者が登録しておくべきASPをご紹介しています。

>>【初心者】おすすめの人気アフィリエイト【ASP16選】

1つ3分ほどで無料登録ができるので、この機会にサクッと登録しておきましょう。

Masatoshi

ランキングの使い方

AFFINGER6(アフィンガー6)のランキングの使い方もかなり簡単です。

タグ」→「ランキング」を選択し、順位を決定するのみです。

また、ランキングマークの横に文字を入れることで、よりランキングの具体性が増します。

補足:星(スター)を出す方法

評判やレビュー記事などに、星を使うと効果的です。

タグ」→「その他のパーツ」→「スター」を選択し、星のレベルを選択してください。

上記のとおりでして、AFFINGER6(アフィンガー6)であれば、ボタン1つで簡単に星を表示させられます。

AFFINGER6(アフィンガー6)の使い方⑦:グラフ(表)編

AFFINGER6(アフィンガー6)では、ボタン1つでグラフ(表)を出せます。

無料テーマ有料テーマ
機能面
カスタマイズ面

上記のとおりでして、グラフ(表)を使用するorしないによって、読者がブログを読みやすくなったりします。

グラフ(表)の使い方

タグの隣にある「グラフ」→「テーブル」→「行列」を選んでいきましょう。

グラフが表示されたら、あとはグラフに文字や数字を記入していくだけです。

グラフ(表)の色を変える方法

外観」→「カスタマイズ」→「オプションカラー」→「table(表)」を選択してください。

それぞれの項目でグラフ(表)の色を簡単に変えられます。

グラフ(表)をスクロールさせる方法

結論、グラフ(表)を以下のHTMLコードでサンドすればOKです。

HTMLコード:<div class="scroll-box">グラフ</div>

とはいえ、あまりイメージできていない方もいるかもなので、実例をご紹介しますね。

以下は、グラフのHTMLコードです。(スクロール設定をする前)

あとは、先ほどご紹介したコードで上記のグラフのHTMLコードをサンドするだけです。

完成形としては、以下の画像のとおり。

しっかりと、スクロール用のコードが入力されていますね。

AFFINGER6(アフィンガー6)の使い方⑧:目次の作り方編

AFFINGER6(アフィンガー6)で目次を作る手順は2つです。

 アフィンガー6で目次を作る手順

  • プラグインをインストール
  • プラグインを設定

では、順に説明していきます。

手順①:プラグインをインストール

AFFINGER6(アフィンガー6)では、目次を作るときに「Table of Contents Plus」というプラグインを使用します。

「Table of Contents Plus」を「プラグイン」→「新規追加」でインストールしましょう。

インストールが完了したら、有効化をお忘れなく。

Masatoshi

手順②:プラグインの設定を行う

次は、「Table of Contents Plus」の設定を行います。

プラグインのインストールが完了すれば「設定」→「TOC +」をクリックしてください。

では、具体的な設定方法を解説していきますね。

ここで入力すべき項目は、以下の2点です。

  • 目次が表示される条件
  • 目次のタイトル名

上記の2点の記入が完了したら下へスクロールして「設定を更新」をクリックしてください。

具体例:目次の完成形

こんな感じになっていればOKです。

以上が、AFFINGER6(アフィンガー6)の目次の使い方や作り方でした。

AFFINGER6(アフィンガー6)の使い方⑨:Google連携編

AFFINGER6(アフィンガー6)を使うなら、必ずGoogle連携を行いましょう。

なぜなら、いくら優秀なテーマであるAFFINGER6(アフィンガー6)を使用しても、分析をしなければ、ブログを成長させられないからです。

では、AFFINGER6(アフィンガー6)をGoogleのツールと連携する方法を解説していきますね。

アフィンガー6管理」→「Google連携」をクリックしてください。

そこで、以下の2つのコードを入力すればOKです。

  • Googleアナリティクス:トラッキングID
  • Googleサーチコンソール:HTMLタグ

※当ブログは、既にGoogle連携をしているため、それぞれの入力項目がありません。

ちなみに、Google関連ツールの導入は、次の2記事が参考になるかもです。

>>WordPressでグーグルアナリティクスを設定する方法【GA4対応】

>>WordPressでグーグルサーチコンソールを設定する方法

AFFINGER6(アフィンガー6)の使い方⑩:SNS編

最後に、AFFINGER6(アフィンガー6)でSNSの設定方法を解説しますね。

SNS設定をするメリット

SNS設定をしておくと、「ブログ」→「SNS」といったように、読者をSNSへと誘導することができます。

読者の目につく位置に設定していますね。

実際に、当ブログもSNS設定をしていたおかげで、企業さんから企業案件の依頼をいただけるようになりました。

SNS設定をする方法

では、具体的に、AFFINGER6(アフィンガー6)でSNSの設定をする方法を解説していきますね。

使用しているSNSのURLを入力していくために、「ユーザー」へと移動しましょう。

あとは、「SNSのURL」を入力すればOKです。

最後に、URLが合っているかを確認しましょう。  

Masatoshi

SNSアイコンがうまく表示されない時

とはいえ、「SNSを設定したけれど、うまく表示されない」といった問題が起こるかもです。(実際に、当ブログもSNSアイコンが表示されませんでした)

そんな時は、「Font Awesome」というプラグインをインストールすれば解決しますよ。

上記のプラグインですね。

「Font Awesome」を使うことで、AFFINGER6(アフィンガー6)にSNSアイコンが表示されるようになったかと思います。

※もし、プラグインをインストールしても解決しない場合は、「AFFINGER6公式のお問い合わせ」を利用してもいいかもしれません。

補足:目次以外で導入すべきプラグイン

 「アフィンガー6を導入したけれど、どのプラグインを導入すればいいのかわからない...」といった方は、以下の記事でAFFINGER6(アフィンガー6)におすすめのプラグインを解説しているので、そちらを参考にどうぞ。

>>【保存版】WordPressおすすめプラグイン11選【導入手引きあり】

余談:お問い合わせフォームも設置しておこう

最後に余談ですが、お問い合わせフォームも設置しておくといいですよ。

お問い合わせフォームはサクッと作ることができまして、作り方についてはWordPressの初期設定を分かりやすく解説【最低14つ】にて詳しく解説していますので、そちらを参考にどうぞ。

まとめ:AFFINGER6(アフィンガー6)の使い方は少しずつマスターすればOK

今回は、AFFINGER6(アフィンガー6)の使い方を徹底解説しました。

AFFINGER6(アフィンガー6)は、優秀なテーマですが、すべての使い方をマスターするまでには、かなりの時間が必要になってきます。

そのため、1日少しずつでOKなので、AFFINGER6(アフィンガー6)の使い方をマスターしていきましょう。

なお、AFFINGER6(アフィンガー6)の購入手順などはAFFINGER6(アフィンガー6)の購入からダウンロード方法を解説を参考にどうぞ。

AFFINGER6(アフィンガー6)の使い方を10選

  • AFFINGER6(アフィンガー6)の使い方①:カスタマイズ編
  • AFFINGER6(アフィンガー6)の使い方②:文字の装飾編
  • AFFINGER6(アフィンガー6)の使い方③:ボックス編
  • AFFINGER6(アフィンガー6)の使い方④:ボタン編
  • AFFINGER6(アフィンガー6)の使い方⑤:吹き出しの出し方編
  • AFFINGER6(アフィンガー6)の使い方⑥:ランキング編
  • AFFINGER6(アフィンガー6)の使い方⑦:グラフ(表)編
  • AFFINGER6(アフィンガー6)の使い方⑧:目次の作り方編
  • AFFINGER6(アフィンガー6)の使い方⑨:Google連携編
  • AFFINGER6(アフィンガー6)の使い方⑩:SNS編

今回は以上です。

-ブログ
-,