純代碼製作wordpress上下篇,分類上下篇

對於一個網站來說,文章上下篇是必不可少的,wordpress自帶的上下篇對於SEO優化不是很友好,上下篇的鏈接並沒有title屬性的存在。

所以這兩天一直在看各種wordpress的上下篇的函數,期間也看了很多的案例,但是都沒有能找到能滿足我的要求的。

經過一晚上的研究,出了一套可用的wordpress上下篇的代碼,考慮到第一篇和最後一篇對瀏覽者的友好度,添加了《已經是最後一篇》和《已經是第一篇了》的提示。

上下篇使用了最直接的佈局,外面只有一個div標籤來抱起來,裏面是直接輸出了a鏈接。

1、php代碼如下

<!--上下篇開始-->
<div class="shangxia">
<?php
$current_category=get_the_category();
$prev_post = get_previous_post($current_category,'');
$next_post = get_next_post($current_category,'');
?>
<?php if (!empty( $prev_post )): ?>
<a href="<?php echo get_permalink( $prev_post->ID ); ?>" title="上一篇:<?php echo $prev_post->post_title; ?>">上一篇:<?php echo $prev_post->post_title; ?></a>
<?php else : ?>
<a title="已經是第一篇了">已經是第一篇了</a>
<?php endif; ?>
<!--上下片分離-->
<?php if (!empty( $next_post )): ?>
<a href="<?php echo get_permalink( $next_post->ID ); ?>" title="下一篇:<?php echo $next_post->post_title; ?>">下一篇:<?php echo $next_post->post_title; ?></a>(gendan5.com)
<?php else : ?>
<a title="已經是最後一篇了">已經是最後一篇了</a>
<?php endif; ?>
</div>
<!--上下篇結束-->
2、CSS樣式如下

.shangxia a {
width: 50%;
color: #fff;
float: left;
box-sizing: border-box;
padding: 0 10px;
display: block;
overflow: hidden;
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
}
.shangxia a[href]:hover {
color: #fff;
background: #000;
}
.shangxia a:nth-child(2) {
text-align: right;
}
3、輸出代碼如下,a鏈接上有title

<div class="shangxia">
<a href="http://cenggel.com/jishu/19.html" title="上一篇:wordpress安裝失敗怎麼辦?">上一篇:wordpress安裝失敗怎麼辦?</a>
<a title="已經是最後一篇了">已經是最後一篇了</a>銀行代碼http://www.gendan5.com/swiftcode.html

</div>
4、wordpress分類目錄上下篇、頁面截圖

4、這樣你就可以使用wordpress的上下篇了,如果你想在很多個頁面使用wordpress上下篇的話,可以放在單獨的.php文件中,在詳情頁中引入進去也是可以的。引入代碼如下:

<?php require('shangxia.php');?>
shangxia.php是你放wordpress上下篇的文件,可以按照你的文件命名來改變。

本wordpress上下篇的代碼主要是用在同一個分類目錄下文章中使用的。

現在你可以愉快的使用wordpress分類目錄上下篇了。

代碼還有很多的不足,如果您有更好的實現方法,還請指點。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章