错误的“阅读更多”行为,试图通过插入标签来修复

时间:2017-07-06 作者:user48297

似乎其他人也会对WordPress的“阅读更多”有同样的问题,但通过该标签查看之前的问题并没有帮助,所以在这里发布。

作为一个新的自托管WordPress用户,我选择了一个WordPress。com主题我喜欢(Isola),但现在它有一个“糟糕的用户体验”。问题是:如果帖子中有一个WP“Read More”标签,单击该链接会跳转到预期位置下方的完整帖子中,在屏幕视图上方会出现一些未读的行,因此隐藏起来。这种行为取决于屏幕宽度-对于窄屏幕,如在移动设备上,所有操作都与预期一样,但随着屏幕变宽,第一行、第二行、第三行被隐藏。

隐藏的文本让读者感到困惑,因为事情突然从句中开始,他必须设法找出(1)他正在阅读的内容中缺少了几行,(2)他需要向上滚动才能阅读。FWIW这篇文章从一个狭窄的图像开始,文本流向右侧,我在第一段后面插入了“阅读更多”标签。我不确定浏览器格式是否是一个因素,但这种行为在Chrome、Firefox和IE中都会发生。

我不想让我的博客读者有这种糟糕的经历!我不懂PHP,但懂编码,所以我认为创建更好的体验并不太难——通过跳转到文本顶部(并在断点处插入“hr”标记,使其更加明显)。这需要(1)更改“more”链接标签和(2)插入新的锚定标签。我已经成功地创建了php来做第一件事。但我的尝试(2)不起作用。

我查看了WP“挂钩”以找到一些相关的东西,但有将近2700个“挂钩”。我尝试在页面源代码中看到“.entry header”html注释的地方插入锚定标记,代码如下。但我的完整贴子页面的来源没有变化。所以我做错了什么,我在这里寻求一些更有经验的帮助。

function add_more_tag($content) {
        $content = preg_replace(\'/<!-- *\\.entry-header *-->/\', \'<span id="more-000"></span>\', $content);
        return $content;
}
add_filter(\'the_content\', \'add_more_tag\', 20, 1);
或者,我想知道是否有人有其他方法来纠正我描述的“糟糕的用户体验”!就我个人而言,我对这个主题的这一方面的工作方式感到非常失望(有人告诉我,其他wordpress.com主题也会出现这种行为)。

PS:我知道有一个插件可以删除“更多”链接,这是我第一次尝试的。但跳转会跳到立柱顶部,即横幅上方。横幅很大,占用了很多空间,所以我更喜欢跳到横幅下方,即文本顶部。

1 个回复
最合适的回答,由SO网友:user48297 整理而成

下面是我用来强制“继续阅读”链接跳转到文本顶部、标题下方的解决方案

我首先在样式的函数中将现有的“more”标记修改为指定的标记。php,在它的末尾我添加了

// ALTER MORE TO JUMP TO SPECIFIED TAG (which is above post text in content-single.php)
function alter_more_jump_link($link) {
    $moreoffset = strpos($link, \'#more-\');
    if ($moreoffset) { 
      $link = preg_replace( "/#more-[0-9]+/", "#more-jump", $link );
    }
    return $link;
}
add_filter(\'the_content_more_link\', \'alter_more_jump_link\', 20,1);
在“我的样式”的“内容单”中,在标题后插入指定的“更多”标记。php,第行之后

</header><!-- .entry-header -->
我补充道

<span id="more-jump"></span>

结束

相关推荐