巴黎午夜漫步:用 Eleventy 多语言博客构建可检索的城市旅行指南

发布时间:2026/10/12 1:19:27

巴黎午夜漫步:用 Eleventy 多语言博客构建可检索的城市旅行指南 示例工程【免费下载链接】samplesA repo containing samples tied to new functionality in each release of Google Chrome.项目地址https://gitcode.com/gh_mirrors/samp/samples点击查看免费下载夜幕降临后的巴黎是光与影交织的城市也是一座幽灵之城。深夜十点之后拉丁区狭窄的鹅卵石街道上你几乎可以想象昔日的哲学家与革命家们正在昏暗的咖啡馆角落里争论不休。这篇旅行指南以 巴黎午夜漫步 一文为原型带你复盘塞纳河畔的深夜散步路线、街头美食与安全贴士同时结合本仓库 trailblazers 站点的 Eleventy 源码说明这类图文内容是如何以 Markdown Front Matter 的形式被结构化、多语言化并最终渲染成静态博客页面的。读完本文你将掌握三件事一是完整复现塞纳河午夜散步—蒙马特收尾—街角美食的巴黎夜游动线二是看懂一篇带标题、标签、作者、日期和封面图字段的旅行博文在 Eleventy 中对应的数据模型与渲染流程三是了解本站如何用 i18n 插件和本地化集合为同一篇文章产出英语、西班牙语、日语多版本页面。从元数据看一篇旅行博文的技术骨架原文档trailblazers/content/ja/blog/paris-midnight-stroll/index.md的正文第一行不是文字而是一段 YAML Front Matter这是 Eleventy 数据级联Data Cascade的入口。把文档的标题、摘要、日期、标签、作者全部结构化--- title: パリ歴史を辿る真夜中の散歩 description: セーヌ川沿いの深夜の散歩は、究極のパリジャン・ロマンスです。 date: 2026-03-10 tags: [都市, フランス, ロマンス] author: maya ---这些字段在渲染链路中被逐级消费title / description被 post.njk 布局 渲染为页面h1与分享数据navigator.share时作为text同时作为归档列表卡片的核心文案。date通过readableDate(locale)过滤器输出本地化日期并在归档列表中以datetime属性标注机器可读时间。tags参与 tags-schema.njk 生成的tags-schema.json校验枚举并驱动零维护的标签页。author在 eleventy.config.js 中定义的authorLocaleCombos集合把作者maya / ashok / julia与三种语言组合生成作者专属页面。同一篇文章的英语版本trailblazers/content/en/blog/paris-midnight-stroll/index.md与西班牙语版本trailblazers/content/es/blog/paris-midnight-stroll/index.md采用完全相同的 Front Matter 结构只是title、description、tags换成了对应语言这正是多语言站点内容分离、结构统一的典型做法。正文中的 Markdown 图片语法[![フランス、パリ](https://raw.gitcode.com/gh_mirrors/samp/samples/raw/92e10978e30fb18693920e372297b17be3274431/trailblazers/content/es/blog/reykjavik-northern-lights/cover.jpg?utm_sourcegitcode_repo_files)](https://link.gitcode.com/i/455696a1f9aa43ed74dd2400961ad0dd)引用与文档同目录的封面图而目录下的 cover.jpg 会被 eleventyImageTransformPlugin 自动转换为 AVIF / WebP 并补上width、height、loadinglazy、decodingasync等属性规避布局偏移。塞纳河畔的午夜散步路线复盘原文档的核心叙事是一条反常规的夜游动线避开白天的拥挤观光团选择深夜 10 点后出行从塞纳河畔一路走到蒙马特。具体分解如下起点拉丁区カルチエ・ラタン——深夜十点后在狭窄的鹅卵石街道上穿行氛围感的来源是想象历史人物在昏暗咖啡馆中争论的场景。塞纳河段从新桥ポン・ヌフ出发沿河夜行途经夜晚如同珠宝盒般发光的**卢浮宫ルーヴル**外观。收尾蒙马特モンマルトル——在**特特尔广场テルトル広場观看路灯下仍在创作的本地画家最后在圣心大教堂サクレ・クール寺院**的台阶上于凌晨 2 点俯瞰全城。这条路线在仓库中的多语言对照版本英语版、西班牙语版里保持了完全一致的四个叙事小节——塞纳河夜曲、街头灵魂美食、贴士、亮点——只是语言不同。这意味着旅行内容的叙事骨架一旦确定就可以通过语言文件批量衍生多语言页面。从渲染实现看这类正文会被 content.11tydata.js 与 blog.11tydata.js 的数据级联补上默认布局与posts标签最终套用 post.njk 布局输出为静态 HTML并在文章底部由posts_${locale}集合自动生成上一篇/下一篇导航。街角美食两顿有记忆点的夜宵原文档对巴黎美食的描述刻意避开米其林星级聚焦街头与市井招牌推荐圣日耳曼德佩サン・ジェルマン・デ・プレ附近街边摊的榛果巧克力酱香蕉可丽饼ヌテラとバナナのクレープ趁热倚着路灯吃是格别的一餐。深夜正餐一家供应经典牛排薯条ステーキ・フリートSteak Frites的传统小酒馆ビストロ配浓郁胡椒酱汁作者形容为食物形态的拥抱。这段内容在站点中的呈现方式值得注意每篇文章正文末尾post.njk 布局 会依次插入飞行航班组件flight-widget.njk、旅行助手组件travel-agent-widget.njk、T 恤组件tshirt-widget.njk和国家地图组件country-map.njk这些 组件文件 属于站点级的增强交互模块与正文的纯 Markdown 内容分离体现了 Eleventy布局与内容解耦的设计——作者只管写文字交互组件由模板层统一注入。实用贴士与安全提示原文档完整保留原文档的ヒントとアドバイス一节包含三条可直接落地的建议在此完整保留并补充说明自拍的陷阱如果讨厌人潮日落时分的特罗卡德罗广场トロカデロ広場要避开。想更美且更安静地看埃菲尔铁塔可以转向战神公园シャン・ド・マルス公園或寻找**比尔阿克姆桥ビル・アケム橋**这类隐蔽桥梁。步行是硬性要求巴黎最适合用双脚丈量准备一双好看又耐穿的步行鞋——作者的原话是你的脚踝会感谢你。夜间安全巴黎整体安全但要提防热门景点周边的卖花人和编手链的人一句礼貌而坚定、轻声细语的Non, merci不用了谢谢通常就足够应对。亮点清单与一句话收尾原文档以四条ハイライトHighlights总结这次夜游的不可错过瞬间夜间的卢浮宫金字塔亮灯时没有白天那 3 万名游客。塞纳河畔步道欣赏城市建筑骨骼的最佳视角。凌晨 2 点的圣心大教堂巴黎最安静、最具魔法感的观景点。完美的可丽饼定义巴黎体验的简单快乐。结尾一句夜间的巴黎不只是一个地方而是一种情绪点明全文主旨这是一座邀请你放慢脚步、抬头仰望、允许自己稍稍迷路的城市。这句话同时也是本仓库中该旅行主题系列内容如 trailblazers/content/ja/blog 目录下的阿马尔菲海岸、阿姆斯特丹运河等目的地文章统一的情感基调。站点视角这篇博文在 Eleventy 中的完整生命周期把上面所有零散证据串起来这篇日语博文从 Markdown 到线上页面的完整链路是输入content/ja/blog/paris-midnight-stroll/index.md含 Front Matter 与正文同目录cover.jpg。数据级联content.11tydata.js 提供默认布局blog.11tydata.js 打上posts标签目录结构本身content/ja/通过 ja.json 声明locale: ja与dir: ltr。集合与分页eleventy.config.js 按en/es/ja三种主语言构建posts_${lang}集合blog.njk 用filterByLocale(locale)过滤出当前语言的文章列表postslist.njk 渲染归档卡片封面图直接取自post.url cover.jpg。多语言与本地化eleventy-plugin-i18n配合fallbackLocales如en-US → en、es-ES → es处理语言回退每篇文章以/{locale}/blog/...的 permalink 输出并为每种语言生成 Atom feed/{lang}/feed/feed.xml。输出dir.output指向dist目录pathPrefix: /samples/trailblazers/dist/见 eleventy.config.js支持子路径部署。所以当你看到这篇巴黎夜游散文时看到的不仅是文字更是一个完整的、面向搜索引擎与多语言读者的静态站点内容单元——Front Matter 管结构化、i18n 管语言、Image 插件管图片性能、集合管归档与导航。如果你想在本地复现这套站点可以在仓库 trailblazers 目录下执行npm install后运行npx 11ty/eleventy --serve启动开发服务器或在构建模式下运行npx 11ty/eleventy生成生产级静态文件。封面图说明文中配图来自本仓库trailblazers/content/ja/blog/paris-midnight-stroll/cover.jpg呈现亚历山大三世桥黄昏夜景与巴黎夜游主题直接对应。赞分享示例工程【免费下载链接】samplesA repo containing samples tied to new functionality in each release of Google Chrome.项目地址https://gitcode.com/gh_mirrors/samp/samples点击查看免费下载相关推荐哈瓦那旅行指南复古街道与鲜活历史——trailblazers 城市漫步笔记哈瓦那旅行指南复古街道与鲜活历史——trailblazers 城市漫步笔记 哈瓦那是一座仿佛被冻结在时间中的城市1950 年代的老爷车驶过马拉贡海滨大道殖示例工程用 Eleventy 搭建静态博客eleventy-base-blog 起步模板全解与 Vercel 构建集成实战用 Eleventy 搭建静态博客eleventy base blog 起步模板全解与 Vercel 构建集成实战 本文围绕 Vercel 开源仓库中内嵌的CLI后端云原生trailblazers 旅行博客实战以 Santorini 圣托里尼文章为例拆解 Eleventy 多语言内容结构与创作发布流程trailblazers 旅行博客实战以 Santorini 圣托里尼文章为例拆解 Eleventy 多语言内容结构与创作发布流程 导读 本文以开源仓库 s示例工程上一篇【亲测免费】 Codeforces-go 使用教程下一篇Gopeed 项目教程创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
延伸阅读

