AFFINGER5

AFFINGER5(アフィンガー5)のカスタマイズ方法まとめ

AFFINGER5(アフィンガー5)のカスタマイズ方法まとめ
AFFINGER5のサイトをオリジナルにカスタマイズする方法を知りたい!
AFFINGER5をオシャレにカスタマイズしたいけど手順が分からない!

今回はこんな悩みを解決していきます。

AFFINGER5(アフィンガー5)は設定項目がたくさん用意されており、デザインを自由自在にカスタマイズできる優れたWordPressテーマです。

とはいえ設定項目が多すぎるので、「どんな設定ができるの?」「どこから設定を行うの?」といった疑問もあることでしょう。

そこで今回はAFFINGER5(アフィンガー5)のあらゆるカスタマイズ方法を徹底解説していきます!

今回紹介するAFFINGER5(アフィンガー5)のカスタマイズまとめ

これらのカスタマイズ方法を全部解説しちゃいます!!!

当サイトではウェブサイトやブログに関する記事を毎日投稿しています。
他の記事も合わせて読んでいただけると嬉しいです。

\今なら当サイト限定の豪華特典付き/

AFFINGER5の詳細を見る

当ブログのボタンからAFFINGER5を購入すると...?

当ブログからAFFINGER5を購入していただくと初心者ブロガーには嬉しい豪華特典が盛りだくさん!

【厳選】愛用WordPressプラグインリスト25選

特化型サイトの構築方法を徹底解説したPDFデータ

ドメインパワーの上げ方【有料noteを無料でプレゼント】

最強の被リンクSEO施策解説【有料noteを無料でプレゼント】

【AFFINGER5公式特典】5000円相当の有料プラグイン「STINGERタグ管理プラグイン」を無料プレゼント

これら5つの特典が全部ついてきます!

特典に興味を持ってくださった方は、当サイトに設置してある「AFFINGER5の詳細を見る」または「AFFINGER5を購入する」と書かれたオレンジ色のボタンよりテーマを購入していただくと、特典付きのファイルがダウンロードできます。

AFFINGER5カスタマイズ方法①初期設定

AFFINGER5(アフィンガー5)を導入したらいきなり記事を書くのではなく、最初に行わなければならないのが初期設定です。

最初の内にやっておかないと後々痛い目を見ることになる設定もありますので、記事を書く前に全部済ましておくことをオススメします。

具体的には以下の通り。

AFFINGER5の初期設定概要

  1. 一般設定
  2. パーマリンク設定
  3. Classic Editorを導入
  4. AFFINGER5管理画面の初期設定
  5. ASPに登録
  6. WordPressプラグインの導入

どれもWordPressブログの運営において欠かせない設定です。

初期設定の詳細についてはこちらの記事をご覧ください。

AFFINGER5の初期設定の手順をご紹介!【最速でWordPressブログを始めよう】
AFFINGER5の初期設定の手順【WordPressブログの始め方】

続きを見る

AFFINGER5カスタマイズ方法②トップページ作成

アフィンガー5は他のテーマと比べて使用人数が非常に多いため、サイトデザインが被りやすいというデメリットがあります。

そういったリスクを避けるためにも、標準の便利機能を上手に使いながらサイトデザインをオシャレにカスタマイズする必要があるのです。

具体的にはスライドショーやヘッダーカード、バナー風ボックスといった機能を使います。

トップページのカスタマイズ方法についてはこちらの記事をご覧ください。

AFFINGER5でオシャレなトップページを作る方法を大公開!
AFFINGER5でオシャレなトップページを作る方法

続きを見る

AFFINGER5カスタマイズ方法③プロフィールカード設定

アフィンガー5ではサイト管理者のプロフィールをサイト内に表示できます。

またプロフィールには「デフォルトデザインのプロフィール」「カード化したプロフィール」の2種類があります。

デフォルトのプロフィールカード

デフォルトのプロフィール

カード化したプロフィール

カード化したプロフィール

見ての通り「デフォルトのプロフィール」のデザインはオシャレさに欠けるので、多くの人は「カード化したプロフィール」にカスタマイズしています。

