サポート » プラグイン » CSS編集で画像を使用する方法

  • ワードプレスでHP作成中、H1タグの背景画像を設定したいと考えています。
    設定画面やブロックエディターなどではどうしてもできないようでしたので、ファイル構造の中のテーマファイルのCSSを直接編集しようとしています。

    ワードプレスのバージョン:5.9
    使用中のテーマ:tweny tweny-two(特にこだわりはありません)
    Gutenbergのプラグインを有効化しています。LOCALというフリーソフトでローカル環境を作成し、いったんその中にサイトを置いている状態です。

    私のPCの中でのファイルパスを書くと、
    h1{
    background-image: url(“file:///C:/Users/user/Local%20Sites/(~途中省略~)app/public/wp-content/uploads/2022/01/K_PC_top_image.png”)

    のようになるのですが、

    実際にワードプレスのサイト上で画像にアクセスできるようにするためには、
    ファイルパスの一部を
    <?php echo get_template_directory_uri();>・・・・
    のように書き換えなければならないと聞きました。

    url() 内のファイルパスを、具体的にどのように書き換えればよいのか、教えていただけないでしょうか?

    ちなみに、使いたい画像は、ワードプレスの設定画面から
    メディア>ライブラリ の中にアップロードしてあります。

1件の返信を表示中 - 1 - 1件目 (全1件中)
  • こんにちは

    CSS にはフルパスで記述せずに、ルートディレクトリからか、相対パスで指定すれば良いと思います。

1件の返信を表示中 - 1 - 1件目 (全1件中)
  • トピック「CSS編集で画像を使用する方法」には新たに返信することはできません。