更多相关文章

2026/10/12 1:19:27

不买开发板学STM32?纯软件仿真入门路线与QEMU实战

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/12 1:14:26

PLC工程师实战经验:90条避坑与排查思路全解析

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/12 1:14:26

深度稀疏自动编码器:高维稀疏矩阵降维与特征提取实战

简介:这份资源围绕深度稀疏自动编码器(DSAE)展开,面向需要在MATLAB环境下完成高维数据降维与特征提取的研究者与工程人员,尤其适合处理节点相似度矩阵这类图分析、社交网络场景。包内共58个文件,以m脚本、m…

2026/10/12 2:34:32

Linux tree命令从安装到精通:核心参数与避坑指南

简介:面向 Linux 系统管理者和开发者的一份 tree 命令完整安装资源,解决 CentOS 等发行版默认未预装 tree 时无法以树形方式浏览目录的问题。tree 作为经典递归目录列表工具,能按层级深度缩进展示文件与子目录,显著提升文档整理、…

2026/10/12 2:34:32

全插件化Agent框架与可回放会话日志:从排障困境到工程化实践

1. 一次失败的调试经历:我从日志里什么都看不出来去年年底,我在维护一个基于大语言模型的多步骤Agent应用。任务链条不算复杂:用户提需求,Agent拆解计划,调用三个内部工具,最终汇总答案。但那天线上出了一个…