またプロフィールカード内の表示内容についても自由に選択できるのも特徴の1つです

プロフィールカードのカスタマイズ方法を詳しく知りたい方はこちらの記事をご覧ください。

AFFINGER5でプロフィールカードを作成する方法【誰でも簡単!】
AFFINGER5でプロフィールカードを作成する方法【誰でも簡単】

続きを見る

AFFINGER5カスタマイズ方法④目次設置

この記事のページ上部にもあると思いますが、アフィンガー5では、簡単な設定を行うだけで全記事に自動で目次を設置することができます。

実際の表示はこんな感じ。

AFFINGER5(アフィンガー5)の目次完成イメージ

シンプルで見やすい上に、テキストをクリックすれば該当箇所に移動できます。

ちなみにアフィンガー5では「標準機能で目次を設置する方法」と「目次プラグイン(Table of Contents Plus)で目次を設置する方法」の2種類の方法があります。

個人的には作業量の少ない「プラグインで目次を設置する方法」がオススメです。

またいずれの場合でも目次のカラーやアイコン、表示形態をカスタマイズすることができます。

目次の詳しい設置方法についてはこちらの記事をご覧ください。

AFFINGER5(アフィンガー5)でオシャレな目次を作成する方法
AFFINGER5(アフィンガー5)でオシャレな目次を作成する方法

続きを見る

AFFINGER5カスタマイズ方法⑤お問い合わせフォーム作成

お問い合わせフォームは閲覧ユーザーとサイト運営者とのコミュニケーションの役割を持つ非常に重要なページです。

フォームを通じて仕事の依頼が来ることだって珍しくありません

実際Googleアドセンス広告の審査でも「お問い合わせフォームの設置」は合格のための必須項目と言われているほどです。

そしてアフィンガー5では専用のプラグイン「Contact Form 7」を使うことで簡単にお問い合わせフォームを設置できます。

お問い合わせフォームの作成方法・カスタマイズ方法はこちらの記事をご覧ください。

AFFINGER5(アフィンガー5)でお問い合わせフォームを簡単に設置する方法
AFFINGER5(アフィンガー5)でお問い合わせフォームを設置する簡単な方法

続きを見る

AFFINGER5カスタマイズ方法⑥ブログカード作成

アフィンガー5では自サイトの他の記事のリンク(内部リンク)を埋め込むする時、ブログカードとして表示させる標準機能が用意されています。

このブログカードは思わずクリックしたくなるデザインなので、「関連記事」や「おすすめ記事」を埋め込む際には非常に便利な機能です。

閲覧ユーザーにより多くの記事を見てもらうためにもブログカードを導入しておくと良いでしょう。

自サイト以外のリンク(外部リンク)については「Pz-LinkCard」というプラグインでカード化して埋め込むことができます

アフィンガー5での内部リンクや外部リンクのブログカードの設置方法・カスタマイズ手順についてはこちらの記事をご覧ください。

AFFINGER5で内部・外部リンクのブログカードを作る方法
AFFINGER5で内部・外部リンクのブログカードを作る方法

続きを見る

AFFINGER5カスタマイズ方法⑦新着・関連記事一覧エリア

アフィンガー5ではトップページや投稿ページに「新着記事一覧」「関連記事一覧」が自動で挿入されます。

こういった他のページの閲覧を促すエリアもサイトのユーザビリティを向上させる要素の1つです。

アフィンガー5ではこうした記事一覧エリアの設置場所や表示内容について細かくカスタマイズできるようになっています。

新着・関連記事一覧エリアのカスタマイズについてはこちらの記事をご覧ください。

AFFINGER5で新着記事・関連記事エリアをカスタマイズする方法
AFFINGER5で新着記事・関連記事エリアをカスタマイズする方法

続きを見る

AFFINGER5カスタマイズ方法⑧アイキャッチ画像設定

アフィンガー5ではアイキャッチ画像やサムネイル画像の形状やサイズ、表示形式を自由にカスタマイズすることができます。

具体的にはこんな感じ。

  • 丸みを加える
  • 正方形にする
  • サイズを大きくする
  • フルサイズにする
  • ポラロイド風にする

