WordPressサイトのCSSを編集する

WordPressをベースとしたホームページ制作では、機能面での高度なカスタマイズにおいては、WordPressテーマ内のphpファイルの操作が必須になりますが、レイアウトの調整や各種カラーの設定などは、WordPressサイトのCSSを編集することで解決できることがよくあります。

テーマのCSS編集でもCSSの操作は可能ですが、テーマによっては複数のCSSが設置されていることがあり、該当CSSを探す作業が必要になる場合もあります。また複数のCSSが存在する場合、設定の優先順位も確認しておく必要があります。

ホームページのCSS・スタイルシート編集方法

CSSでWordPressサイトのレイアウトの設定

レイアウトの設定変更はCSS単体の編集では実現しないこともありますが、要素のID、classがうまく設定されていれば、CSSの編集のみでWordPressサイトのレイアウトを調整できる場合があります（要素に直接スタイルが記述されている場合は、大幅な修正作業が必要になります）。

特に古いWordPressテーマはモバイルフレンドリーに対応していないことがあります。

WordPressテーマのCSSを編集

WordPressテーマが古く、モバイルフレンドリーに対応していない場合でもWordPressテーマのCSSを編集することでモバイルフレンドリー化することができる場合があります。

CSS単体でモバイルフレンドリー化できない場合は、各種HTMLの吐き出しにかかるphpファイルを編集する必要があります。

CSSでWordPressサイトのカラー等の設定

WordPressテーマに組み込まれているオプション設定、テーマカスタマイザーである程度の色やフォントパターン・サイズなどは設定できる事があります。

WordPressサイトの背景色やメインのフォント色、見出しフォントのカラーやサイズがある程度設定できるテーマが存在します。

WordPressにテーマオプション以外のカスタマイズ方法

しかし、WordPressにテーマオプションが存在しない場合や、テーマオプションでは操作の手が届かないポイントの細かなデザイン面での調整はCSS編集で調整が可能です。

WordPressサイトのCSSを編集する方法

WordPressサイトのCSSを編集する方法には、「WordPress管理画面からテーマCSSファイルを編集する」という方法と、「CSSをローカルのエディタで編集しFTPで上書きアップロードする」という方法があります。

WordPressサイトのCSSを編集する方法 WordPressカスタマイズ

コードを書く前に知っておくべき、CSS編集の「4つの地雷」

WordPressでCSSを編集すれば、サイトのデザインを自由自在に操ることができます。しかし、正しい手順を踏まないと、「頑張って書いたコードがある日突然消える」「修正したのに画面が変わらない」といったトラブルに見舞われます。

プロのエンジニアは、コードを書く時間と同じくらい、「安全に管理すること」に気を使っています。ここでは、教科書にはあまり載っていない、現場レベルでの鉄則をお伝えします。

「親テーマ」を直接編集するのは、借家の壁を壊すのと同じです

「外観」＞「テーマファイルエディター」から、style.cssを直接書き換えていませんか。 もしそのテーマが「親テーマ（配布されているオリジナルのテーマ）」だった場合、それは非常に危険な行為です。

WordPressのテーマは、開発者によって定期的にアップデート（更新）されます。 テーマをアップデートすると、親テーマ内のファイルはすべて最新版に上書きされるため、あなたがstyle.cssに書き込んだカスタマイズ内容は、一瞬ですべて消滅してしまいます。

CSSを記述する際は、以下のどちらかの方法を必ず選んでください。

「追加CSS」機能を使う: 管理画面のカスタマイズメニューにある、安全な編集エリアです。アップデートの影響を受けません。

「子テーマ」を作成して書く: 親テーマとは別の「子テーマ」を用意し、その中のstyle.cssを編集します。プロはこちらの方法を推奨します。

「!important」は麻薬です。使うと後で地獄を見ます

CSSが効かないとき、ネットで検索すると「!important をつければ強制的に適用されます」というアドバイスが出てきます。 確かに魔法のように効きますが、これはプロの世界では「最終兵器」であり、安易な乱用は厳禁です。

CSSには「詳細度（点数）」という優先順位のルールがあります。 !importantはこのルールを無視して最強の権限を持ってしまうため、一度使うと、後から別の修正をしたいときに、さらに強い!importantを重ねなければならなくなります。 これを繰り返すと、CSSファイル中が!importantだらけになり、二度とメンテナンスできない「スパゲッティコード」が完成します。まずは正しく詳細度（クラスやIDの指定）を上げて対応することを心がけてください。

「反映されない！」の犯人は、たいていキャッシュです

「CSSを保存したのに、サイトを見ても色が変わっていない」 この現象の9割は、ブラウザやサーバーの「キャッシュ（一時保存データ）」が原因です。

ブラウザは表示速度を上げるために、一度読み込んだCSSファイルを記憶しています。あなたが新しいCSSを保存しても、ブラウザは古い記憶のほうを表示し続けているのです。 CSSを編集した直後は、以下の操作（スーパーリロード）を行って、強制的に新しいデータを読み込ませてください。

Windows: 「Ctrl」 + 「F5」

Mac: 「Command」 + 「Shift」 + 「R」