2026/10/12 2:34:32

C++11新特性快速一览

C11新特性快速一览2011年发布的C11标准被誉为"C的文艺复兴",为这门经典语言注入了现代活力。本文将快速梳理C11的核心特性,助您把握这次重大革新。核心语言特性革新自动类型推导让代码更简洁: cpp auto i 42; // i 被推…

2026/10/12 2:34:32

Linux tree命令安装与使用指南:从apt/yum到源码编译

简介:Linux 环境下的 tree 命令能以树状结构展示目录层级,生成深度缩进的清晰文件列表,是排查目录结构或梳理项目文件时的常用小工具。这份配套资源面向需要安装 tree 的 Linux 用户,集中提供 tree-1.7.0 源码包与简明安装说明&am…

2026/10/12 2:34:32

RockyLinux 9.5升级OpenSSH/OpenSSL的RPM化加固脚本

简介:面向Rocky Linux 9.5 x86_64服务器的运维与安全人员,针对系统自带OpenSSH组件版本老旧、远程管理通道存在暴露风险的问题,提供一套离线可用的RPM升级与加固方案。压缩包内含6个文件,大小约10.96MB,结构为5个RPM安…

2026/10/12 2:29:31

王虹攻下的三维挂谷猜想,OpenAI放出175页四维证明稿

王虹攻下三维,OpenAI直接把四维证明稿摆上桌了! 10月6日,OpenAI在GitHub上公开首批722篇数学手稿。 其中一篇长175页,目标直指四维挂谷猜想。 另一篇97页,还要在三维上再闯一关,瞄准比王虹与Zahl的集合定…

2026/10/11 0:02:13

Python调用Gemini Structured Outputs实现工单路由门禁

客服工单最怕的不是模型“答错一句话”,而是它给出一段看起来合理的说明,程序却从中猜错优先级。通俗做法是:要求模型只交 JSON(JavaScript Object Notation,轻量数据格式),再让代码验证它。Gem…

2026/10/11 0:02:13

Spring Boot超市进销存系统毕设实战:从需求拆解到答辩通关

最近带的一个学生项目组里,有A同学跑来问我:选什么毕设题目最稳妥,既能让评审老师觉得工作量够,又不会在答辩时被问到语无伦次。我第一反应就是推荐基于Spring Boot的超市仓库管理系统——也就是超市进销存系统。这个题目乍一看平…

2026/10/11 0:02:13

Flutter StatefulWidget 生命周期核心解析

很多刚开始接触 Flutter 的朋友,在看完一堆“Hello World”和基础组件之后,大概率都会撞上同一堵墙:StatefulWidget 里那堆 initState、build、dispose 方法,到底什么时候被调用?为什么顺序是那样?在里面到…

2026/10/12 0:04:22

绝缘子缺陷检测数据集清洗与工业级训练实战指南

简介:本资源是面向电力AI研发人员、工业视觉工程师及智能巡检系统开发者的绝缘子缺陷检测专用YOLO格式数据集,解决无人机航拍场景下绝缘子破损、污闪、积雪等9类典型缺陷的精准识别与定位难题。数据集共2139张真实巡检图像(含训练/验证/测试集…

还想了解更多?直接咨询顾问

免费诊断 + 免费方案 + 透明报价。

全国咨询热线400-8866-253
免费获取方案
☎咨询二维码 ☎ ↑