アイキャッチ画像はその記事の概要を伝える重要な要素です。
よりクリックしたくなるように工夫していきましょう。

アフィンガー5でアイキャッチ画像をカスタマイズする方法はこちらの記事をご覧ください。

AFFINGER5でアイキャッチ画像を設定するカンタンな方法をご紹介
AFFINGER5でアイキャッチ画像を設定するカンタンな方法

続きを見る

AFFINGER5カスタマイズ方法⑨おすすめ記事一覧エリア

当ブログの右側のサイドバーにもあるように、アフィンガー5ではおすすめ記事一覧エリアをサイドバーや投稿記事下など好きな場所に設置することができます。

実際の表示はこんな感じ。

おすすめ記事一覧完成形

どの記事をおすすめとして紹介するか、どの記事(投稿記事 or 固定ページ)のどこ(サイドバー or 記事上・下)に設置するか、といった細かいカスタマイズができるのでぜひ設置しておきましょう。

おすすめ記事一覧の作成手順はこちらをご覧ください。

AFFINGER5でおすすめ記事一覧をカンタンに表示する方法
AFFINGER5でおすすめ記事一覧をカンタンに表示する方法

続きを見る

AFFINGER5カスタマイズ方法⑩人気記事の表示

WordPressでは専用のプラグイン「WordPress Popular Posts」を使うことで閲覧数順の記事ランキングを挿入できます。

アフィンガー5では人気記事ランキングを設置する機能が用意されていないので、プラグインを使う形になります。

見出しタイトルや並び順、期間フィルターや対象カテゴリーなど細かいカスタマイズもできますのでおすすめです。

WordPress Popular Postsを使った人気記事ランキングの挿入はこちらをご覧ください。

AFFINGER5で人気記事を表示する方法【WordPress Popular Posts】
AFFINGER5で人気記事を表示する方法【WordPress Popular Posts】

続きを見る

AFFINGER5カスタマイズ方法⑪ランキング作成

商品紹介記事やレビュー記事に欠かせないのがランキング機能です。

アフィンガー5では必要項目を設定するだけで、誰でもカンタンにランキングを作成できます。

実際の表示はこんな感じ。

ランキング

無料版では3位までのランキングを1パターンしか登録できませんが、収益化を目指すアフィリエイターには十分便利な機能と言えるでしょう。

アフィンガー5でランキングを作成する方法についてはこちらの記事をご覧ください。

AFFINGER5でランキングを作成する方法【超カンタン!】
AFFINGER5(アフィンガー5)でランキングを作成する方法

続きを見る

AFFINGER5でランキングが表示されない時の対処法5選
AFFINGER5でランキングが表示されない時の対処法5選

続きを見る

AFFINGER5カスタマイズ方法⑫コピーライト変更

アフィンガー5を導入すると、フッターのコピーライト部分に「Powered by AFFINGER5」というコピーライトが表記されます。

クレジット表記

これでは使用テーマが堂々と書かれていて恥ずかしいですね。

このコピーライトをカスタマイズするには「AFFINGER5専用の無料プラグイン「クレジット削除プラグイン」を用いる」あるいは「直接ソースコードを編集する」ことで対応できます。

アフィンガー5のコピーライトを変更する方法についてはこちらの記事をご覧ください。

AFFINGER5でコピーライトを変更する2つの方法
AFFINGER5でコピーライトを変更する2つの方法

続きを見る

AFFINGER5カスタマイズ方法⑬アドセンス広告設置

初心者ブロガーの大きな目標の1つとして「Googleアドセンス広告の設置」があります。

アフィンガー5なら誰でもカンタンにアドセンス広告をサイト内の好きな場所に配置することができます。

設置場所の例としては以下の通り。

  • 各ページの下
  • n番目の見出し下
  • サイドバー
  • ヘッダー・フッター
  • 記事一覧(インフィード広告)
色々な場所に設置して、どの配置場所が一番クリックされやすいかなどを測定してみるのも良いかもしれません。

アフィンガー5でのアドセンス広告の設置手順については以下の記事をご覧ください。

AFFINGER5でアドセンス審査用コードを設定する方法
AFFINGER5でアドセンス審査用コードを設定する方法

