あずきです🐥
あずきのWordPressブログ「完全初心者」ガイド、その第6章にあたる今回は…
ワードプレスで「デザイン」をセットしよう
です
まず大前提として、「どのテーマを使ってるか？」次第で、カスタマイズ可能な範囲やその設定方法は変わってきます
この第6章では、当ブログで愛用してるテーマ「WING（AFFINGER5）」をもとに…
- まず覚えておきたい、デザイン設定の基本
- 個人的におすすめなデザイン設定例
を解説していきます
で、具体的には次の「4つのステップ」です
- 「メニュー」の設定
- 「ウィジェット」の設定
- 「カスタマイズ」の設定
- 「テーマごと」の管理設定
さっそく見ていきましょー🐥
＼「本気」で戦うなら ／
―― 検証と改善を重ねた唯一無二のテーマ ――
WING AFFINGER5
今なら超時短ツール「タグ管理プラグイン（4,980円）」の無料配布キャンペーン中！
-
【超時短】ブログの「タグ管理」機能とは？仕組み＆使い方から、メリット＆デメリットまで【WordPress】
続きを見る
About me
- 専業ブロガー・フリーランス -
あずき
独立3年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^
このブログのWordPress環境
- 使用中のテーマ：WING AFFINGER5
- 使用中のエディタ：クラシックエディタ
- 使用中のプラグイン：おすすめプラグイン17選 の記事で公開しています
Contents
第6章：WordPressでデザインをセットしよう！【メニュー／ウィジェット／カスタマイズ／テーマごとの管理】
ステップ①：「メニュー」の設定
ヘッダー＆フッターメニューの作成
-
【スマホ用もあり】AFFINGER5で「ヘッダー＆フッターメニュー」を作成する手順【WordPressブログ】
続きを見る
スマホ用スライドメニューの作成
-
AFFINGER5で「スマホ用スライドメニュー」を作成する手順【WordPressブログ】
続きを見る
ステップ②：「ウィジェット」の設定
ウィジェットを使った「カテゴリー一覧」の設置
-
【AFFINGER5】ブログのサイドバーに、「カテゴリー一覧」を設置する方法【WordPressウィジェット】
続きを見る
プロフィールの作成と、ウィジェットを使ったサイドバーへの設置
▼ プロフィールの作成 ▼
-
【AFFINGER5】ブログの「プロフィール用ボックス」おすすめな作り方【サイドバーウィジェット・記事内】
続きを見る
▼ プロフィールのサイドバーへの設置 ▼
-
【AFFINGER5】ブログのサイドバーに、「プロフィール」などテキストや画像を設置する方法【WordPressウィジェット】
続きを見る
＼「本気」で戦うなら ／
―― 検証と改善を重ねた唯一無二のテーマ ――
WING AFFINGER5
今なら超時短ツール「タグ管理プラグイン（4,980円）」の無料配布キャンペーン中！
ステップ③：「カスタマイズ」の設定
カスタマイズについては項目がやや多いので、大きく…
- 「サイト全体」編
- 「記事ページ」編
この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年5月時点、dataprovider.com 調べ（詳細）
今なら「ドメイン永久無料」＆「初期設定費 3,000円 → 0円」のお得なキャンペーン中！
「会話吹き出し」の色＆デザイン設定
-
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】
続きを見る
今回の記事はこちらの章に属しています
次の章はこちら
About me
- 専業ブロガー・フリーランス -
あずき
独立3年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^