web-dev-qa-db-ja.com

ワードプレスのページエディタで画像ソースを指定するにはどうすればいいですか?

Siteというテーマディレクトリの中に画像ファイルを保存しています。

今ワードプレスページエディタを使用して私のホームページに私は次のコードを入れたが、それは画像が表示されませんでした、場所が間違っているようです。

<img src="site/images/footLogo.png" style="padding: 0px!important; color:white">

何が問題なのか教えてください。

4

テーマ関数ファイルで定数を次のように定義できます。

if( !defined(THEME_IMG_PATH)){
   define( 'THEME_IMG_PATH', get_stylesheet_directory_uri() . '/site/images' );
  }

そして、imgタグを

 <img src="<?php echo THEME_IMG_PATH; ?>/footLogo.png" style="padding: 0px!important; color:white">
1

コンテンツエディタでPHPを使用することはできません。画像へのフルパスを入力するだけです。

<img src="/css/_include/img/slider-images/1.jpg" alt="Image" data-fullwidthcentering="on">
1
Savan Dholu

次のように画像へのフルパスをコピーする必要があります。
あなたのhttp://www.your-site-name.extension/wp-content/themes/site/images/footLogo.pngの中の<img src="">

WordPressは絶対URLで動作します。

1
Samuel Asor

絶対URL

他の人が言ったように、あなたはあなたのimage src属性のために完全なURLを使う必要があります、さもなければブラウザはそれを見つけることができないでしょう。

WordPressはあなたのテーマパスへの完全なURLを返す関数get_template_directory_uri()を提供します。

だから、することによって:

<?php
$img_src = get_template_directory_uri() . '/site/images/footLogo.png';
?>

<img src="<?php echo $img_src ?>" style="padding: 0px!important; color:white">

パスが正しく、ファイルがそこにあると仮定すると、あなたの画像が表示されます。

ヘルパー機能

より多くの画像があり、それらをテンプレートに出力するプロセスを簡単にしたい場合は、get_template_directory_uri()をラップするカスタム関数を作成できます。

例えば:

function theme_image( $image ) {
  return get_template_directory_uri() . '/site/images/' . $image;
}

そしてテンプレートでは以下のようにします。

<img src="<?php echo theme_image('footLogo.png') ?>" 
     style="padding: 0px!important; color:white">

WordPress 4.7以降と「親テーマの代替」

WP 4.7+コードを使用すると、新しい関数get_theme_file_uri()にアクセスできます。

get_template_directory_uri()に対するこの関数の利点は、利用可能であれば自動的に子テーマからファイルをロードすることです。

たとえば、theme_image()関数を次のように変更したとします。

function theme_image( $image ) {
  return get_theme_file_uri( '/site/images/' . $image );
}

theme_image('footLogo.png')を実行すると、子テーマが使用中でそのファイルがそこにある場合は、イメージ'footLogo.png'が子テーマからロードされます。それ以外の場合は、親テーマからロードされます。

この新機能はget_template_part()のような関数を通してWP 3.0以来そこにあった親から子テーマへの "テンプレート親テーマフォールバック"と対になる "親テーマフォールバック"を提供します。

1
gmazzap