続きを見る

AFFINGER5でアドセンス広告を記事下に設置する方法
AFFINGER5でアドセンス広告を記事下に設置する方法

続きを見る

AFFINGER5でアドセンス広告をn番目の見出し前に設置する方法
AFFINGER5でアドセンス広告をn番目の見出し前に設置する方法

続きを見る

AFFINGER5でアドセンス広告をサイドバーに設置する方法
AFFINGER5でアドセンス広告をサイドバーに設置する方法

続きを見る

AFFINGER5でインフィード広告を設置する方法
AFFINGER5でインフィード広告を設置する方法

続きを見る

アドセンス合格を目指している方はこちらの記事もおすすめ!

Googleアドセンス審査の10個の対策ポイントを徹底解説
Googleアドセンス審査の10個の対策ポイントを徹底解説

続きを見る

AFFINGER5カスタマイズ方法⑭ソースコード表示

アフィンガー5ではショートコードやプログラミングコードをオシャレに見やすく挿入することができます。

プログラミングコード、ターミナルコード、ショートコードの3種類のデザインが用意されており、どれも良いビジュアルとなっています。

実際の表示はこんな感じ。

ソースコード挿入ソースコード挿入ソースコード挿入

ブログ運営やプログラミングの解説ブログを運営している方には欠かせない機能といえます。

アフィンガー5でソースコードを挿入する方法についてはこちらの記事をご覧ください。

AFFINGER5でソースコードを表示させる2つの方法
AFFINGER5でソースコードを表示させる2つの方法

続きを見る

アフィンガーの標準機能ではなくWordPressプラグインを使ってソースコードを表示させたい方はこちらの記事がオススメです。

WordPressテーマとは?
WordPressでソースコードを表示するプラグイン「Highlighting Code Block」の使い方や設定方法をご紹介

続きを見る

AFFINGER5カスタマイズ方法⑮吹き出し会話の表示

アフィンガー5ではコンテンツの内容を分かりやすくするために、画像アイコン付きの吹き出し会話を挿入できます。

実際の吹き出し会話はこんな風に挿入されます
こんな風に左右反転させることもできます

アフィンガーでは全部で8種類のアイコンを登録できるだけでなく

  • 吹き出しの色変更
  • 枠線の有無
  • 角丸設定
  • アイコンに動きを加える

といった風に様々なカスタマイズ項目も用意されています。

アフィンガーでの吹き出し会話の設定手順についてはこちらの記事をご覧ください。

WordPressテーマとは?
AFFINGER5で吹き出し会話を実装する方法

続きを見る

AFFINGER5カスタマイズ方法⑯ヘッダーカード設定

アフィンガー5ではヘッダー部分に、リンクが付与されたカード「ヘッダーカード」を実装することができます。

実際の表示はこんな感じ。

実際のヘッダーカード

ヘッダーカードはページ上部にあるため目に止まりやすく、見てほしい記事を紹介するのに最適な機能です。

またヘッダーカードの画像の見え方や角丸設定、高さや表示形態などのカスタマイズも搭載されているのでお好みで設定してみましょう。

ヘッダーカードの表示方法・カスタマイズ方法についてはこちらの記事をご覧ください。

AFFINGER5でヘッダーカードを表示させる設定方法
AFFINGER5でヘッダーカードを表示させる方法

続きを見る

AFFINGER5カスタマイズ方法⑰スライドショー設置

一般的なWordPressテーマでは専用のプラグインが必要なのですが、アフィンガー5では標準機能を使うだけでオシャレなスライドショーをサイト内の好きな場所に設置することができます。

実際の表示はこんな感じ。

スライドショー完成図

スライドショーのショートコードを使えば、トップページや記事ページ、ヘッダーやサイドバーなどサイト内の至る所に設置できます。

またスライドする内容やスライドのスピード、移動の向きなどの細かいカスタマイズ調整も可能です。

スライドショーの設置方法についてはこちらの記事をご覧ください。

AFFINGER5でスライドショーを設置する方法【カスタマイズの手順も!】
AFFINGER5でスライドショーを設置する方法

続きを見る