また、レンタルサーバー側やWordPressのプラグイン（WP Super Cacheなど）がキャッシュしている場合もあります。表示が変わらないときは、まずキャッシュを疑ってください。

いきなり消さずに「コメントアウト」する癖をつけてください

「この余白はいらないな」と思ってコードを削除し、保存した後に「やっぱりレイアウトが崩れた！」と焦る。これは初心者あるあるです。

不要なコードが出たときは、すぐに削除するのではなく、「コメントアウト（無効化）」を使って一時的に隠すようにしましょう。 CSSでは /* と */ で囲むと、その部分はブラウザに読み込まれません。

例： /* margin-top: 20px; この余白は一旦無効化 */

こうして残しておけば、何かあったときに /* を外すだけですぐに元の状態に戻せます。プロは常に「元に戻せる状態」を確保しながら作業を進めます。

WordPressサイトのカスタマイズ・ホームページ制作時に便利な各種コメントアウト

WordPressカスタマイズ・修正

ホームページ制作 京都のWeb制作会社ファンフェアファンファーレでは、WordPressで制作されたウェブサイト・ホームページのカスタマイズサービスとして、WordPress（ワードプレス）のテーマ（テンプレート）やプラグインのカスタマイズサービスを提供しております。

WordPressカスタマイズの他、WordPressに関する様々な機能の実装や調整、編集はもちろん、各種エラーの修正・復旧に対応しております。

WordPress（ワードプレス）のカスタマイズ

ホームページ制作 京都

WordPressサイト（ホームページ）の制作・WordPressのカスタマイズやご新規でのホームページ制作・企画・運営・更新、ホームページの修正、ホームページのSEO対策などのWeb制作サービスのご依頼は、京都のホームページ制作会社ファンフェアファンファーレへ！

新規ホームページ制作（Web制作）をはじめ、WebマーケティングやWeb集客に必要な様々なWeb関連のサービスを提供しています。コンテンツマーケティング導入に最適なWordPressホームページ制作はもちろん、WordPressのカスタマイズ、WordPressのSEO（SEO対策）、エラー修正など様々なWordPress関連の制作サービスも提供しています。

WordPressでホームページ制作・WordPressサイト制作

京都のホームページ制作会社ファンフェアファンファーレは、WordPress（ワードプレス）をベースとしたホームページ制作・WordPressのカスタマイズ、ホームページ・WordPressサイトのSEO対策、モバイルフレンドリー化などのWeb制作サービスを提供しています。ホームページ制作（ウェブサイト制作）、ホームページカスタマイズならお任せください！

WordPress（ワードプレス）でのホームページ制作・WordPressサイト制作

WordPressサイトのカスタマイズ・復旧・復元・エラー修正・保守

WordPressで制作されたホームページ（WordPressサイト）の各種カスタマイズ、テーマファイル編集、プラグイン設置・設定などのWordPressカスタマイズやWordPressのエラー修正ならお任せください！

WordPressテーマのphpファイル、CSSファイルの修正から、ページの修正、ソーシャル設定、新規機能の追加、プラグインの設定値調整まで、様々なカスタマイズ・修正に対応しております。WordPressサイトのSEOにも対応しております。エラー修正（エラー復旧）や、SSL化、テーマのモバイルフレンドリー化などのご依頼にも対応しています。

WordPress カスタマイズ

復旧・復元・エラー修正

ホームページ制作 京都のWeb制作会社ファンフェアファンファーレでは、WordPress（ワードプレス）で制作されたウェブサイト・ホームページの復旧（復元）、エラー修正サービスを提供しております。弊社制作のWordPress（ワードプレス）サイトの復旧、エラー修正も承っておりますが、自社制作・運営、他社制作・管理のWordPressサイトのエラー復旧（復元）・修正にも対応可能です。

WordPress（ワードプレス）の復旧・復元・エラー修正

WordPressの保守やセキュリティについては、基本的にはバックアップによる保守管理で十分だと考えています。トラブル時のWordPressの復旧のためのWordPressの保守やセキュリティ、バックアップと復元について。

WordPressの保守管理 バックアップと復元で対応する

京都・京都近郊ではご訪問での対応

ホームページ制作 京都 ファンフェアファンファーレは、京都市上京区のホームページ制作会社（Web制作会社）です。

もちろんホームページ制作は全国対応しております。

ホームページ制作サービス、WordPressサイト（ホームページ）の制作・カスタマイズサービスのご利用にあたり、「ホームページ制作 京都」 ホームページ制作・作成のプランニングにつきましては、京都府京都市内（上京区、中京区、下京区、東山区、右京区、左京区、北区、南区、西京区、山科区、伏見区）および京都市近郊エリア（京都府下の京都市近郊市町村など）では、ご訪問での打ち合わせ・ヒアリング・ご提案をさせていただいております。京都でホームページ制作ならお任せください！もちろんホームページ制作（ホームページ作成）、ホームページ修正などは全国からのご依頼に対応しております。WordPressでのホームページ制作（WordPressサイト制作）など、新規でのホームページ制作・ホームページ作成はもちろん、既存ホームページのリニューアルや修正、SEO・SEO対策、各種Web集客・WebマーケティングにかかるWebコンサルティングも対応可能です。