1

私は次のコードを持っています:

<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 で) background-image: url(../img/arrow-left.png); を試しました。そのことなど。

ただし、hrefタグを作成すると機能するようです

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

<?php next_post(); ?>しかし、問題は、href に埋め込むことができないことです。

そのように: " class="next">

私にはうまくいきませんでした..

さらに情報が必要な場合はお知らせください。提供いたします。

4

1 に答える 1

1

ワードプレスの機能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 ファイルを変更する必要もあります。これを行う別の方法（これはより良いものです）は、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>。

また、幅と高さを画像の寸法に変更する必要があります。

于 2013-10-22T18:10:20.563 に答える