テーマ修正のやり方｜WordPressでデザインを安全に変更する方法

テーマ修正は、WordPressの見た目を整えるためにとても便利です。ヘッダーの余白、ボタンの色、スマホ表示の崩れ、投稿ページのレイアウトなど、少し直すだけでサイトの印象は大きく変わります。

ただし、テーマ修正はやり方を間違えると、更新で変更が消えたり、画面が真っ白になったり、スマホだけ崩れたりします。安全に進めるには、作業前のバックアップ、変更箇所の切り分け、子テーマや追加CSSの使い分けが重要です。

よこやま良平

20年以上ITエンジニアとしてWordPressの制作・保守・復旧に携わっている、よこやま良平です。この記事では、デザインを変えたい時にサイトを壊さずテーマ修正する考え方を解説します。

この記事では、WordPressでデザインを安全に変更するためのテーマ修正のやり方を、初心者にも分かる順番で整理します。細かなCSS調整だけで済む場合と、テーマファイルまで触るべき場合は分けて考えます。

結論からいうと、いきなり本番テーマのファイルを直接編集するのは避けるべきです。まずは管理画面でできる範囲、次に追加CSS、必要な場合だけ子テーマという順番で進めるのが安全です。

【無料プレゼント】
WordPress緊急チェック50

「自分のサイトは今、安全なのか？」
自信を持って答えられますか？

こんなお悩みはありませんか？

• ある朝、サイトを開いたら真っ白画面になっていた
• 管理画面にログインできなくなって手が止まった
• 身に覚えのない記事やページが勝手に増えていた
• プラグインを更新したらサイト全体が崩れてしまった
• 以前バックアップを取ったか自分でも覚えていない

累計1,000件以上のWordPressトラブル対応の経験から、「壊れる前に備える」ためのチェックリストを1冊にまとめました。
ログイン・本体・バックアップ・サーバー・運用の5分野を、50項目で「危険度・確認方法・対処法」まで解説しています。

セキュリティプラグイン・WordPressの教科書も含めた3大特典を、
今なら無料で受け取れます。

今すぐ無料ダウンロードする →

※登録後すぐにメールで特典をお届けします

テーマ修正のやり方は安全な順番で考える

テーマ修正の基本は、壊れにくい場所から順番に試すことです。管理画面の設定、追加CSS、子テーマ、テーマファイル編集の順にリスクが高くなります。

まず管理画面の設定で変更できないか確認する

最初に確認すべきなのは、テーマやブロックの設定です。ロゴ、色、フォント、余白、カラム数、ヘッダーやフッターの表示は、管理画面だけで変更できることがあります。

管理画面で変更できる項目をCSSやPHPで無理に上書きすると、あとから保守しにくくなります。まずは「外観」「カスタマイズ」「テーマ設定」「ブロック設定」を見て、標準機能で直せるか確認しましょう。

WordPress6.8対応・基礎マスター講座・ホームページ制作・初心者からWordPressをちゃんと学ぶ

追加CSSで直せる範囲を見極める

文字色、余白、幅、背景色、ボタンの見た目などは、追加CSSで直せることが多いです。追加CSSはテーマファイルを直接触らずに済むため、軽微なデザイン変更では扱いやすい方法です。

一方で、HTML構造そのものを変える、表示する項目を増やす、PHPで出力している部分を変更する場合はCSSだけでは限界があります。CSSで無理に隠すだけの修正は、SEOやアクセシビリティ面で不自然になることがあります。

.site-header {
  padding-top: 16px;
  padding-bottom: 16px;
}

.wp-block-button__link {
  border-radius: 6px;
}

テーマファイルを触る前に子テーマを用意する

テンプレートやfunctions.phpを変更する場合は、子テーマを使うのが基本です。親テーマを直接編集すると、テーマ更新時に変更が消える可能性があります。

子テーマを使えば、必要なファイルだけを上書きできます。ただし、子テーマでもPHPの書き間違いがあればサイトが止まることがあります。バックアップと復元手順を確認してから進めてください。

テーマ修正前に必ずバックアップを取る

テーマ修正の前には、必ずバックアップを取ってください。見た目だけの変更でも、CSSやPHPの編集ミスで公開ページが崩れることがあります。

ファイルとデータベースの両方を保存する

WordPressのバックアップは、テーマファイルだけでは不十分です。投稿、固定ページ、設定、ウィジェット、メニューなどはデータベースに保存されています。

テーマ修正がファイルだけの作業に見えても、管理画面の設定変更やプラグイン設定が絡む場合はデータベースも変わります。ファイルとデータベースの両方を保存しておくと安心です。

WordPressのバックアップを自動化する最強の方法｜UpdraftPlus・BackWPup・Ai1WMの使い分けガイド

変更前と変更後の状態を記録する

安全に進めるには、何を変更したかを記録することも大切です。あとから表示崩れが起きた時、変更履歴がないと原因を追いにくくなります。

変更日時: 2026-06-27 13:20
対象: トップページのボタン余白
変更場所: 外観 → カスタマイズ → 追加CSS
変更内容: .wp-block-button__link の padding を調整
戻し方: 追加CSSの該当部分を削除

この程度のメモでも、復旧時にはかなり役立ちます。外注する場合も、作業者に変更内容を残してもらうよう依頼しましょう。

キャッシュを消すタイミングを決めておく

CSSを直したのに反映されない場合、キャッシュが原因のことがあります。ブラウザキャッシュ、プラグインキャッシュ、サーバーキャッシュ、CDNキャッシュが重なると、変更確認が難しくなります。

作業前にキャッシュの種類を把握し、変更後にどれを削除するか決めておきましょう。むやみに全部消すより、影響範囲を理解して消す方が安全です。

