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

新闻中心 NEWS CENTER

2025-11-02

浏览次数：次

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

本文旨在提供一种简单有效的解决方案，帮助 Blogger 用户移除博客中所有文章（包括未设置跳转链接的文章）自动出现的“Read More”按钮。通过添加一段CSS代码，即可轻松隐藏该按钮，提升博客的整体美观性和用户体验。

Blogger 博客平台有时会在每篇文章末尾自动添加“Read More”按钮，即使文章内容已经完整显示。这可能导致用户体验不佳，特别是对于内容较短的文章。以下步骤将指导您如何通过修改 Blogger 主题的 HTML 代码来移除这些不必要的按钮。

步骤 1：进入 Blogger 主题编辑页面

首先，登录您的 Blogger 账号，进入博客的后台管理页面。在左侧菜单栏中，找到并点击“主题”选项。

步骤 2：编辑 HTML 代码

在主题页面，点击“自定义”按钮旁边的下拉箭头，选择“修改 HTML”。这将打开 Blogger 的 HTML 代码编辑器。

步骤 3：查找 ]]> 标签

在 HTML 代码编辑器中，使用快捷键 Ctrl+F (Windows) 或 Cmd+F (Mac) 打开搜索框。输入 ]]> 并按下 Enter 键，找到该标签。这个标签通常位于主题 CSS 样式定义的末尾。

步骤 4：添加 CSS 代码以隐藏“Read More”按钮

在找到 ]]> 标签之后，将以下 CSS 代码粘贴到该标签之前：

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

这段 CSS 代码会将所有 class 为 jump-link flat-button ripple 的元素设置为隐藏，从而移除“Read More”按钮。

步骤 5：保存主题

在 HTML 代码编辑器右上角，点击“保存”按钮。Blogger 会自动保存您的更改并更新博客的主题。

步骤 6：检查效果

刷新您的博客页面，检查“Read More”按钮是否已成功移除。

注意事项：

在修改 HTML 代码之前，建议先备份您的主题，以防出现意外情况。您可以在“主题”页面点击“备份/恢复”按钮进行备份。
如果您使用了自定义主题，CSS 类名可能有所不同。您可以使用浏览器的开发者工具（通常按 F12 键打开）来检查“Read More”按钮的实际 class 名称，并相应地修改 CSS 代码。
如果上述方法无效，可能是因为您的主题使用了不同的 HTML 结构或 CSS 类名。请仔细检查您的主题代码，或联系主题开发者寻求帮助。

总结：

通过简单的 CSS 代码修改，您可以轻松移除 Blogger 博客中所有文章的“Read More”按钮，从而改善博客的整体外观和用户体验。请务必谨慎操作，并在修改代码之前备份您的主题。如果您遇到任何问题，请参考上述注意事项或寻求专业帮助。

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