wordpress 如何使用来自 php 文件的 wp-content\images 文件夹中的图像？

How to use an image from the folder wp-content\images from a php file?

提问by Roberto

I have a Wordpress website that was customized by a php developer. He created a folder for images in the root of the website. I have a requirement to move this foder from the root of the website to inside the wp-content\images\ folder.

我有一个由 php 开发人员定制的 Wordpress 网站。他在网站的根目录中为图像创建了一个文件夹。我需要将此饲料从网站的根目录移动到 wp-content\images\ 文件夹内。

Here is how the php file is written today using the image files from the folder in the root:

以下是今天使用根目录中文件夹中的图像文件编写 php 文件的方法：

<img src="images/img1.jpg" border="0" style="padding-right:44px;"/>
<img src="images/img2.jpg" border="0" style="padding-right:44px;"/>
<img src="images/img3.jpg" border="0" style="padding-right:44px;"/>
<img src="images/img4.jpg" border="0" style="padding-right:44px;"/>
<img src="images/img5.jpg" border="0"/>

Now that I moved the images to the wp-content\images\ folder, I tried many combinations (wp-content/images/img1.jpg; /wp-content/images/img1.jpg; public_html/wp-content/images/img1.jpg;/public_html/wp-content/images/img1.jpg), but the images are not showing up. How should I refer to the images in that folder?

现在我将图像移动到 wp-content\images\ 文件夹，我尝试了很多组合（wp-content/images/img1.jpg; /wp-content/images/img1.jpg; public_html/wp-content/images/ img1.jpg;/public_html/wp-content/images/img1.jpg)，但图像没有显示出来。我应该如何引用该文件夹中的图像？

Many thanks! Rob.

非常感谢！抢。

回答by mrtsherman

If your images are associated with a custom theme then they should be in your theme directory.

如果您的图像与自定义主题相关联，那么它们应该在您的主题目录中。

You can use the get_bloginfowordpress api to get an absolute url to this directory.

您可以使用get_bloginfowordpress api 获取此目录的绝对 url。

bloginfo('template_url')

See the above link for important information on different variations of this.

有关此不同变体的重要信息，请参阅上面的链接。

So you would replace your image links with something like

所以你会用类似的东西替换你的图片链接

<img src="<?php bloginfo('template_url')?>/images/img1.jpg" border="0" style="padding-right:44px;"/>

回答by Kirk Gleffe

1. Add Image Directory to Active Theme

   Add /imagesfolder to your current active theme.

   Add Local Image Directory to Active WordPress Theme (Child)

2. Optimize Your Images for Production

   This is important for user experience and pagespeed. A faster website shows visitors you care about their time. If using the native media manager, there are several free plugins that will optimize your images automatically on upload-- in addition to online services (like TinyPNG), OS applications (like Codekit for Mac, JPEGMini for Windows) and the command line.

3. Display Local Image in WordPress

   If Parent Theme is active: use template_directory

   <img src="<?php bloginfo('template_directory')?>/images/YOUR-IMAGE-HERE.jpg" alt="Image Title" border="0" width="" height="" style="padding-right:44px;"/>
   

   If Child Theme is active: use stylesheet_directory

   <img src="<?php bloginfo('stylesheet_directory')?>/images/YOUR-IMAGE-HERE.jpg" alt="Image Title" border="0" width="" height="" style="padding-right:44px;"/>
   

   Add this code to your template files where you want your image to display, changing '/images/YOUR-IMAGE-HERE' (and attributes) to match the correct file location, name and attributes:

   Includealt, widthand heightinformation for every image in production to increase pagespeed and enhance content accessibility.

4. That's it!

1. 将图像目录添加到活动主题

   将/images文件夹添加到您当前的活动主题。

   将本地图像目录添加到 Active WordPress 主题（子）

2. 优化您的生产图像

   这对用户体验和页面速度很重要。更快的网站向访问者展示您关心他们的时间。如果使用原生媒体管理器，除了在线服务（如 TinyPNG）、操作系统应用程序（如适用于 Mac 的 Codekit、适用于 Windows 的 JPEGMini）和命令行之外，还有几个免费插件可以在上传时自动优化您的图像。

3. 在 WordPress 中显示本地图像

   如果父主题处于活动状态：使用template_directory

   <img src="<?php bloginfo('template_directory')?>/images/YOUR-IMAGE-HERE.jpg" alt="Image Title" border="0" width="" height="" style="padding-right:44px;"/>
   

   如果子主题处于活动状态：使用stylesheet_directory

   <img src="<?php bloginfo('stylesheet_directory')?>/images/YOUR-IMAGE-HERE.jpg" alt="Image Title" border="0" width="" height="" style="padding-right:44px;"/>
   

   将此代码添加到您希望图像显示的模板文件中，更改“/images/YOUR-IMAGE-HERE”（和属性）以匹配正确的文件位置、名称和属性：

   包括alt,width和height生产中的每个图像的信息，以提高页面速度并增强内容可访问性。

4. 就是这样！

---

---

Additional Notes

补充说明

• If using a child theme, you'll want to change template_directoryto stylesheet_directory

• In most cases you'll want to use the native WordPress media manager to insert and display images. There are also several free plugins that can help you optimize and enhance image quality dynamically:

  • EWWW Image Optimizer
  • WP Retina 2x
  • Regenerate Thumbnails

• In addition, WordPress has a list of available parameters that can be used to target a specific (different) directory or url. Check that our here: http://codex.wordpress.org/Template_Tags/bloginfo

• 如果使用子主题，您需要更改template_directory为stylesheet_directory

• 在大多数情况下，您会希望使用本机 WordPress 媒体管理器来插入和显示图像。还有几个免费插件可以帮助您动态优化和增强图像质量：

  • EWWW 图像优化器
  • WP 视网膜 2x
  • 重新生成缩略图

• 此外，WordPress 有一个可用参数列表，可用于定位特定（不同）目录或 url。检查我们的这里：http: //codex.wordpress.org/Template_Tags/bloginfo

Include image set as separate file for reuse

包括图像集作为单独的文件以供重用

If reusing this same 'set' of images in several places, create an include file for the set and add them via [shortcode] as needed. To update, you would then only need to update the extended file, which would in turn update all exported code where the [shortcode] has been placed automatically.

如果在多个地方重复使用相同的“一组”图像，请为该组创建一个包含文件，并根据需要通过 [shortcode] 添加它们。要更新，您只需要更新扩展文件，这将依次更新所有已自动放置 [shortcode] 的导出代码。

<?php include( get_template_directory() . '/includes/myfile.php'); ?>

<?php include( get_template_directory() . '/includes/myfile.php'); ?>

Best, -K

最好，-K