テーマ修正で表示崩れを防ぐ確認手順

テーマ修正は、変更して終わりではありません。PC、スマホ、主要ページ、ログイン状態の違いまで確認して、初めて安全に完了と言えます。

小さく変更して一つずつ確認する

一度に多くのCSSやPHPを変更すると、どの変更が原因で崩れたのか分からなくなります。安全に進めるなら、1つ変更して確認、問題なければ次へ進むのが基本です。

1. 変更前の状態をスクリーンショットで保存する
2. 1か所だけ変更する
3. PC表示とスマホ表示を確認する
4. 問題がなければ変更内容をメモする
5. 次の修正へ進む

地味ですが、この進め方がいちばん安全です。特に本番サイトでは、作業速度よりも戻せる状態を保つことを優先してください。

スマホ表示とタブレット表示を確認する

テーマ修正で多い失敗は、PCではきれいに見えるのにスマホで崩れるケースです。余白、横幅、画像サイズ、2カラム表示は、画面幅が変わると崩れやすい部分です。

スマホ確認では、実機またはブラウザのデベロッパーツールを使います。見た目だけでなく、ボタンが押せるか、文字が読めるか、横スクロールが出ていないかも見てください。

WordPressの不具合を防ぐ！初心者でもできる日常メンテナンスとバックアップ術

ログアウト状態でも確認する

WordPressにログインしたまま確認すると、管理バーや編集者向け表示の影響で、一般ユーザーと違う見え方になることがあります。必ずログアウト状態、またはシークレットウィンドウでも確認しましょう。

会員サイトやキャッシュプラグインを使っている場合は、ログイン状態によって読み込まれるCSSが変わることもあります。一般ユーザーにどう見えるかを基準に判断してください。

テーマ修正でやってはいけないこと

テーマ修正では、早く直したい気持ちで危険な作業をしてしまうことがあります。特に親テーマの直接編集、バックアップなしのPHP修正、原因不明のまま上書きする作業は避けるべきです。

親テーマを直接編集する

親テーマを直接編集すると、テーマ更新で変更が消える可能性があります。さらに、どこを変更したか分からなくなると、次回の修正や外注時に困ります。

どうしてもテーマファイルを変更するなら、子テーマを用意し、変更対象ファイルを絞りましょう。変更履歴を残すだけでも、後日の復旧がかなり楽になります。

functions.phpを管理画面から直接編集する

functions.phpは便利ですが、記述ミスがあるとサイト全体に影響します。管理画面のテーマファイルエディターから直接編集してエラーになると、管理画面に入れなくなることもあります。

PHPを触る場合は、FTPやサーバーファイルマネージャーで戻せる準備をしてから作業してください。自信がない場合は、無理に触らず専門家に相談した方が安全です。

WordPressプラグイン更新でエラーが出る時の復旧方法と安全なアップデート手順

表示をCSSで無理に隠すだけで済ませる

不要な要素をCSSでdisplay:noneにするだけの修正は、一時的には便利です。しかし、本来のHTMLやテンプレート出力が残るため、SEO、速度、アクセシビリティの面で不自然になることがあります。

テーマ修正を自分で行うか依頼するかの判断

テーマ修正は、自分でできる範囲と依頼した方がよい範囲を分けるのが大切です。軽いCSS調整は自分で試せますが、PHPや復旧リスクがある作業は慎重に判断しましょう。

自分で対応しやすいテーマ修正

管理画面の設定変更、追加CSSでの軽い余白調整、ブロック設定の変更は、自分で対応しやすい範囲です。変更前の状態を保存しておけば、戻すことも比較的簡単です。

専門家に依頼した方がよいテーマ修正

テーマファイルの編集、PHPエラー、更新後の重大な表示崩れ、管理画面に入れない状態は、専門家に依頼した方が安全です。復旧対応では、原因調査と戻し方の判断が重要になります。

現場では、最初は小さな表示崩れに見えても、プラグイン競合やPHPバージョン変更が原因だったというケースがあります。原因が見えない時は、無理に触る前に相談してください。

WordPress保守・不正アクセス対策・マルウェア駆除・WordPressクイックレスキュー365

相談前に準備しておく情報

外注する場合は、状況を整理して伝えるほど見積もりが正確になります。対象URL、症状、発生時期、直前の操作、スクリーンショットを用意しましょう。

対象URL: https://example.com/sample/
症状: スマホでボタンが横にはみ出る
発生時期: テーマ更新後から
直前の操作: テーマとプラグインを更新
希望: 元の表示に戻したい。必要なら安全なCSSで調整したい

このように整理されていると、作業者は原因の見当をつけやすくなります。結果として、無駄な調査時間や追加費用を減らせます。

テーマ修正のやり方でよくある質問

テーマ修正のやり方は小さく安全に進めよう

テーマ修正は、デザインを整えるための有効な方法です。ただし、WordPressではテーマ、プラグイン、キャッシュ、PHP、スマホ表示が絡むため、思いつきで直接編集するとトラブルにつながります。

安全に進めるなら、管理画面の設定、追加CSS、子テーマ、テーマファイル編集の順に考えてください。変更前のバックアップ、作業メモ、スマホ確認、ログアウト状態での確認まで行えば、失敗のリスクをかなり下げられます。

自分で直せる範囲は小さく試し、PHPや復旧リスクがある作業は無理に触らないことが大切です。壊してから復旧するより、壊さない手順で修正する方が結果的に早く安全です。

テーマ修正が自分で直せない時は

WordPress保守・不正アクセス対策・マルウェア駆除・WordPressクイックレスキュー365

ワードプレスのWordPressエラートラブル解決をしたいなら
クイックレスキューが解決します。

これらでお悩みなら最短30分ですぐに解決します！

いまなら期間限定で