WordPress在Sage模板中使用图像 _Wordpress模板

我试图在我的Sage模板文件之一中使用背景图像。
【WordPress在Sage模板中使用图像】但是, 当我尝试此操作时, 图像未显示。

< section class="banner" style="background-image: url(../images/banner.jpg); ">

banner.jpg文件位于theme-name / assets / images / banner.jpg中
我在这里做错了什么？
#1用下面的代码替换你的代码。你需要在图片文件夹之前添加资产, 因为你提到的图片路径是图片文件夹是资产的子文件夹

< section class="banner" style="background-image: url('../assets/images/banner.jpg'); ">

使用了get_template_directory_uri()。检索主题目录URI。

< section class="banner" style="background-image: url('< ?php echo get_template_directory_uri(); ?> /assets/images/banner.jpg'); ">

如果使用子主题, 则使用get_stylesheet_directory_uri()。它返回当前主题/子主题的URI。

< section class="banner" style="background-image: url('< ?php echo get_stylesheet_directory_uri(); ?> /assets/images/banner.jpg'); ">

#2请使用wordpress模板目录路径

< section class="banner" style="background-image: url(< ?php echo get_template_directory(); ?> /images/banner.jpg); ">

#3尝试这个：

< section class="banner" style="background-image: url(/wp-content/themes/theme-name/assets/banner.jpg); ">

或这个：

< section class="banner" style="background-image: url('< ?php echo get_template_directory_uri(); ?> /assets/images/banner.jpg'); ">

也许你只是忘记了” 资产” ：

< section class="banner" style="background-image: url('../assets/images/banner.jpg'); ">

#4在header.php中尝试一下：

< section class="banner" style="background-image: url(wp-content/themes/theme-name/dist/images/about-us-top-side.png); ">

< section class="banner" style="background-image: url(wp-content/themes/theme-name/assets/images/about-us-top-side.png); ">

如果正确使用Sage主题, 则第一个图像将具有优化的图像。
#5先前的答案使用WordPress的一些内置函数来解析当前主题的路径。但是, 在Sage(使用Blade模板)中, 这是通过@asset指令处理的：

< section class="banner" style="background-image: url("@asset('images/example.jpg')"); ">

文献资料

WordPress在Sage模板中使用图像