今天在企业站开发中,想要自己定义单页面(详情页)上下篇链接的样式.要实现的最终效果如下图

小编在网上一搜有很多的教程,但大多都是最基本的用法:previous_post_link(‘%link’,’%title’,true),根本就没有对链接的样式进行修改.所以小编想要自己深入研究一下.花费了很多功夫,小编仍没有完全实现效果:结果如下图:

就是左右两边的箭头小编怎嘛也加不上,知道是一个class为prev的样式,但小编就是加不到该a标签上,让小编很是捉急.以下是目标样式的html代码

<div class="prevnext-posts clearfix">
    <a href="" class="prev">
        <p>Previous</p>
        <p class="title">Waste plastic pyrolysis plant project report</p>
    </a>
    <a href="#" class="next">
        <p>Next</p>
        <p class="title">
            END
        </p>
    </a>
</div>

和小编实现的结果的html代码

<div class="prevnext-posts clearfix">
    <a href="http://www.fjzhpack.cc/news-2/" rel="prev">
        <p>Previous</p>
        <p class="title">news</p></a>
    <a href="">
        <p>NEXT</p>
        <p class="title">END</p></a>
</div>
通过对比,就是在a标签中缺一个样式.小编尝试了很久都没有加上去.不过对%link和%title有了更深的认识,以下是小编的PHP代码
<div class="prevnext-posts clearfix">

    <?php if (get_previous_post($categoryIDS)) { previous_post_link('%link','<p>Previous</p> <p class="title">%title</p>',true);} else { echo '<a href=""><p>Previous</p><p class="title">FIRST</p></a>';} ?>

    <?php if (get_next_post($categoryIDS)) { next_post_link(' %link','<p>Next</p> <p class="title">%title</p>',true);} else { echo '<a href=""><p>NEXT</p><p class="title">END</p></a>';} ?>

</div>
其中,%link它会在前端输出一个<a></a>标签,该标签会带着一个超链接.在%link前后基本加不上什么可以帮助布局的标签.而%title标签则是在前端输出标题名称,
小编进行样式修改的时候,就是在%title前后加上的.她会被包含在%link生成的<a>标签中.如代码所示,小编增加两个p标签就是在%title这里实现的.

 

但这仍不是小编最终想要的结果,请教一个前辈,他扔给我一串代码添加到functions中,说是可以给a标签添加样式

function of_previous_posts_link_attributes() {
   return 'class="previouspostslink"';
}
add_filter( 'previous_posts_link_attributes', 'of_previous_posts_link_attributes' );

function of_next_posts_link_attributes() {
   return 'class="nextpostslink"';
}
add_filter( 'next_posts_link_attributes', 'of_next_posts_link_attributes' );
然而小编尝试了下并没有实现效果.治好在网上继续苦逼的查资料.功夫不负有心人,终于找到了一篇可以使用的教程最后经过小编的修改完全实现了功能.以下是代码:
最后实现效果的正确代码
 <?php
       $current_category=get_the_category();
       $prev_post = get_previous_post($current_category,'');
       $next_post = get_next_post($current_category,'');
       ?>
       <div class="prevnext-posts clearfix">

           <?php if (!empty( $prev_post )): ?>
           <a href="<?php echo get_permalink( $prev_post->ID ); ?>" class="prev">
               <p>Previous</p>
               <p class="title"><?php echo $prev_post->post_title; ?></p>
           </a>
               <?php else : ?>
               <a href="" class="prev">
                   <p>Previous</p>
                   <p class="title">FIRST</p>
               </a>
           <?php endif; ?>

           <?php if (!empty( $next_post )): ?>
           <a href="<?php echo get_permalink( $next_post->ID ); ?>" class="next">
               <p>Next</p>
               <p class="title" >
                   <?php echo $next_post->post_title; ?>
               </p>
           </a>
           <?php else: ?>
               <a href="" class="prev">
                   <p>Previous</p>
                   <p class="title">END</p>
               </a>
           <?php endif; ?>
       </div>
中间经历了很多的失败.但是做技术,只要愿意静下心来,认真研究.终究会克服难题的!