AI摘要

本文介绍了两款Typecho插件:FootprintMap足迹地图插件,支持交互式地点标记、连线、筛选与可视化编辑,适合旅行记录展示;PageSidebarToggle插件则支持独立页面单独控制侧边栏显隐,解决主题一刀切问题。

刚刚在WordPress转到typecho做了两个插件来完善功能和使用/观看习惯,记录一下。

FootprintMap(足迹地图插件)

如果你想在 Typecho 博客中展示自己去过的城市、旅行路线、相关文章、图片记录,那么 FootprintMap 会是一款非常实用的足迹地图插件。

它支持在真实地图上标记地点,并将地点信息、年份、图片、文章链接等内容整合到一个交互式地图页面中。无论是独立足迹页、旅行归档页,还是关于页面扩展展示,都非常适合使用。

示例页面:https://beicb.top/distance.html
灵感来源于猪哥大佬的博客:https://blog.dazhu1988.com/distance.html
做成了插件,由 GLM-5.2 协助编写与完善。

功能特点

FootprintMap 并不只是一个简单的“地图打点插件”,而是围绕博客展示场景进行设计,兼顾美观、交互和可配置性。

主要功能包括:

  • 支持在真实地图上展示足迹地点
  • 支持 Leaflet / Mapbox GL 两种地图方案
  • 支持高德地图、OSM、Carto 等底图选择
  • 支持日间模式、夜间模式、自动模式
  • 支持足迹连线效果
  • 支持统计面板
  • 支持年份筛选
  • 支持地点搜索
  • 支持时间轴展示
  • 支持移动端优化
  • 支持离线缓存
  • 支持自定义标记颜色
  • 支持地点图片与相关文章链接
  • 支持悬浮预览与点击详情分层展示
  • 支持配置导出 / 导入
  • 支持足迹数据可视化编辑器
    通过这些功能,博客中的足迹展示不再只是一个静态列表,而是能真正成为内容导航和视觉展示的一部分。

适合场景

1. 单独做一个足迹页
2. 放进“关于我”页面
3. 作为旅行文章入口
4. 做年度总结页

此插件还特别适合以下类型的网站:

  • 旅行记录博客
  • 城市打卡类博客
  • 摄影博客
  • 生活日记博客
  • 个人主页 / 关于页面
  • 旅游文章归档页
  • 地图型内容展示页
    如果你希望把“去过哪里”与“写过什么”结合起来,那么这款插件会非常合适。

安装方法

  1. 下载插件文件
  2. 将文件夹重命名为 FootprintMap
  3. 上传到 Typecho 的 usr/plugins/ 目录
  4. 在后台「控制台」→「插件」中启用插件
  5. 点击「设置」进行配置

装好插件之后,在文章或独立页面中插入:[ footprint](f前的空格删掉)就可以把足迹地图插入到页面里。

如果你要创建一个独立足迹页,可以新建单页,在正文中只保留插件中说明的短代码即可。

足迹数据说明

插件支持通过后台填写足迹数据,每个地点可配置以下字段:
示例:

[
{
"lat": 39.90,
"lng": 116.41,
"name": "北京",
"desc": "故宫、长城、天坛,千年古都的厚重",
"year": "2023",
"color": "#ff4d4f",
"image": "https://example.com/beijing.jpg",
"link": "https://example.com/beijing-travel",
"linkTitle": "北京旅行记录"
}
]

同时,插件已提供 可视化足迹编辑器 ,可直接通过表格方式新增、修改、删除地点,不必强制手工编辑 JSON,更适合日常维护。

PageSidebarToggle(给每个页面独立的侧边栏开关)

Typecho 原生并没有提供页面级别的侧边栏开关功能 ,大多数主题也都是"一刀切"——要么全站显示,要么全站隐藏。
在一些分栏主题中如果想要新增一个类似相册的页面,侧边栏此时显得有些多余且影响美观了。于是,一个轻量级的 Typecho 插件 PageSidebarToggle 诞生了。

功能特性

此插件就一个功能

  • 在后台 新增/编辑页面 时,会多出一个「侧边栏显示」选项
  • 可选「显示侧边栏」或「隐藏侧边栏」,默认显示
  • 仅对独立页面生效 ,不影响文章页
  • 兼容主流 Typecho 主题(MWordStar、Facile、Default 等)

安装方法

  1. 将插件文件夹 PageSidebarToggle 上传至服务器上的 usr/plugins/ 目录
  2. 登录 Typecho 后台 → 控制台 → 插件
  3. 找到 PageSidebarToggle ,点击「启用」
  4. 回到「管理 → 独立页面」,新建或编辑任意页面,在「自定义字段」区域即可看到新选项

下载与源码

插件已托管在: https://github.com/227qidian/FootprintMap

也可以直接从 获取。