Thêm nút next và previous vào trang single web WordPress
Code thêm bao gồm cả css
<style> .nav-single { width: 100%; border-top: 1px solid #e3e3e3; padding-top: 20px; margin-top: 10px; border-bottom: 1px solid #e3e3e3; padding-bottom: 18px; } .nav-single:after{ display: table; content: ""; clear: both; } .nav-single .nav-previous, .nav-single .nav-next{ width: 50%; float: left; position: relative; padding-right: 15px; } .nav-single .nav-next{ text-align: right; float: right; padding:0 0 0 15px; } .nav-single span, .nav-single a{ display: block; } .nav-single a{ color: #0b1c5f; } .nav-single a:hover{ color: #610808; } .nav-single a span{ font-weight: 700; } </style> <nav class="nav-single"> <span class="nav-previous"> <?php previous_post_link( '%link', '<span class="meta-nav">' . _x( '← Bài trước', 'Previous post link', '' ) . '</span> %title' ); ?> </span> <span class="nav-next"> <?php next_post_link( '%link', '<span class="meta-nav">' . _x( 'Bài kế tiếp →', 'Next post link', '' ) . '</span> %title' ); ?> </span> </nav><!-- .nav-single -->
Nội dung
Thêm nút với plugin netweb
netweb-next-previous-single giúp các bạn thêm 1 cách dễ dàng
[netweb_next_previous_single_shortcode]
//code php
<?php echo do_shortcode('[netweb_next_previous_single_shortcode]'); ?>
file css style
.blog__details__btns__item {
display: block;
border: 1px solid #ebebeb;
padding: 25px 30px 30px;
margin-bottom: 30px;
background: #f5f5f5;
}
.blog__details__btns {
margin-bottom: 40px;
}
Bình luận trên facebook netweb.vn