如何将CSS类添加到previous_post_link 输出或仅获取URL并自己创建HTML标记
如何将CSS类添加到PERVICE_POST_LINK或获取上一篇/下一篇文章链接URL
6 个回复
最合适的回答,由SO网友:kaiser 整理而成
您可以使用更为本机的函数，该函数位于previous_/next_post_link();:
# get_adjacent_post( $in_same_cat = false, $excluded_categories = \'\', $previous = true )
$next_post_obj = get_adjacent_post( \'\', \'\', false );
$next_post_ID = isset( $next_post_obj->ID ) ? $next_post_obj->ID : \'\';
$next_post_link = get_permalink( $next_post_ID );
$next_post_title = \'»\'; // equals "»"
?>
<a href="<?php echo $next_post_link; ?>" rel="next" class="pagination pagination-link pagination-next">
<?php echo $next_post_title; ?>
</a>
SO网友:Yazeed Al Oyoun
previous\\u post\\u link和next\\u post\\u link函数有过滤器，其工作方式与previous\\u posts\\u link\\u属性和next\\u posts\\u link\\u属性不同，我不知道为什么wordpress网站上没有记录这一点。
function posts_link_next_class($format){
$format = str_replace(\'href=\', \'class="next clean-gray" href=\', $format);
return $format;
}
add_filter(\'next_post_link\', \'posts_link_next_class\');
function posts_link_prev_class($format) {
$format = str_replace(\'href=\', \'class="prev clean-gray" href=\', $format);
return $format;
}
add_filter(\'previous_post_link\', \'posts_link_prev_class\');
SO网友:Digitalchild
您可以在函数调用周围放置一个元素，并以这种方式设置它的样式。这样地：
<div class="previous_post_link"><?php previous_post_link(\'%link\'); ?></div>
.previous_post_link a { some styles here }
SO网友:Lawrence Oputa
再加一点，下面的钩子的问题是它们是复数形式，你的问题意味着“你想用单数形式来设置它们的样式”。
posts_link_attributes() {
return \'class="styled-button"\';
}
add_filter(\'next_posts_link_attributes\', \'posts_link_attributes\');
add_filter(\'previous_posts_link_attributes\', \'posts_link_attributes\');
因为单数下一个链接和前一个链接的过滤器应用不同see this
下面的代码应该适用于单数链接。把它们放在你的功能中。php文件
function post_link_attributes($output) {
$code = \'class="styled-button"\';
return str_replace(\'<a href=\', \'<a \'.$code.\' href=\', $output);
}
add_filter(\'next_post_link\', \'post_link_attributes\');
add_filter(\'previous_post_link\', \'post_link_attributes\');
<!--BEGIN: Page Nav-->
<?php if ( $wp_query->max_num_pages > 1 ) : // if there\'s more than one page turn on pagination ?>
<nav id="page-nav">
<h1 class="hide">Page Navigation</h1>
<ul class="clear-fix">
<li class="prev-link"><?php next_posts_link(\'« Previous Page\') ?></li>
<li class="next-link"><?php previous_posts_link(\'Next Page »\') ?></li>
</ul>
</nav>
<?php endif; ?>
<!--END: Page Nav-->
SO网友:Jahirul Islam Mamun
尝试以下方式--
<?php $prv_post = get_previous_post();
$next_post = get_next_post();
?>
<?php if(!empty($prv_post)) { ?>
<a href="<?php echo get_permalink($prv_post->ID ); ?>" class="prev" rel="prev">
<span class="meta-nav"><?php _e(\'Previous Post\', \'awe\') ?></span>
<span class="nav-icon"><i class="fa fa-angle-double-left"></i></span>
<?php echo get_the_title($prv_post->ID ); ?> ...
</a>
<?php } ?>
<?php if(!empty($next_post)) { ?>
<a href="<?php echo get_permalink($next_post->ID ); ?>" class="next" rel="next">
<span class="meta-nav"><?php _e(\'Next Post\', \'awe\') ?></span>
<span class="nav-icon"><i class="fa fa-angle-double-right"></i></span>
<?php echo get_the_title($next_post->ID ); ?> ...
</a>
<?php } ?>
SO网友:Adrian
我发现最简单的方法就是在函数中添加div。包装链接的php文件。我将我的命名为class=“plinks”
if ( ! function_exists( \'themename_post_nav\' ) ) :
function themename_post_nav() {
global $post;
$previous = ( is_attachment() ) ? get_post( $post->post_parent ) : get_adjacent_post( false, \'\', true );
$next = get_adjacent_post( false, \'\', false );
if ( ! $next && ! $previous )
return;
?>
<nav>
<div class="plinks">
<?php next_post_link( \'%link\', _x( \'Previous\', \'Pevious link\', \'themename\' ) ); ?>
<?php previous_post_link( \'%link\', _x( \'Next\', \'Next link\', \'themename\' ) ); ?>
</div>
</nav>
<?php
}
endif;
.plinks a{
display:inline-block;
margin:1em 4px;
font-size:1em;
font-weight:500;
border:0;
padding:8px 1em;
color:#fff;
background:#000;
}
.plinks a:hover{
opacity:0.8;
}
<?php themename_post_nav(); ?>
结束