AFFINGER4はシンプルな見た目に仕上げられているため、カスタマイズの少し大変なテンプレートではあります。
しかし全くのHTML/CSS初心者でもカスタマイズできるよう、ほぼコピペだけで済むように工夫させてもらいました。さらに写真/イラストをふんだんに使ってサポートさせて頂きます。
まずはAFFINGER4のヘッダーカスタマイズから始めていき、メイン・サイド・フッターへとカスタマイズをすすめていきたいと思います。
【AFFINGER4】ヘッダーカスタマイズ
「ヘッダー」はサイトの顔とも言える部分です。ユーザーに第一印象を与える非常に重要な部分ですので、ここを綺麗に使いやすくデザインしておくのは必須です。また、オリジナリティを持たせてサイトを覚えてもらおうとする努力をすれば尚良しかと思いますね！
ではどうやってAFFINGER4のヘッダー部分をカスタマイズしていくのかをこれからお話ししましょう。
ヘッダー画像を変更する
まずはヘッダー画像を変更します。
ヘッダー画像の変更は、管理画面から「カスタマイズ」>「ヘッダー画像」と進めばできますので非常に簡単です。
ヘッダー画像のサイズは幅1060px以上のものが良いでしょう。画像はフリー素材サイト（ぱくたそ、フォトリア）などから拾ってきてもいいですし、ココナラなどで外注に頼んでしまうというのも良いですね。もちろん自分で作れるなら作ってしまうのもアリですよ！
背景画像を設定する
次は背景画像を付けてみましょう！
背景画像も管理画面から「カスタマイズ」>「背景」と進めばCSSなど不要で簡単に設定することができます。
サイトに使える背景のフリー素材はこちらのサイトのまとめを参考にしながら探してみるといいでしょう。良いフリー素材がたくさん見つかりますので、ここから気に入ったものを選んで、背景としてアップロードしましょう！
メニューを作る
大方見た目も整ってきたので、ここでメニューを配置してみましょう。
AFFINGER4ではメニューも「カスタマイズ」から簡単に設定できるようになっています。詳しい方法につきましては以下の記事にまとめていますので、こちらを参考にカスタマイズしてみてください！
メニューをデザインする
メニューを配置したはいいけど、デフォルトデザインはあまり気に入らないという人も多いかと思います。そこで、CSSを使ってメニューをデザインしてみましょう！
おすすめしたいAFFINGER4のメニューデザインにつきましてもまとめさせてもらいましたので、こちらを参考にカスタマイズしてみてください。HTML/CSSは必要ですが、ほぼコピペでOKに仕上げています。
ヘッダー背景をカスタマイズ
次はヘッダー背景を設定しましょう。背景色や影をつけるようにすると見た目がグッと引き締まります。
これらのカスタマイズにもCSSは必要ですが、これもかなり簡単ですのでご安心を。参考記事を読んでいただければ余裕で設定できるはずです。
【AFFINGER4】記事のカスタマイズ
次はAFFINGER4の記事(メイン)部分のカスタマイズに移ります。
記事はサイトの命です。読者に分かりやすく伝えるための工夫を必死に凝らす必要があるので、カスタマイズする上で最もこだわるべき部分かもしれません。
また、記事を読み終えた読者をどうやって誘導するのかも考えてカスタマイズをする必要があります。SNSで拡散してもらいたい、サイトをもっと見て回ってもらいたいと考えるなら、そのためのカスタマイズを取り入れていくべきです。
そこで、ここではAFFINGER4を利用する上で取り入れたい記事カスタマイズをまとめてみました！
見出しをカスタマイズする
まずカスタマイズしたいのはAFFINGER4の見出し部分です。
大見出し、小見出し共に、テンプレートのこのままではお世辞にも個性があるとは言えないような状態です。そこで自分のサイトのテーマにあった見出しを配置するようにしましょう！
AFFINGER4で是非導入したい見出し8選を用意しておきましたので、これを参考にしながら自分にあった見出しをカスタマイズしてみてくださいませ！
商品ランキングを作成する
AFFINGER4の独自機能といえば「ランキング作成」です。
アフィリエイトに特化して作られたAFFINGER4では、HTML/CSSを知らない人でも簡単にランキング作成ができるようになっているのです。記事内はもちろんのこと、記事下、サイドバーなどに指定してランキングを貼り付けることだってできるのです。その方法も詳しく説明させてもらいます。
【限定】SNSボタンをカスタマイズする
最後にAFFINGER4のSNSボタンをカスタマイズしてみましょう。
AFFINGER4はフラットデザインなSNSボタンとなっていますが、これをふわっと押せるSNSボタンに仕上げてみたいと思います。押せる風にカスタマイズをすることで、SNSでの拡散を誘おうという作戦ですね。
【AFFINGER4】サイドバーのカスタマイズ
次はAFFINGER4のサイドバーをカスタマイズしていきましょう。
サイドバーはメインを補助する名脇役です。メインで紹介している商品の販売ページへと誘ったり、ユーザーを興味のある記事へと導いてくれたりするのが主な役割ですね。
そんな脇役のサイドバーも綺麗に整えておくとユーザーにとっても利用しやすいサイトになり、売り上げアップが見込めます。そのためのAFFINGER4カスタマイズもガッツリまとめさせてもらいましたよ！
【AFFINGER4】フッターカスタマイズ
最後にAFFINGER4のフッターカスタマイズをしましょう。
フッターカスタマイズは任意ではありますが、カスタマイズをしておくとサイトの回遊率は間違いなく上がるでしょう。
サイト下部まで降りた時に何も記事がなかったら離脱をされてしまう可能性が高くなるんですけれど、フッターを開発していれば他の記事に飛んでくれるカモしれませんから、離脱リスクを軽減できるというわけですね！
【限定】フッター開発の方法
では、フッター開発の方法をお伝えさせていただきましょう。
この記事でご紹介するフッター開発は、AFFINGER4の既存のフッターメニューと連携したものとなっています。
誰でもフッターメニューを設定するだけで、簡単にフッター開発ができるようにカスタマイズさせていただきました！
【AFFINGER4】カスタマイズまとめ
AFFINGER4の全カスタマイズ、いかがでしたでしょうか？
たとえHTML/CSSの初心者でも苦戦しないように、ほとんどコピペでサイトを仕上げられるように設計をしておきました。なのでアフィリ初心者はもちろん、コーディングが苦手な方でもAFFINGER4を見た目の綺麗なサイトに仕上げられるはずです！
ここまでカスタマイズが出来たら、AFFINGER4のランキング作成機能なども駆使して、アフィリエイトの売り上げをガンガン増やしていきましょう（＾◇＾）
ちなみにAFFINGER4は通常6500円ですが、当サイトであれば5500円の特別価格で購入できます。まだ持っていない人はぜひ今すぐゲットしちゃってください！
