Question

PCおよびタブレットでのヘッダー表示について

  • A Anandi Tarot
  • いつもお世話になっております。
    現在、ヘッダー表示について挙動で困っている点があり、ご相談です。

    【現状】
    ・ヘッダー設定は「カスタム」で縦サイズ600pxに設定
    ・使用画像サイズ:2400×850px

    WordPressバージョン:6.9.1
    macOS Tahoeバージョン26.2
    iPadOSバージョン18.7.3


    ① パソコン表示について
    フル画面時は問題なく表示されますが、
    ブラウザの横幅を縮小すると、画像が比率に合わせて縮小されるのではなく、
    ヘッダー画像の両サイドが切れた状態で表示されます。

    画面幅に応じて画像全体が縮小表示されるようにする方法はありますでしょうか。

    ② タブレット表示について
    現在、タブレットではPC用ヘッダーが適用されているため、
    両サイドがカットされた状態で表示されています。

    タブレットにはスマホ用ヘッダー画像を適用したいと考えておりますが、
    そのような設定は可能でしょうか。
    設定方法がありましたらご教示いただけますと幸いです。

    どうぞよろしくお願いいたします。

    問題となるページ : anandi-tarot.com
    • WP 6.7.1
    • PHP 8.3.x
    • JIN:R 1.4.0
    • さくらのレンタルサーバ
    • GoogleChrome
    • その他(トピック内容に記載してください。)
    2026/02/19 15:21
  • tsu_

    お世話になっております。
    情報のご共有ありがとうございます。

    ①につきまして
    こちらのマニュアルはご覧いただいていますでしょうか。
    https://jinr.jp/manual/header-img/
    かなり横長の画像なので、「オリジナル比率」設定をお選びいただくのが良いと思います。

    ②につきまして
    設定区分が「PC(タブレット含む)」と「スマホ」の2種類になりますので、標準仕様では設定項目のご用意がありません。

    独自でカスタマイズしていただくか、現在お使いの画像の縦横比を調整する形になるかと思います。

    両サイドが切れてしまう点については、①の設定を変更いただくことで、全体が表示されるはずので、一度お試しいただけますでしょうか。
    (ただし、バランス的に画面領域の上側に詰まって表示されると思いますので、上記の縦横比の調整をご提案させていただきました)

    お手数おかけしますが、ご確認よろしくお願いいたします。

    2026/02/19 22:25
CLOSE