Question

我正在创建一个自定义WordPress页面tempalate。我按照WordPress网站上的指南创建了一个页面模板并将其上传，但我遇到了问题：图片没有加载。

我确信我已正确放置图像。 Here是我的网站。

我有一个文件夹Pk_files，其中包含目录rockwell（主题名称）中的所有图片，但它没有加载图片。有什么想法吗？

这是我的代码，

<?php
/*
Template Name: Packages
*/
?>
<?php get_header(); ?>
<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"><style type="text/css">
#index_contentbg {
    clear: both;
    padding: 10px 35px 15px;
    width: 890px;
    font-family: 'Trykker', serif;
}

#video_blue_box {
    background: url("http://www.99centarticles.com/css/../images/vbb_bg.jpg") repeat-x scroll 0 0 transparent;
     clear: both;
    height: auto;
    padding: 10px 35px 15px;
    width: 890px;
    text-align:center;
    font-family: 'Trykker', serif;
}
</style>
<link href="Pk_files/css.css" rel="stylesheet" type="text/css">


</head><body><div id="video_blue_box">
<h2>Our Packages</h2></div>

<div id="index_contentbg">
<p>Below are our package deals, order now and get <strong>20% Extra.</strong></p>
</div>



<div id="video_blue_box">
<h2>500 Word Article Writing Package</h2>
</div>
<div id="index_contentbg"><img src="Pk_files/firsty.PNG" height="525" width="347"></div>
<div id="video_blue_box">
<h2>Quality Article Writing + Our Signature Submission Method</h2>
</div>
<div id="index_contentbg">
  <p><img src="Pk_files/1.PNG" align="absmiddle" height="539" width="341"></p>
</div>

<div id="video_blue_box">
<h2>Custom Articles - You Choose Word Count and Quantity</h2>
</div>
<div id="index_contentbg">Please contact us through or contact form for the quote.</div>

<div id="video_blue_box">
<h2>Press Release Writing</h2>
</div>
<div id="index_contentbg">
  <p><img src="Pk_files/5.PNG" height="428" width="351"></p>
</div>


<div id="video_blue_box">
<h2>Press Release Writing + Our Signature Submission Method</h2>
</div>
<div id="index_contentbg">
  <p><img src="Pk_files/6_1.PNG" alt="" height="393" width="824"></p>
  <p><img src="Pk_files/6_2.PNG" height="390" width="804"></p>
  <p><img src="Pk_files/6_3.PNG" height="388" width="794"></p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
</div>


<div id="video_blue_box">
<h2>Drive Traffic Marketing Videos</h2>
</div>
<div id="index_contentbg"><img src="Pk_files/7_1.PNG" height="292" width="339"></div>
<div id="video_blue_box">
  <h2>Premium Website / Sales Page Videos</h2>
</div>
<div id="index_contentbg">Please contact us through or contact form for the quote.</div>
<div id="video_blue_box">
<h2>Custom Facebook Fan Page</h2>
</div>
<div id="index_contentbg">
  <p><img src="Pk_files/7_2.PNG" height="288" width="343"></p>
</div>
<div id="video_blue_box">
  <h2>Custom Sales Page</h2>
</div>
<div id="index_contentbg">
  <p>&nbsp;</p>
<img src="Pk_files/8_1.PNG" height="221" width="342"></div>
<div id="video_blue_box">
<h2>Custom Blog Design/Wordpress Theme</h2>
</div>
<div id="index_contentbg">Please contact us through or contact form for the quote.</div>
<div id="video_blue_box">
<h2>Custom Facebook Fanpage</h2>
</div>
<div id="index_contentbg"><img src="Pk_files/9.PNG" height="98" width="342"></div>
<div id="video_blue_box">
<h2>Link Building Service</h2>
<p>&nbsp;</p>
</div>
<div id="index_contentbg"><img src="Pk_files/11.PNG" height="84" width="336"></div>
<div id="video_blue_box">
<h2>Blog Commenting SEO Service</h2>
</div>
<div id="index_contentbg">
  <p><img src="Pk_files/12.PNG" height="346" width="344"></p>
</div>
<div id="video_blue_box">
<h2>.EDU Linking SEO Service</h2>
</div>
<div id="index_contentbg"><img src="Pk_files/13.PNG" height="285" width="346"></div>
<?php get_footer(); ?>

Answer 1

我的浏览器控制台中包含404条消息，如下所示：

 http://bestseoarticlewriters.com/121-2/Pk_files/6_3.PNG

最可能的解释是您在模板中使用了相对路径：相对路径将始终相对于当前页面解析，而不是HTML来自的实际模板路径！（唯一的例外是CSS文件，其路径将始终相对于CSS文件解析。）

使用绝对网址，或者更优选地，使用Wordpress“bloginfo()：

<img src="<?php bloginfo('template_directory'); ?>/Pk_files/6_3.PNG">

这是解决模板中图像的规范方法。

Answer 2

只是附注 - 不推荐使用带有url参数的bloginfo（或者至少不推荐使用），并且需要使用get_template_directory_uri等函数。

网站没有显示图像

2 个答案: