WordPress 分页 - 添加锚链接

Posted 2023-03-10

【中文标题】WordPress 分页 - 添加锚链接

【英文标题】：WordPress pagination - Adding an Anchor link

【发布时间】：2012-11-01 22:59:00

【问题描述】：

我的 index.php 中有这个锚链接：

<a name="blog"></a>

我希望此锚链接在单击 next_posts_link 和 previous_posts_link 时起作用，这样它就不会一直到达页面顶部。不过，我不知道如何为 WordPress 分页执行此操作。

这是我的分页代码：

<div class="pagenavi">
<?php if( function_exists( 'wp_pagenavi ' ) ) 
wp_pagenavi();
 else 
next_posts_link ('<div class="arrow-back"></div>'); 
previous_posts_link('<div class="arrow-forward"></div>') ; 

【问题讨论】：

您的问题似乎有一部分遗漏了..

您粘贴正确了吗？ html 代码或结束 ) 的引号在哪里

【参考方案1】：

解决方案 2：

使用 jQuery 将锚标记 #blog 添加到博客文章中的 prev/next 链接

<script type="text/javascript">
$(document).ready(function() 
    $('.pagenavi a').each(function(i,a)$(a).attr('href',$(a).attr('href')+'#blog'));
);
</script>

演示： http://jsfiddle.net/mfeldheim/EkMfP/12/

【参考方案2】：

不幸的是 wp_pagenavi 函数似乎封装了完整的链接构建。

如果您无法在 wordpress 或插件配置中配置通用后缀，我不建议您更改 Wordpress 代码。

相反，您可以执行一个小的 JavaScript，在加载时将浏览器页面移动到锚点。

此示例使用 jQuery。将其粘贴到模板的底部位置。

<script type="text/javascript">
    $(document).ready(function() 
        $('html, body').scrollTop( 
            $('[name="blog"]').offset().top 
        );
    );
</script>

无法对此进行测试，但应该可以。即使是简单的脚本也无法在 iPhone 键盘上编写......

编辑： 像魅力一样工作，查看演示 http://jsfiddle.net/mfeldheim/EkMfP/7/

【讨论】：

这确实有效，但由于某种原因，它没有到达我放置锚点的位置。它转到上面的 div 。我已经检查过了，我肯定把锚放在了正确的地方......

另外，我希望它始终位于页面加载的顶部，除非用户单击博客上的下一个/上一个帖子链接，但这个解决方案总是让它在加载时锚定。跨度>

在这种情况下，我的解决方案将不起作用，因为 JavaScript 无法确定您打开帖子的方式。相反，您可以使用 JavaScript 将#blog 添加到下一个/上一个链接