如何移除 Blogger 博客文章中的“Read More”按钮

新闻中心 NEWS CENTER

2025-10-29

浏览次数：次

如何移除 blogger 博客文章中的“read more”按钮

本文旨在提供一种简单有效的方案，帮助 Blogger 用户移除博客文章中自动出现的“Read More”按钮。通过添加一段 CSS 代码，即可轻松隐藏该按钮，从而优化博客的阅读体验，并使文章展示更符合个人需求，无需手动添加跳转链接。

Blogger 博客平台有时会在文章列表中自动添加“Read More”按钮，即使文章内容已经完全显示。这可能会影响博客的整体美观和用户体验。以下步骤将指导你如何通过 CSS 代码隐藏这些不必要的按钮。

操作步骤：

进入主题编辑页面： 首先，登录你的 Blogger 账号，进入博客的控制面板。在左侧菜单栏中，选择“主题”选项。
编辑 HTML 代码： 在主题页面中，点击“自定义”按钮旁边的向下箭头，然后选择“修改 HTML”。这将打开 Blogger 的 HTML 编辑器。
查找指定代码： 在 HTML 编辑器中，使用快捷键 Ctrl+F (Windows) 或 Cmd+F (Mac) 打开搜索框。在搜索框中输入 ]]> 并按下回车键。这将定位到主题 CSS 样式定义结束的位置。
添加 CSS 代码： 在找到的 ]]> 代码之前，粘贴以下 CSS 代码：

.jump-link.flat-button.ripple{
  display: none;
}

代码解释：

注意事项：

备份主题： 在修改 HTML 代码之前，强烈建议备份你的博客主题。如果出现任何问题，你可以轻松恢复到之前的状态。
清除缓存： 保存更改后，如果“Read More”按钮仍然存在，请尝试清除浏览器缓存并重新加载博客页面。
主题差异： 不同的 Blogger 主题可能使用不同的 CSS 类名。如果上述代码无效，请检查你的主题 HTML 代码，找到“Read More”按钮对应的 CSS 类名，并相应地修改代码。
其他方法： 某些 Blogger 主题可能提供了直接移除“Read More”按钮的选项。在修改 HTML 代码之前，请检查主题设置，看看是否有相关的配置选项。

总结：

通过以上步骤，你可以轻松移除 Blogger 博客文章中自动出现的“Read More”按钮，从而优化博客的阅读体验。记住，在修改 HTML 代码之前备份你的主题，并确保清除浏览器缓存以查看更改效果。如果遇到问题，请参考主题文档或寻求社区帮助。

以上就是如何移除 Blogger 博客文章中的“Read More”按钮的详细内容，更多请关注其它相关文章！