あずきです🐥
あずきのWordPressブログ「完全初心者」ガイド、その第6章にあたる今回は…
ワードプレスで「デザイン」をセットしよう
です
まず大前提として、「どのテーマを使ってるか?」次第で、カスタマイズ可能な範囲やその設定方法は変わってきます

この第6章では、当ブログで愛用してるテーマ「WING(AFFINGER5)」をもとに…
- まず覚えておきたい、デザイン設定の基本
- 個人的におすすめなデザイン設定例
を解説していきます
で、具体的には次の「4つのステップ」です
- 「メニュー」の設定
- 「ウィジェット」の設定
- 「カスタマイズ」の設定
- 「テーマごと」の管理設定
さっそく見ていきましょー🐥
-
【愛用】「WING AFFINGER5」って実際どうなの?気に入ってる点・気になる点をガチレビュー【WordPressのおすすめテーマ/専業ブロガー4年目】
続きを見る
-
WordPressの「タグ管理」とは?どれだけブログに必須な機能か、3分で解説【よく使う文章や広告をテンプレート化/一括修正が最強に便利】
続きを見る
About me
- 専業ブロガー・フリーランス -
あずき
独立4年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^
このブログのWordPress環境
- 使用中のテーマ:WING AFFINGER5
- 使用中のエディタ:クラシックエディタ
- 使用中のプラグイン:おすすめプラグイン17選 の記事にて公開しています
Contents
第6章:WordPressでデザインをセットしよう!【メニュー/ウィジェット/カスタマイズ/テーマごとの管理】
ステップ①:「メニュー」の設定
ヘッダー&フッターメニューの作成
-
【スマホ用もあり】AFFINGER5で「ヘッダー&フッターメニュー」を作成する手順【WordPressブログ】
続きを見る
スマホ用スライドメニューの作成
-
AFFINGER5で「スマホ用スライドメニュー」を作成する手順【WordPressブログ】
続きを見る
ステップ②:「ウィジェット」の設定
ウィジェットを使った「カテゴリー一覧」の設置
-
【AFFINGER5】ブログのサイドバーに、「カテゴリー一覧」を設置する方法【WordPressウィジェット】
続きを見る
プロフィールの作成と、ウィジェットを使ったサイドバーへの設置
▼ プロフィールの作成 ▼
-
【AFFINGER5】ブログの「プロフィール用ボックス」おすすめな作り方【サイドバーウィジェット・記事内】
続きを見る
▼ プロフィールのサイドバーへの設置 ▼
-
【AFFINGER5】ブログのサイドバーに、「プロフィール」などテキストや画像を設置する方法【WordPressウィジェット】
続きを見る
ステップ③:「カスタマイズ」の設定
カスタマイズについては項目がやや多いので、大きく…
- 「サイト全体」編
- 「記事ページ」編
この2つにわけて見ていきます🐣
カスタマイズ:「サイト全体」編
「ヘッダー・フッター・背景」エリアの色設定
-
WING AFFINGER5で「ヘッダー・フッター・背景」の色設定をカスタマイズする手順【WordPressブログ】
続きを見る
「ヘッダーメニュー」エリアの色設定
-
WING AFFINGER5で「ヘッダーメニューの色設定」をカスタマイズする手順【WordPressブログ】
続きを見る
「スマホ用スライドメニュー」エリアの色設定&デザイン設定
-
AFFINGER5で「スマホ用スライドメニュー」の色とデザイン設定をカスタマイズする手順【WordPressブログ】
続きを見る
「ウィジェット」エリアの色設定
-
WING AFFINGER5で「ウィジェットの色設定」をカスタマイズする手順【WordPressブログ】
続きを見る
「新着記事&関連記事」エリアのカスタマイズ
-
AFFINGER5で、「新着&関連記事」一覧エリアをカスタマイズする手順【WordPressブログ】
続きを見る
カスタマイズ:「記事ページ」編
「記事ページ」のカスタマイズについては、いざWordPressで記事を作ってみないとイメージが沸かないと思うので、この次の章にあたる…
-
【2020年】ワードプレスで記事を作って投稿しよう!【あずきのWordPressブログガイド/第7章TOP】
続きを見る
↑ こちらの「第7章」と並行して進めていくのがおすすめです
「記事タイトル&見出し」の色設定&デザイン設定
-
WING AFFINGER5で「記事タイトル&見出し」の色とデザイン設定をカスタマイズする手順【WordPressブログ】
続きを見る
「本文&リンクテキスト」の色設定
-
AFFINGER5で「本文&リンクテキスト」の色設定をカスタマイズする手順【WordPressブログ】
続きを見る
「カテゴリー&投稿日時&ぱんくずリスト」の色設定
-
AFFINGER5で「カテゴリー&投稿日時&パンくずリスト」の色設定をカスタマイズする手順【WordPressブログ】
続きを見る
「箇条書きボックス」の色設定
-
AFFINGER5で「箇条書きボックス」の色設定をカスタマイズする手順【WordPressブログ】
続きを見る
「Webアイコン」の色設定
-
AFFINGER5で「Webアイコン」の色設定をカスタマイズする手順【WordPressブログ】
続きを見る
\ 国内シェアNo.1※ /
―― 17年以上積み重ねられた安心と実績 ――
XSERVER
※2020年11月時点、dataprovider.com 調べ(詳細)
今なら【ドメイン永久無料】&【初期費用 3,000円→0円】のお得なWキャンペーン実施中!
「会話吹き出し」の色&デザイン設定
-
AFFINGER5で「会話吹き出し」の色&デザイン設定をカスタマイズする手順【WordPressブログ】
続きを見る
「表」の枠線や背景色の初期設定
-
AFFINGER5で、「表」の枠線や背景色の初期設定をカスタマイズする手順【WordPressブログ】
続きを見る
「ブログカード」の抜粋表示の設定
-
AFFINGER5で、「ブログカード」の抜粋表示の設定をカスタマイズする手順【WordPressブログ】
続きを見る
「リンクボタン」の色設定
-
AFFINGER5で、「リンクボタン」の色設定をカスタマイズする手順【WordPressブログ】
続きを見る
各種「ショートコード」のカスタマイズ設定
-
AFFINGER5の各種「ショートコード」のカスタマイズ手順を解説【WordPressブログ】
続きを見る
ステップ④:「テーマごと」の管理設定
このブログでも愛用してるテーマ「WING(AFFINGER5)」専用の設定画面「AFFINGER5 管理」について、そのおすすめな設定方法を解説していきます
具体的には、大きく…
- 「AFFINGER5 管理」前編 → デザイン / トップページ / 投稿・固定記事 / ヘッダー / メニュー
- 「AFFINGER5 管理」後編 → おすすめ記事一覧 / SNS / SEO / Google連携・広告 / 会話・ファビコン / その他
この2つにわけて見ていきますね🐣
「AFFINGER5 管理」前編 → デザイン / トップページ / 投稿・固定記事 / ヘッダー / メニュー
-
「AFFINGER5 管理」のおすすめ設定例を全公開:前編【デザイン/トップページ/投稿・固定記事/ヘッダー/メニュー】
続きを見る
「AFFINGER5 管理」後編 → おすすめ記事一覧 / SNS / SEO / Google連携・広告 / 会話・ファビコン / その他
-
「AFFINGER5 管理」のおすすめ設定例を全公開:後編【おすすめ記事一覧/SNS/SEO/Google連携・広告/会話・ファビコン/その他】
続きを見る
「第6章」についてはこれで完了です
大変お疲れさまでした♪
あずき🐥
\ このブログでも愛用中!/
―― 検証と改善を重ねた唯一無二のテーマ ――
WING AFFINGER5
✔ 洗練された美しいデザイン性と、「変幻自在」な圧巻のバリエーション
✔ 時間のかかる面倒なカスタマイズも、「クリック1つ」でさくさく実現
✔ 「本気で戦う」ための、最適化されたSEO対策と収益UPの機能が標準装備
今なら超時短ツール「タグ管理プラグイン(4,980円)」の無料配布キャンペーン中!
-
WordPressの「タグ管理」とは?どれだけブログに必須な機能か、3分で解説【よく使う文章や広告をテンプレート化/一括修正が最強に便利】
続きを見る
今回の記事はこちらの章に属しています
次の章はこちら
About me
- 専業ブロガー・フリーランス -
あずき
独立4年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^