WordPressの修正、どこを触ればいい?文字・画像・一覧表示の編集場所を実例で紹介

WordPressにログインして、直したいページを開く。でも、画面に見えている文字が編集欄にはない。画像は見つかったのに、高さを変える場所が分からない。

こんなとき、別の設定画面まで探し回る前に、知っておくと役立つことがあります。

同じページに見えていても、編集する場所は一つとは限りません。

Sole Collectで対応したサイトでも、文字、画像の高さ、一覧の並び順、ロゴ画像で、それぞれ触る場所が違っていました。その事例をもとに、どこから確認するとよいかをお伝えします。

サイトの構成を調べ、対象ごとの作業へ分けて整理する図

本文共通部品一覧の設定
見えている一つのページでも、本文・共通部品・一覧の設定に編集場所が分かれます。
目次

文字はElementor、画像の高さは追加CSS。同じサイトでも編集場所が違いました

今回ご依頼いただいたのは、トップページの文字や画像のサイズ調整、一覧ページの初期表示の変更、メーカーのロゴ画像の差し替えです。あわせて、今後ご自身で更新するときの操作箇所もご案内しました。

見た目の修正が中心ですが、作業した場所を並べると、これだけ分かれています。

直したいところ 今回、実際に編集した場所
トップページの文字サイズ Elementorで編集するページ内のHTML
案内画像の高さ WordPressの追加CSS
一覧を開いたときの表示 Listing GridのCustom Queryなど
メーカーのロゴ 複数のロゴが入った一枚の画像ファイル
このサイトでの編集例です。お使いのテーマやプラグインによって、編集場所は変わります。

たとえば一覧表示は、並び順の設定だけで終わりではありませんでした。切り替えボタンの順番やリンク先、選択中のボタンの見た目もあわせて調整しています。

ロゴの差し替えも、管理画面で一つのロゴを選び直す作業ではありません。複数のロゴが一枚にまとまっていたため、画像編集ソフトで大きさや配置を整え、画像ごとアップロードし直しました。

修正した場所も、次の更新に備えて残す

今回の対応では、修正後の表示をご確認いただいたうえで、編集箇所と操作方法をご案内しました。次に文字や画像を変えるときも、同じ場所から探し直さずに済むようにするためです。

編集欄に見つからないときは、この違いを確認してみてください

文字がない → 別の編集画面や、画像の中にありませんか?

固定ページの本文に文字がなくても、ページが壊れたとは限りません。Elementorなどの編集画面や、複数ページで使う共通の部品に入っている場合があります。

今回の文字サイズは、Elementor内のHTMLを調整しました。ElementorにはHTMLを直接入力するウィジェットもあるため、普段の文章入力欄とは別の場所に文字が入っていることがあります。

もう一つ確認したいのが、その文字が画像に描かれていないかです。画像に含まれる文字なら、本文の編集欄をいくら探しても出てきません。差し替え用の画像や、編集できる元データが残っているかを確認します。

画像は見つかった → 大きさの設定は別かもしれません

画像ファイルを差し替える場所と、画面上での高さ・余白を決める場所は、別になっていることがあります。今回も、案内画像の高さは追加CSSで調整しました。

ここで気をつけたいのは、同じ設定がほかのページにも使われていないかという点です。一か所を直したつもりで、別のページの画像まで変わることがあります。対象の画像だけに効く設定か、保存前に確かめてください。

一覧の順番を変えたい → 一件ずつ並べたページとは限りません

商品やスタッフの一覧は、登録された情報をまとめて呼び出して表示する作りがあります。この場合、一件の商品情報を直す画面と、一覧の並び順を決める画面は別です。

今回使われていたJetEngineにも、一覧に出す投稿や並び順を指定する設定があります。ただし、同じような一覧があっても、お使いのサイトが同じ仕組みとは限りません。

まずは「一覧を開いた直後から新着順にしたい」のか、「新着順に切り替えるボタンがほしい」のかを整理すると、確認する箇所を絞れます。

自分で確認するなら、保存する前にここまで

最初から原因を突き止めようとしなくても大丈夫です。まずは次の順番で、今の状態を控えてみてください。

  1. 直したいページのURLを控える。 一覧ページと詳細ページがあるなら、両方残します。
  2. どこを、どう変えたいか書く。 「見づらい」よりも「スマートフォンで、この画像をもう少し大きくしたい」のほうが伝わります。
  3. 普段使う編集画面を確認する。 固定ページなのか、Elementorなのか、独自の商品登録画面なのか。分かる範囲で構いません。
  4. 変更がほかのページに及ばないか、戻せるかを確認する。 判断がつかなければ、保存せずに確認までで止めておきます。

意味の分からないコードを、試しに書き換えるのは避けましょう

HTML・CSS・PHPやデータベースの変更が必要そうなら、変更する場所と戻し方を確認してから進めます。編集箇所を探すために、別の編集方式へ切り替えて保存することもおすすめしません。

相談するときは、「原因」より「こうしたい」が分かれば十分です

修正を頼む前に、プラグイン名やコードの意味まで調べる必要はありません。対象のURL、気になる箇所、希望する状態。まずはこの三つがあれば、調査の出発点になります。

たとえば、次のような伝え方です。

お問い合わせ文の例

商品一覧を開いたとき、最初から新着順で表示されるようにしたいです。今は別の順番で表示されています。対象URLは〇〇です。今後は自分でも順番を変更できると助かります。

これは説明用の文例です。実際のお客様のメッセージではありません。

表示の違いが分かるスクリーンショットもあると、より伝わりやすくなります。パソコンだけで気になるのか、スマートフォンでも同じなのかも添えてください。

また、今回だけ直したいのか、今後は自分で更新したいのかも、先にお聞きしたいことです。コードや画像加工が必要な箇所は、編集場所の説明だけでは更新しにくいこともあるためです。更新の頻度に合わせて、操作方法のご案内で足りるか、仕組みを変えたほうがよいかを検討します。

「どこを直せばいいか分からない」という段階でも、ご相談いただけます

画面では隣り合っている文字と画像でも、管理画面では編集場所が離れている。WordPressの修正で迷う理由の一つです。

Sole Collectでは、現在のサイトの作りを確認しながら、必要な修正と今後の更新方法を整理します。お問い合わせには、まず対象URLと、変えたい箇所をお知らせください。最初のご相談に、パスワードや認証コードは不要です。

文字・画像・一覧表示の修正でお困りですか?

編集箇所が見つからない場合も、分かる範囲の内容からご相談ください。

WordPressの修正について相談する →

事例は実際の対応記録をもとに、依頼元が特定されない形で紹介しています。編集箇所はサイトの構成や導入機能によって異なります。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

森田|株式会社Sole Collect WordPress修正・ホームページ管理保守

京都を拠点に、WordPressの修正やホームページの管理・保守、日々の更新をお手伝いしています。Web制作・WordPress対応に10年以上携わってきた経験をもとに、社内にWeb担当者がいない企業・店舗を支援しています。

「どこを直せばいいか分からない」「以前の制作会社に相談できない」という段階でも、ご相談ください。他社制作サイトも、現在の構成を確認して対応方法をご案内します。

お問い合わせには、サイトのURLと、今お困りのことを分かる範囲でお知らせください。必要な作業と費用をご説明し、ご了承後に着手します。全国オンライン対応です。

サイトの困りごとを相談する →
Sole Collectの対応サービスを見る

目次