如何在WordPress页面编辑器中给出图片源?

时间:2017-01-15 作者:Oludare Fajimolu

我把图像文件存储在名为site的主题目录中。

现在在我使用wordpress页面编辑器的主页中,我输入了以下代码,但它没有显示图像,似乎位置错误。

<img src="site/images/footLogo.png" style="padding: 0px!important; color:white">
让我知道什么问题?

4 个回复
最合适的回答,由SO网友:Muhammad Muazzam 整理而成

您可以将主题函数文件中的常量定义为:

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">

SO网友:Savan Dholu

您不能在内容编辑器中使用PHP,只需编写图像的完整路径即可。

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

SO网友:Samuel Asor

您必须复制图像的完整路径,如下所示:
http://www.your-site-name.extension/wp-content/themes/site/images/footLogo.png 在您的<img src="">.

WordPress使用绝对URL。

SO网友:gmazzap

绝对URL

正如其他人所说,您需要为您的图像使用完整的URLsrc 属性,否则浏览器将无法找到它。

WordPress提供该功能get_template_directory_uri() 返回主题路径的完整URL。

因此,通过这样做:

<?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">
如果您使用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\' 将从子主题加载,如果子主题正在使用且文件在那里可用,则将从父主题加载。

此新功能提供了一个“父主题回退”功能,该功能与自WP 3.0以来一直存在的从父主题到子主题的“模板父主题回退”功能相匹配,如get_template_part().

相关推荐

Hide image on homepage

我只想在我博客的主页上隐藏摘录上的图像,并且只有当屏幕分辨率低于480px时才隐藏。有可能做到这一点吗?我知道我可以为宽度设置CSS属性,但我不知道如何只为我的主页指定,也许有一个功能?@media only screen and (max-width : 320px) { } 谢谢大家!