无法将背景图像添加到wordpress php中的上一篇文章/下一篇文章按钮

Question

我有以下代码：

<div class="wrap">
   <div class="next">
   <?php next_post('%', 'Next post', 'no'); ?>

   </div>

   <div class="prev">
    <?php previous_post('%', 'Previous post', 'no'); ?>
 </div>
</div>

经过数小时的尝试，我无法添加图像（png 格式的小箭头图像）而不是“下一篇文章”和“上一篇文章”

我尝试过（在 CSS 中）背景图像：url(../img/arrow-left.png);除其他外。

但是当我创建href标签时它似乎确实有效

<a href="#" class="next"></a>
<a href="#" class="prev"></a>

但问题是我不能在 href 中嵌入<?php next_post(); ?> 可以吗？

像这样：“ class="next">

这对我不起作用..

如果您需要更多信息，请告诉我，我会提供。

Answer 1

Wordpress 函数 next_post 已被弃用。最好使用next_post_link 函数。

http://codex.wordpress.org/Function_Reference/next_post_link

您可以更改输出格式，包括这样的图像：

<div class="wrap">
       <div class="next">
            <?php $next_dir = "<img src='" . get_bloginfo('template_directory') . "/img/arrow-right.png'/>"?>
            <?php next_post_link('%link', $next_dir . '<span>Next Post</span>', TRUE); ?>
        </div>
        <div class="prev">
            <?php $prev_dir = "<img src='" . get_bloginfo('template_directory') . "/img/arrow-left.png'/>"?>
            <?php previous_post_link('%link', '<span>Previous Post</span>' . $prev_dir, TRUE); ?>
        </div>
    </div>

更新 1

使用提供的解决方案，您还必须根据需要修改 css 文件。另一种方法（这是更好的 imo）是在不更改任何 php 代码的情况下执行以下操作：

.next a{
    width: 25px;
    height: 25px;
    background: url(/img/arrow-right.png) no-repeat 0 0;
    text-indent: -9999px;
}

.prev a{
    width: 25px;
    height: 25px;
    background: url(/img/arrow-left.png) no-repeat 0 0;
    text-indent: -9999px;
}

wordpress渲染出来的html代码是<a href="link-of-next-post" rel="next"></a>这样的链接。

您还应该将宽度和高度更改为图像的尺寸。