10日間の無料お試しつき!この記事はこんな人におすすめSANGOユーザーの人ブログの回遊性をアップさせたい人PVを増やしたい人コンテンツが増えすぎたので整理したい人こんにちは!アフィリエイトの超ノウハウコレクターごま吉(@Lv1gomakichi)です。おかげさまで2019年3月より更新を続けていた当ブログも200記事を達成!更新6ヶ月でノウハウも貯まり、ブログのデザインも随分変化しました。トップページ、カテゴリページを変えました今後は、ブログからサイトっぽく運用を変えていこうと思いカスタムを模索している最中です。永く使われるブログを目指して目標にしてるのは、マクリンさん(@Maku_ring)のブログで「いつかこんなカスタマイズしたいなぁ」とネットサーフィンしてたところ、7桁専業アフィリエイターのみやちまんさん(@masa381)の無料noteに出会い、トレースしつつ自分流にアレンジを入れてみました。ごま吉その後、この部分「どうやったの?」っていう質問が多く来ましたww本記事では、みやちまんさんカスタマイズを、HTML・CSS初心者の私なりの解説とアレンジを加え紹介したいと思います。間違っている点等多々あるとは思いますが、とりあえず形になったという視点でご覧頂ければと思います。あと、サクッとは・・できません。当ブログで固定ページへ入れているソースみやちまんさんのカスタマイズをベースにHTMLやCSS初心者レベルの私がやってみた基本は、みやちまんさん無料noteを見て実践するだけです。それだけでカスタマイズできます。【無料】7桁専業のみやちまんさんのnoteを拝読した。記事中説明もされていますが、固定ページをTOPページにする方法で作成します。当ブログは固定ページを以下のように設定しました。マニュアル通りに固定ページを新規で作って、そこにソースを入れていきます。固定ページの構成をTOP最上部にスライドバナー(プラグイン)マニュアルをベースにしたHTMLソースこの2つの構成にしました。※タイトル名は表示されないので管理しやすいように「top-custom」にしてます。sliderというプラグインで動かしています。※まんだむさん(@RYUSEI_d7)ヒントをありがとうございます。こちらのプラグインは、設定が超簡単ですのでぜひ入れてみてください。スマホなどレスポンシブの対応も自動的にやってくれます。sliderインストールにあたり参考にさせて頂いた記事はこちらです。【SANGOカスタマイズ】画像スライダーの実装ちなみに作成したスライドは、グーテンベルグではこんな感じでブロックにメニュー追加されますので、こちらをクリックしてガイドに従って進めていきましょう。ついては下記のソースになります。fa-rss”の中身を変えてやればOKです。アイコンはFontAwesomeで見つけましょう。公式FontAwesome新着記事数2について当ブログでは、新着記事の表示を2つにしています。2つ以上に変更したい場合は、num=”2′′の数字を変えましょう。全記事一覧3について全記事一覧のリンクは/archives_all/と入れてやればOKです。人気記事部分このブロックは、特にフォーカスしたいコンテンツを持ってくるといいと思います。カテゴリへの動線でもOKですし、記事単体への動線でもOKです。当ブログの場合は、まとめ記事の人気が高いので、いくつかピックアップして常時表示するようにしています。fa-bar-chart”の中身を変えてやればOKです。アイコンはFontAwesomeで見つけましょう。公式FontAwesomeピックアップ記事部分2について同じソースブロックが4つ並んでいるだけなので基本的には、同様に修正します。アンダーライン部分にリンク先のURLを入力します。画像の入れ替えについては、みやちまんさんの記事のとおりに変更します。注意画像ファイルの末尾に520×300と表記を足して、サムネイル画像を表示するようにします。カテゴリへのリンク3についてカテゴリへのリンクは、アンダーライン部分を変更します。アクセスさせたいカテゴリへリンクを貼りましょう。当ブログの場合は、人気記事はカテゴリを横断していて統一したカテゴリではないため、タグでひとまとめにしています。作り方のコツ私は一旦アタリ画像を作って全部ハメてみて、一箇所一箇所プレビューチェックしながら進めました。おすすめカテゴリ部分おすすめと題して、おすすめのカテゴリへの動線を作っています。style="text-align:center;margin-bottom:10px;">【初心者向け特集記事】ごま記事</h2></div></a></article></div>ソースの基本的な作りは人気記事部分と同じです。飛び先のカテゴリページのURLと画像のURLを設定するだけです。ちなみにジャンプ先のカテゴリの作り込みは、その先へ遷移させる重要な役割を持っていますのでしっかり作り込みましょう。作り込み方法は、下記で詳しく解説しています。【ワードプレスSANGOのカスタマイズ】詳細なカテゴリページの作り方。画像の制作は、canvaを使っています。イラスト画像をお探しの方は、こちらのページもご参考ください。画像サイズは、520*300pxで作りました。主力カテゴリ以外にも、タグでまとめている記事群でフォーカスさせたいものを紹介しています。ソースについては、基本的に上記おすすめと同じように設定します。style="text-align:center;margin-bottom:10px;">アフィリエイト【ジャンル実例】</h2></div></a></article></div>当ブログで固定ページへ入れているソース当ブログで固定ページへ入力しているソースは以下です。同じ構成で良ければ、みやちまんさんのnoteに記載してあるCSSに合わせてコピペして使えば、時間をショートカットできると思います。style="text-align:center;margin-bottom:10px;">アフィリエイト【ジャンル実例】</h2></div></a></article></div>いかがだったでしょうか?ちなみに、トップページを変更したことでブログの回遊性はかなり上がりました。この固定ページをTOPページにする方法は、SANGOのカスタマイザーではいじれない細かな部分を変更できるので、慣れたらとても運用しやすいスタイルだと思います。ごま吉ちょっとしたバナー貼ったりとか楽wwトップページはブログの『顔』になります。)こちらも合わせてどうぞアフィリエイト初心者向けに【月3,000円を稼ぐ着実なSEO】をテーマにnote執筆しました。収益が出なくて悩んでいる人におすすめのnoteです。【悲報】200記事でも普通に儲かりません。Tracker(ランクトラッカー)アフィリエイトのや...アフィリエイトを始める最短ルートアフィリエイト初心者向けに『アフィリエイトの始め方』を最短ルートで紹介しています。5つのステップで簡単にアフィリエイトを始めましょう。»詳しく見る初心者向けのnoteをリリースアフィリエイト初心者向けに『月3,000円を着実に稼ぐSEO』を書いたnoteをリリースしました。実際に私がやってる方法です。稼げるキーワードって?無料素材・ツールブログが続かないAdSense審査・運用WordPressを学びたい他のブログと差別化出来る私が実際に買ったデザイン性が高くSEOにも強いワードプレステーマをまとめてみました。Minimal»有料ワードプレスのまとめごま吉アフィリエイト歴15年目。アフィリエイトに役立つ情報を「サクッと読めるように」200記事程度まとめています。