AFFINGER5カスタマイズ方法⑱Twitterカード設定

通常WordPressブログの記事をTwitterでシェアすると小さなカードが表示されるのですが、アフィンガー5ではSNS設定を行うことで、Twitterでシェアした時のカードサイズを大きくできます

▼実際の表示はこんな感じ▼

Summaryカード

Summaryカード

大きな画像付きのSummaryカード

大きな画像付きのSummaryカード

Twitterカードはサイズが大きいほうが認識されやすいですし、クリック率も上がると言われています。

アフィンガー5のTwitter設定についてはこちらの記事をご覧ください。

AFFINGER5でTwitterカードを設定する方法
AFFINGER5でTwitterカードを設定する方法【更新したカードの確認方法も】

続きを見る

AFFINGER5カスタマイズ方法おまけAFFINGER5(アフィンガー5)の評判&レビュー

最後におまけとしてアフィンガー5の評判&レビューの記事をご紹介しておきます。

アフィンガー5の実際の口コミや、私が実際に使用して感じたメリット・デメリットなどを詳しく解説しております。

アフィンガー5の購入を考えている方はぜひご覧ください。

【AFFINGER5の評判&レビューまとめ】WordPressテーマの口コミ評価を徹底解説!
AFFINGER5の評判や口コミをご紹介

続きを見る

まとめ:AFFINGER5(アフィンガー5)のカスタマイズ方法まとめ

まとめ:AFFINGER5(アフィンガー5)のカスタマイズ方法まとめ

最後に今回紹介したAFFINGER5(アフィンガー5)のカスタマイズ方法のまとめを確認しておきましょう。

今回紹介するAFFINGER5(アフィンガー5)のカスタマイズ方法まとめ

今回は超人気のWordPressテーマ「AFFINGER5」のカスタマイズ方法を18個ご紹介しました。

AFFINGER5(アフィンガー5)はSEO対策・デザイン性・収益面などあらゆる面で優れた万能WordPressテーマです。

今回紹介したカスタマイズを実践して、より良いWordPressブログを運営していきましょう!

カスタマイズに注力しすぎると記事作成に手が回らなくなってしまい、アクセスが伸び悩んでしまうことがあります。

一番大事なのはコンテンツ作成ということを忘れずに、記事作成とカスタマイズの力加減には十分注意しましょう。

AFFINGER5の購入からインストールまでの手順はこちら!

AFFINGER5の購入からインストールまでの手順を分かりやすくご紹介【画像付き】
AFFINGER5の購入方法からインストールまでの手順をご紹介

続きを見る

AFFINGER5の初期設定まとめはこちらがオススメです!

AFFINGER5の初期設定の手順をご紹介!【最速でWordPressブログを始めよう】
AFFINGER5の初期設定の手順【WordPressブログの始め方】

続きを見る

わからない部分があればTwitterのDMで質問して貰えばすぐに返信します。

今サイトではこれからもウェブサイト運営に関する有益な情報をたくさん発信していきたいと思っていますので応援よろしくお願いします!

\今なら当サイト限定の豪華特典付き/

AFFINGER5の詳細を見る

当ブログのボタンからAFFINGER5を購入すると...?

当ブログからAFFINGER5を購入していただくと初心者ブロガーには嬉しい豪華特典が盛りだくさん!

【厳選】愛用WordPressプラグインリスト25選

特化型サイトの構築方法を徹底解説したPDFデータ

ドメインパワーの上げ方【有料noteを無料でプレゼント】

最強の被リンクSEO施策解説【有料noteを無料でプレゼント】

【AFFINGER5公式特典】5000円相当の有料プラグイン「STINGERタグ管理プラグイン」を無料プレゼント

これら5つの特典が全部ついてきます!

特典に興味を持ってくださった方は、当サイトに設置してある「AFFINGER5の詳細を見る」または「AFFINGER5を購入する」と書かれたオレンジ色のボタンよりテーマを購入していただくと、特典付きのファイルがダウンロードできます。

▼最新映画や漫画が無料で見れちゃう▼
▼最新ドラマや漫画が無料で見れちゃう▼

-AFFINGER5

Copyright © wagtechblog All Rights Reserved.