-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.json
1 lines (1 loc) · 79 KB
/
index.json
1
[{"categories":[],"content":"免责声明条款 ","date":"2021-03-12","objectID":"/my-disclaimers/:0:0","tags":[],"title":"My Disclaimers","uri":"/my-disclaimers/"},{"categories":["Theme"],"content":" 探索 Hugo - LoveIt 主题的全部内容和背后的核心概念。","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"探索 Hugo - LoveIt 主题的全部内容和背后的核心概念。 ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:0:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"1 准备 由于 Hugo 提供的便利性, Hugo 本身是这个主题唯一的依赖. 直接安装满足你操作系统 (Windows, Linux, macOS) 的最新版本 Hugo (\u003e 0.62.0). 为什么不支持早期版本的 Hugo? 由于 Markdown 渲染钩子函数 在 Hugo 圣诞节版本 中被引入, 本主题只支持高于 0.62.0 的 Hugo 版本. 推荐使用 Hugo extended 版本 由于这个主题的一些特性需要将 SCSS 转换为 CSS, 推荐使用 Hugo extended 版本来获得更好的使用体验. ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:1:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"2 安装 以下步骤可帮助你初始化新网站. 如果你根本不了解 Hugo, 我们强烈建议你按照此 快速入门文档 进一步了解它. ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:2:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"2.1 创建你的项目 Hugo 提供了一个 new 命令来创建一个新的网站: hugo new site my_website cd my_website ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:2:1","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"2.2 安装主题 LoveIt 主题的仓库是: https://github.com/dillonzq/LoveIt. 你可以下载主题的 最新版本 .zip 文件 并且解压放到 themes 目录. 另外, 也可以直接把这个主题克隆到 themes 目录: git clone https://github.com/dillonzq/LoveIt.git themes/LoveIt 或者, 初始化你的项目目录为 git 仓库, 并且把主题仓库作为你的网站目录的子模块: git init git submodule add https://github.com/dillonzq/LoveIt.git themes/LoveIt ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:2:2","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"2.3 基础配置 以下是 LoveIt 主题的基本配置: baseURL = \"http://example.org/\" # [en, zh-cn, fr, ...] 设置默认的语言 defaultContentLanguage = \"zh-cn\" # 网站语言, 仅在这里 CN 大写 languageCode = \"zh-CN\" # 是否包括中日韩文字 hasCJKLanguage = true # 网站标题 title = \"我的全新 Hugo 网站\" # 更改使用 Hugo 构建网站时使用的默认主题 theme = \"LoveIt\" [params] # LoveIt 主题版本 version = \"0.2.X\" [menu] [[menu.main]] identifier = \"posts\" # 你可以在名称 (允许 HTML 格式) 之前添加其他信息, 例如图标 pre = \"\" # 你可以在名称 (允许 HTML 格式) 之后添加其他信息, 例如图标 post = \"\" name = \"文章\" url = \"/posts/\" # 当你将鼠标悬停在此菜单链接上时, 将显示的标题 title = \"\" weight = 1 [[menu.main]] identifier = \"tags\" pre = \"\" post = \"\" name = \"标签\" url = \"/tags/\" title = \"\" weight = 2 [[menu.main]] identifier = \"categories\" pre = \"\" post = \"\" name = \"分类\" url = \"/categories/\" title = \"\" weight = 3 # Hugo 解析文档的配置 [markup] # 语法高亮设置 (https://gohugo.io/content-management/syntax-highlighting) [markup.highlight] # false 是必要的设置 (https://github.com/dillonzq/LoveIt/issues/158) noClasses = false 注意 在构建网站时, 你可以使用 --theme 选项设置主题. 但是, 我建议你修改配置文件 (config.toml) 将本主题设置为默认主题. ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:2:3","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"2.4 创建你的第一篇文章 以下是创建第一篇文章的方法: hugo new posts/first_post.md 通过添加一些示例内容并替换文件开头的标题, 你可以随意编辑文章. 注意 默认情况下, 所有文章和页面均作为草稿创建. 如果想要渲染这些页面, 请从元数据中删除属性 draft: true, 设置属性 draft: false 或者为 hugo 命令添加 -D/--buildDrafts 参数. ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:2:4","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"2.5 在本地启动网站 使用以下命令启动网站: hugo serve 去查看 http://localhost:1313. 基本配置下的预览基本配置下的预览 \" 基本配置下的预览 技巧 当你运行 hugo serve 时, 当文件内容更改时, 页面会随着更改自动刷新. 注意 由于本主题使用了 Hugo 中的 .Scratch 来实现一些特性, 非常建议你为 hugo server 命令添加 --disableFastRender 参数来实时预览你正在编辑的文章页面. hugo serve --disableFastRender ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:2:5","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"2.6 构建网站 当你准备好部署你的网站时, 运行以下命令: hugo 会生成一个 public 目录, 其中包含你网站的所有静态内容和资源. 现在可以将其部署在任何 Web 服务器上. 技巧 网站内容可以通过 Netlify 自动发布和托管 (了解有关通过 Netlify 进行 HUGO 自动化部署 的更多信息). 或者, 您可以使用 AWS Amplify, Github pages, Render 以及更多… ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:2:6","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"3 配置 ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:3:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"3.1 网站配置 除了 Hugo 全局配置 和 菜单配置 之外, LoveIt 主题还允许您在网站配置中定义以下参数 (这是一个示例 config.toml, 其内容为默认值). 请打开下面的代码块查看完整的示例配置 : [params] # LoveIt 主题版本 version = \"0.2.X\" # 网站描述 description = \"这是我的全新 Hugo 网站\" # 网站关键词 keywords = [\"Theme\", \"Hugo\"] # 网站默认主题样式 (\"light\", \"dark\", \"auto\") defaultTheme = \"auto\" # 公共 git 仓库路径,仅在 enableGitInfo 设为 true 时有效 gitRepo = \"\" # 哪种哈希函数用来 SRI, 为空时表示不使用 SRI # (\"sha256\", \"sha384\", \"sha512\", \"md5\") fingerprint = \"\" # 日期格式 dateFormat = \"2006-01-02\" # 网站图片, 用于 Open Graph 和 Twitter Cards images = [\"/logo.png\"] # 应用图标配置 [params.app] # 当添加到 iOS 主屏幕或者 Android 启动器时的标题, 覆盖默认标题 title = \"LoveIt\" # 是否隐藏网站图标资源链接 noFavicon = false # 更现代的 SVG 网站图标, 可替代旧的 .png 和 .ico 文件 svgFavicon = \"\" # Android 浏览器主题色 themeColor = \"#ffffff\" # Safari 图标颜色 iconColor = \"#5bbad5\" # Windows v8-10磁贴颜色 tileColor = \"#da532c\" # 搜索配置 [params.search] enable = true # 搜索引擎的类型 (\"lunr\", \"algolia\") type = \"lunr\" # 文章内容最长索引长度 contentLength = 4000 # 搜索框的占位提示语 placeholder = \"\" # 最大结果数目 maxResultLength = 10 # 结果内容片段长度 snippetLength = 50 # 搜索结果中高亮部分的 HTML 标签 highlightTag = \"em\" # 是否在搜索索引中使用基于 baseURL 的绝对路径 absoluteURL = false [params.search.algolia] index = \"\" appID = \"\" searchKey = \"\" # 页面头部导航栏配置 [params.header] # 桌面端导航栏模式 (\"fixed\", \"normal\", \"auto\") desktopMode = \"fixed\" # 移动端导航栏模式 (\"fixed\", \"normal\", \"auto\") mobileMode = \"auto\" # 页面头部导航栏标题配置 [params.header.title] # LOGO 的 URL logo = \"\" # 标题名称 name = \"\" # 你可以在名称 (允许 HTML 格式) 之前添加其他信息, 例如图标 pre = \"\" # 你可以在名称 (允许 HTML 格式) 之后添加其他信息, 例如图标 post = \"\" # 是否为标题显示打字机动画 typeit = false # 页面底部信息配置 [params.footer] enable = true # 自定义内容 (支持 HTML 格式) custom = '' # 是否显示 Hugo 和主题信息 hugo = true # 是否显示版权信息 copyright = true # 是否显示作者 author = true # 网站创立年份 since = 2019 # ICP 备案信息,仅在中国使用 (支持 HTML 格式) icp = \"\" # 许可协议信息 (支持 HTML 格式) license = '\u003ca rel=\"license external nofollow noopener noreffer\" href=\"https://creativecommons.org/licenses/by-nc/4.0/\" target=\"_blank\"\u003eCC BY-NC 4.0\u003c/a\u003e' # Section (所有文章) 页面配置 [params.section] # section 页面每页显示文章数量 paginate = 20 # 日期格式 (月和日) dateFormat = \"01-02\" # RSS 文章数目 rss = 10 # List (目录或标签) 页面配置 [params.list] # list 页面每页显示文章数量 paginate = 20 # 日期格式 (月和日) dateFormat = \"01-02\" # RSS 文章数目 rss = 10 # 主页配置 [params.home] # RSS 文章数目 rss = 10 # 主页个人信息 [params.home.profile] enable = true # Gravatar 邮箱,用于优先在主页显示的头像 gravatarEmail = \"\" # 主页显示头像的 URL avatarURL = \"/images/avatar.png\" # 主页显示的网站标题 (支持 HTML 格式) title = \"\" # 主页显示的网站副标题 subtitle = \"这是我的全新 Hugo 网站\" # 是否为副标题显示打字机动画 typeit = true # 是否显示社交账号 social = true # 免责声明 (支持 HTML 格式) disclaimer = \"\" # 主页文章列表 [params.home.posts] enable = true # 主页每页显示文章数量 paginate = 6 # 被 params.page 中的 hiddenFromHomePage 替代 # 当你没有在文章前置参数中设置 \"hiddenFromHomePage\" 时的默认行为 defaultHiddenFromHomePage = false # 作者的社交信息设置 [params.social] GitHub = \"xxxx\" Linkedin = \"\" Twitter = \"xxxx\" Instagram = \"xxxx\" Facebook = \"xxxx\" Telegram = \"xxxx\" Medium = \"\" Gitlab = \"\" Youtubelegacy = \"\" Youtubecustom = \"\" Youtubechannel = \"\" Tumblr = \"\" Quora = \"\" Keybase = \"\" Pinterest = \"\" Reddit = \"\" Codepen = \"\" FreeCodeCamp = \"\" Bitbucket = \"\" Stackoverflow = \"\" Weibo = \"\" Odnoklassniki = \"\" VK = \"\" Flickr = \"\" Xing = \"\" Snapchat = \"\" Soundcloud = \"\" Spotify = \"\" Bandcamp = \"\" Paypal = \"\" Fivehundredpx = \"\" Mix = \"\" Goodreads = \"\" Lastfm = \"\" Foursquare = \"\" Hackernews = \"\" Kickstarter = \"\" Patreon = \"\" Steam = \"\" Twitch = \"\" Strava = \"\" Skype = \"\" Whatsapp = \"\" Zhihu = \"\" Douban = \"\" Angellist = \"\" Slidershare = \"\" Jsfiddle = \"\" Deviantart = \"\" Behance = \"\" Dribbble = \"\" Wordpress = \"\" Vine = \"\" Googlescholar = \"\" Researchgate = \"\" Mastodon = \"\" Thingiverse = \"\" Devto = \"\" Gitea = \"\" XMPP = \"\" Matrix = \"\" Bilibili = \"\" Email = \"[email protected]\" RSS = true # # 文章页面配置 [params.page] # 是否在主页隐藏一篇文章 hiddenFromHomePage = false # 是否在搜索结果中隐藏一篇文章 hiddenFromSearch = false # 是否使用 twemoji twemoji = false # 是否使用 lightgallery lightgallery = false # 是否使用 ruby 扩展语法 ruby = true # 是否使用 fraction 扩展语法 fraction = true # 是否使用 fontawesome 扩展语法 fontawesome = true # 是否在文章页面显示原始 Markdown 文档链接 linkToMarkdown = true # 是否在 RSS 中显示全文内容 rssFullText = ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:3:1","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"3.2 网站图标, 浏览器配置, 网站清单 强烈建议你把: apple-touch-icon.png (180x180) favicon-32x32.png (32x32) favicon-16x16.png (16x16) mstile-150x150.png (150x150) android-chrome-192x192.png (192x192) android-chrome-512x512.png (512x512) 放在 /static 目录. 利用 https://realfavicongenerator.net/ 可以很容易地生成这些文件. 可以自定义 browserconfig.xml 和 site.webmanifest 文件来设置 theme-color 和 background-color. ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:3:2","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"3.3 自定义样式 注意 Hugo extended 版本对于自定义样式是必需的. 通过定义自定义 .scss 样式文件, LoveIt 主题支持可配置的样式. 包含自定义 .scss 样式文件的目录相对于 你的项目根目录 的路径为 assets/css. 在 assets/css/_override.scss 中, 你可以覆盖 themes/LoveIt/assets/css/_variables.scss 中的变量以自定义样式. 这是一个例子: @import url('https://fonts.googleapis.com/css?family=Fira+Mono:400,700\u0026display=swap\u0026subset=latin-ext'); $code-font-family: Fira Mono, Source Code Pro, Menlo, Consolas, Monaco, monospace; 在 assets/css/_custom.scss 中, 你可以添加一些 CSS 样式代码以自定义样式. ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:3:3","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"4 多语言和 i18n LoveIt 主题完全兼容 Hugo 的多语言模式, 并且支持在网页上切换语言. 语言切换语言切换 \" 语言切换 ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:4:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"4.1 兼容性 语言 Hugo 代码 HTML lang 属性 主题文档 Lunr.js 支持 英语 en en 简体中文 zh-cn zh-CN 法语 fr fr 波兰语 pl pl 巴西葡萄牙语 pt-br pt-BR 意大利语 it it 西班牙语 es es 德语 de de 塞尔维亚语 pl pl 俄语 ru ru 罗马尼亚语 ro ro 越南语 vi vi ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:4:1","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"4.2 基本配置 学习了 Hugo如何处理多语言网站 之后, 请在 站点配置 中定义你的网站语言. 例如, 一个支持英语, 中文和法语的网站配置: # [en, zh-cn, fr, pl, ...] 设置默认的语言 defaultContentLanguage = \"zh-cn\" [languages] [languages.en] weight = 1 title = \"My New Hugo Site\" languageCode = \"en\" languageName = \"English\" [[languages.en.menu.main]] identifier = \"posts\" pre = \"\" post = \"\" name = \"Posts\" url = \"/posts/\" title = \"\" weight = 1 [[languages.en.menu.main]] identifier = \"tags\" pre = \"\" post = \"\" name = \"Tags\" url = \"/tags/\" title = \"\" weight = 2 [[languages.en.menu.main]] identifier = \"categories\" pre = \"\" post = \"\" name = \"Categories\" url = \"/categories/\" title = \"\" weight = 3 [languages.zh-cn] weight = 2 title = \"我的全新 Hugo 网站\" # 网站语言, 仅在这里 CN 大写 languageCode = \"zh-CN\" languageName = \"简体中文\" # 是否包括中日韩文字 hasCJKLanguage = true [[languages.zh-cn.menu.main]] identifier = \"posts\" pre = \"\" post = \"\" name = \"文章\" url = \"/posts/\" title = \"\" weight = 1 [[languages.zh-cn.menu.main]] identifier = \"tags\" pre = \"\" post = \"\" name = \"标签\" url = \"/tags/\" title = \"\" weight = 2 [[languages.zh-cn.menu.main]] identifier = \"categories\" pre = \"\" post = \"\" name = \"分类\" url = \"/categories/\" title = \"\" weight = 3 [languages.fr] weight = 3 title = \"Mon nouveau site Hugo\" languageCode = \"fr\" languageName = \"Français\" [[languages.fr.menu.main]] identifier = \"posts\" pre = \"\" post = \"\" name = \"Postes\" url = \"/posts/\" title = \"\" weight = 1 [[languages.fr.menu.main]] identifier = \"tags\" pre = \"\" post = \"\" name = \"Balises\" url = \"/tags/\" title = \"\" weight = 2 [[languages.fr.menu.main]] identifier = \"categories\" pre = \"\" post = \"\" name = \"Catégories\" url = \"/categories/\" title = \"\" weight = 3 然后, 对于每个新页面, 将语言代码附加到文件名中. 单个文件 my-page.md 需要分为三个文件: 英语: my-page.en.md 中文: my-page.zh-cn.md 法语: my-page.fr.md 注意 请注意, 菜单中仅显示翻译的页面. 它不会替换为默认语言内容. 技巧 也可以使用 文章前置参数 来翻译网址. ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:4:2","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"4.3 修改默认的翻译字符串 翻译字符串用于在主题中使用的常见默认值. 目前提供一些语言的翻译, 但你可能自定义其他语言或覆盖默认值. 要覆盖默认值, 请在你项目的 i18n 目录 i18n/\u003clanguageCode\u003e.toml 中创建一个新文件,并从 themes/LoveIt/i18n/en.toml 中获得提示. 另外, 由于你的翻译可能会帮助到其他人, 请花点时间通过 创建一个 PR 来贡献主题翻译, 谢谢! ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:4:3","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"5 搜索 基于 Lunr.js 或 algolia, LoveIt 主题支持搜索功能. ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:5:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"5.1 输出配置 为了生成搜索功能所需要的 index.json, 请在你的 网站配置 中添加 JSON 输出文件类型到 outputs 部分的 home 字段中. [outputs] home = [\"HTML\", \"RSS\", \"JSON\"] ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:5:1","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"5.2 搜索配置 基于 Hugo 生成的 index.json 文件, 你可以激活搜索功能. 这是你的 网站配置 中的搜索部分: [params.search] enable = true # 搜索引擎的类型 (\"lunr\", \"algolia\") type = \"lunr\" # 文章内容最长索引长度 contentLength = 4000 # 搜索框的占位提示语 placeholder = \"\" # 最大结果数目 maxResultLength = 10 # 结果内容片段长度 snippetLength = 50 # 搜索结果中高亮部分的 HTML 标签 highlightTag = \"em\" # 是否在搜索索引中使用基于 baseURL 的绝对路径 absoluteURL = false [params.search.algolia] index = \"\" appID = \"\" searchKey = \"\" 怎样选择搜索引擎? 以下是两种搜索引擎的对比: lunr: 简单, 无需同步 index.json, 没有 contentLength 的限制, 但占用带宽大且性能低 (特别是中文需要一个较大的分词依赖库) algolia: 高性能并且占用带宽低, 但需要同步 index.json 且有 contentLength 的限制 文章内容被 h2 和 h3 HTML 标签切分来提高查询效果并且基本实现全文搜索. contentLength 用来限制 h2 和 h3 HTML 标签开头的内容部分的最大长度. 关于 algolia 的使用技巧 你需要上传 index.json 到 algolia 来激活搜索功能. 你可以使用浏览器来上传 index.json 文件但是一个自动化的脚本可能效果更好. Algolia Atomic 是一个不错的选择. 为了兼容 Hugo 的多语言模式, 你需要上传不同语言的 index.json 文件到对应的 algolia index, 例如 zh-cn/index.json 或 fr/index.json… ","date":"2020-03-06","objectID":"/the-lovelt-theme-guide-basics/:5:2","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题使用说明","uri":"/the-lovelt-theme-guide-basics/"},{"categories":["Theme"],"content":"了解如何在 LoveIt 主题中快速, 直观地创建和组织内容。 ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:0:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"1 内容组织 以下是一些方便你清晰管理和生成文章的目录结构建议: 保持博客文章存放在 content/posts 目录, 例如: content/posts/我的第一篇文章.md 保持简单的静态页面存放在 content 目录, 例如: content/about.md 本地资源组织 本地资源引用 有三种方法来引用图片和音乐等本地资源: 使用页面包中的页面资源. 你可以使用适用于 Resources.GetMatch 的值或者直接使用相对于当前页面目录的文件路径来引用页面资源. 将本地资源放在 assets 目录中, 默认路径是 /assets. 引用资源的文件路径是相对于 assets 目录的. 将本地资源放在 static 目录中, 默认路径是 /static. 引用资源的文件路径是相对于 static 目录的. 引用的优先级符合以上的顺序. 在这个主题中的很多地方可以使用上面的本地资源引用, 例如 链接, 图片, image shortcode, music shortcode 和前置参数中的部分参数. 页面资源或者 assets 目录中的图片处理会在未来的版本中得到支持. 非常酷的功能! ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:1:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"2 前置参数 Hugo 允许你在文章内容前面添加 yaml, toml 或者 json 格式的前置参数. 注意 不是所有的以下前置参数都必须在你的每篇文章中设置. 只有在文章的参数和你的 网站设置 中的 page 部分不一致时才有必要这么做. 这是一个前置参数例子: ---title:\"我的第一篇文章\"subtitle:\"\"date:2020-03-04T15:58:26+08:00lastmod:2020-03-04T15:58:26+08:00draft:trueauthor:\"\"authorLink:\"\"description:\"\"license:\"\"images:[]tags:[]categories:[]featuredImage:\"\"featuredImagePreview:\"\"hiddenFromHomePage:falsehiddenFromSearch:falsetwemoji:falselightgallery:trueruby:truefraction:truefontawesome:truelinkToMarkdown:truerssFullText:falsetoc:enable:trueauto:truecode:copy:true# ...math:enable:true# ...mapbox:accessToken:\"\"# ...share:enable:true# ...comment:enable:true# ...library:css:# someCSS = \"some.css\"# 位于 \"assets/\"# 或者# someCSS = \"https://cdn.example.com/some.css\"js:# someJS = \"some.js\"# 位于 \"assets/\"# 或者# someJS = \"https://cdn.example.com/some.js\"seo:images:[]# ...--- title: 文章标题. subtitle: 文章副标题. date: 这篇文章创建的日期时间. 它通常是从文章的前置参数中的 date 字段获取的, 但是也可以在 网站配置 中设置. lastmod: 上次修改内容的日期时间. draft: 如果设为 true, 除非 hugo 命令使用了 --buildDrafts/-D 参数, 这篇文章不会被渲染. author: 文章作者. authorLink: 文章作者的链接. description: 文章内容的描述. license: 这篇文章特殊的许可. images: 页面图片, 用于 Open Graph 和 Twitter Cards. tags: 文章的标签. categories: 文章所属的类别. featuredImage: 文章的特色图片. featuredImagePreview: 用在主页预览的文章特色图片. hiddenFromHomePage: 如果设为 true, 这篇文章将不会显示在主页上. hiddenFromSearch: 如果设为 true, 这篇文章将不会显示在搜索结果中. twemoji: 如果设为 true, 这篇文章会使用 twemoji. lightgallery: 如果设为 true, 文章中的图片将可以按照画廊形式呈现. ruby: 如果设为 true, 这篇文章会使用 上标注释扩展语法. fraction: 如果设为 true, 这篇文章会使用 分数扩展语法. fontawesome: 如果设为 true, 这篇文章会使用 Font Awesome 扩展语法. linkToMarkdown: 如果设为 true, 内容的页脚将显示指向原始 Markdown 文件的链接. rssFullText: 如果设为 true, 在 RSS 中将会显示全文内容. toc: 和 网站配置 中的 params.page.toc 部分相同. code: 和 网站配置 中的 params.page.code 部分相同. math: 和 网站配置 中的 params.page.math 部分相同. mapbox: 和 网站配置 中的 params.page.mapbox 部分相同. share: 和 网站配置 中的 params.page.share 部分相同. comment: 和 网站配置 中的 params.page.comment 部分相同. library: 和 网站配置 中的 params.page.library 部分相同. seo: 和 网站配置 中的 params.page.seo 部分相同. 技巧 featuredImage 和 featuredImagePreview 支持本地资源引用的完整用法. 如果带有在前置参数中设置了 name: featured-image 或 name: featured-image-preview 属性的页面资源, 没有必要在设置 featuredImage 或 featuredImagePreview: resources:- name:featured-imagesrc:featured-image.jpg- name:featured-image-previewsrc:featured-image-preview.jpg ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:2:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"3 内容摘要 LoveIt 主题使用内容摘要在主页中显示大致文章信息。Hugo 支持生成文章的摘要. 文章摘要预览文章摘要预览 \" 文章摘要预览 ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:3:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"自动摘要拆分 默认情况下, Hugo 自动将内容的前 70 个单词作为摘要. 你可以通过在 网站配置 中设置 summaryLength 来自定义摘要长度. 如果您要使用 CJK中文/日语/韩语 语言创建内容, 并且想使用 Hugo 的自动摘要拆分功能,请在 网站配置 中将 hasCJKLanguage 设置为 true. ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:3:1","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"手动摘要拆分 另外, 你也可以添加 \u003c!--more--\u003e 摘要分割符来拆分文章生成摘要. 摘要分隔符之前的内容将用作该文章的摘要. 注意 请小心输入\u003c!--more--\u003e ; 即全部为小写且没有空格. ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:3:2","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"前置参数摘要 你可能希望摘要不是文章开头的文字. 在这种情况下, 你可以在文章前置参数的 summary 变量中设置单独的摘要. ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:3:3","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"使用文章描述作为摘要 你可能希望将文章前置参数中的 description 变量的内容作为摘要. 你仍然需要在文章开头添加 \u003c!--more--\u003e 摘要分割符. 将摘要分隔符之前的内容保留为空. 然后 LoveIt 主题会将你的文章描述作为摘要. ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:3:4","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"摘要选择的优先级顺序 由于可以通过多种方式指定摘要, 因此了解顺序很有用. 如下: 如果文章中有 \u003c!--more--\u003e 摘要分隔符, 但分隔符之前没有内容, 则使用描述作为摘要. 如果文章中有 \u003c!--more--\u003e 摘要分隔符, 则将按照手动摘要拆分的方法获得摘要. 如果文章前置参数中有摘要变量, 那么将以该值作为摘要. 按照自动摘要拆分方法. 注意 不建议在摘要内容中包含富文本块元素, 这会导致渲染错误. 例如代码块, 图片, 表格等. ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:3:5","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"4 Markdown 基本语法 这部分内容在 Markdown 基本语法页面 中介绍. ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:4:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"5 Markdown 扩展语法 LoveIt 主题提供了一些扩展的语法便于你撰写文章. ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:5:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"Emoji 支持 这部分内容在 Emoji 支持页面 中介绍. ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:5:1","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"数学公式 LoveIt 基于 $ \\KaTeX $ 提供数学公式的支持. 在你的 网站配置 中的 [params.math] 下面设置属性 enable = true, 并在文章的前置参数中设置属性 math: true来启用数学公式的自动渲染. 技巧 有一份 $ \\KaTeX $ 中支持的 $ \\TeX $ 函数 清单. 公式块 默认的公式块分割符是 $$/$$ 和 \\\\[/\\\\]: $$ c = \\pm\\sqrt{a^2 + b^2} $$ \\\\[ f(x)=\\int_{-\\infty}^{\\infty} \\hat{f}(\\xi) e^{2 \\pi i \\xi x} d \\xi \\\\] 呈现的输出效果如下: $$ c = \\pm\\sqrt{a^2 + b^2} $$ \\[ f(x)=\\int_{-\\infty}^{\\infty} \\hat{f}(\\xi) e^{2 \\pi i \\xi x} d \\xi \\] 行内公式 默认的行内公式分割符是 $/$ 和 \\\\(/\\\\): $ c = \\pm\\sqrt{a^2 + b^2} $ 和 \\\\( f(x)=\\int_{-\\infty}^{\\infty} \\hat{f}(\\xi) e^{2 \\pi i \\xi x} d \\xi \\\\) 呈现的输出效果如下: $ c = \\pm\\sqrt{a^2 + b^2} $ 和 \\( f(x)=\\int_{-\\infty}^{\\infty} \\hat{f}(\\xi) e^{2 \\pi i \\xi x} d \\xi \\) 技巧 你可以在 网站配置 中自定义公式块和行内公式的分割符. Copy-tex Copy-tex 是一个 $ \\KaTeX $ 的插件. 通过这个扩展, 在选择并复制 $ \\KaTeX $ 渲染的公式时, 会将其 $ \\LaTeX $ 源代码复制到剪贴板. 在你的 网站配置 中的 [params.math] 下面设置属性 copyTex = true 来启用 Copy-tex. 选择并复制上一节中渲染的公式, 可以发现复制的内容为 LaTeX 源代码. mhchem mhchem 是一个 $ \\KaTeX $ 的插件. 通过这个扩展, 你可以在文章中轻松编写漂亮的化学方程式. 在你的 网站配置 中的 [params.math] 下面设置属性 mhchem = true 来启用 mhchem. $$ \\ce{CO2 + C -\u003e 2 CO} $$ $$ \\ce{Hg^2+ -\u003e[I-] HgI2 -\u003e[I-] [Hg^{II}I4]^2-} $$ 呈现的输出效果如下: $$ \\ce{CO2 + C -\u003e 2 CO} $$ $$ \\ce{Hg^2+ -\u003e[I-] HgI2 -\u003e[I-] [Hg^{II}I4]^2-} $$ ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:5:2","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"字符注音或者注释 LoveIt 主题支持一种 字符注音或者注释 Markdown 扩展语法: [Hugo]^(一个开源的静态网站生成工具) 呈现的输出效果如下: Hugo一个开源的静态网站生成工具 ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:5:3","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"分数 LoveIt 主题支持一种 分数 Markdown 扩展语法: [浅色]/[深色] [99]/[100] 呈现的输出效果如下: 浅色/深色 90/100 ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:5:4","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"Font Awesome LoveIt 主题使用 Font Awesome 作为图标库. 你同样可以在文章中轻松使用这些图标. 从 Font Awesome 网站 上获取所需的图标 class. 去露营啦! :(fas fa-campground fa-fw): 很快就回来. 真开心! :(far fa-grin-tears): 呈现的输出效果如下: 去露营啦! 很快就回来. 真开心! ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:5:5","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"转义字符 在某些特殊情况下 (编写这个主题文档时 ), 你的文章内容会与 Markdown 的基本或者扩展语法冲突, 并且无法避免. 转义字符语法可以帮助你渲染出想要的内容: {{??X}} -\u003e X 例如, 两个 : 会启用 emoji 语法. 但有时候这不是你想要的结果. 可以像这样使用转义字符语法: {{??:}}joy: 呈现的输出效果如下: :joy: 而不是 :joy: 技巧 这个方法可以间接解决一个还未解决的 Hugo 的 issue. 另一个例子是: [link{?}](#escape-character) 呈现的输出效果如下: [link](#escape-character) 而不是 link. ","date":"2020-03-05","objectID":"/the-lovelt-theme-guide-content/:5:6","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内容文档","uri":"/the-lovelt-theme-guide-content/"},{"categories":["Theme"],"content":"Hugo 提供了多个内置的 Shortcodes, 以方便作者保持 Markdown 内容的整洁.","date":"2020-03-04","objectID":"/the-lovelt-theme-guide-built-in-shortcodes/","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内置模块的使用文档","uri":"/the-lovelt-theme-guide-built-in-shortcodes/"},{"categories":["Theme"],"content":"Hugo 提供了多个内置的 Shortcodes, 以方便作者保持 Markdown 内容的整洁。 Hugo 使用 Markdown 为其简单的内容格式。但是, Markdown 在很多方面都无法很好地支持。你可以使用纯 HTML 来扩展可能性。 但这恰好是一个坏主意。大家使用 Markdown, 正是因为它即使不经过渲染也可以轻松阅读。应该尽可能避免使用 HTML 以保持内容简洁。 为了避免这种限制, Hugo 创建了 shortcodes。 shortcode 是一个简单代码段, 可以生成合理的 HTML 代码, 并且符合 Markdown 的设计哲学。 Hugo 附带了一组预定义的 shortcodes, 它们实现了一些非常常见的用法。 提供这些 shortcodes 是为了方便保持你的 Markdown 内容简洁。 ","date":"2020-03-04","objectID":"/the-lovelt-theme-guide-built-in-shortcodes/:0:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内置模块的使用文档","uri":"/the-lovelt-theme-guide-built-in-shortcodes/"},{"categories":["Theme"],"content":"图片 figure 的文档 一个 figure 示例: {{\u003c figure src=\"/blog/lighthouse.jpg\" title=\"Lighthouse (figure)\" \u003e}} 呈现的输出效果如下: Lighthouse (figure) 输出的 HTML 看起来像这样: \u003cfigure\u003e \u003cimg src=\"/images/lighthouse.jpg\"/\u003e \u003cfigcaption\u003e \u003ch4\u003eLighthouse (figure)\u003c/h4\u003e \u003c/figcaption\u003e \u003c/figure\u003e ","date":"2020-03-04","objectID":"/the-lovelt-theme-guide-built-in-shortcodes/:1:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内置模块的使用文档","uri":"/the-lovelt-theme-guide-built-in-shortcodes/"},{"categories":["Theme"],"content":"Gist gist 的文档 一个 gist 示例: {{\u003c gist spf13 7896402 \u003e}} 呈现的输出效果如下: 输出的 HTML 看起来像这样: \u003cscript type=\"application/javascript\" src=\"https://gist.github.com/spf13/7896402.js\"\u003e\u003c/script\u003e ","date":"2020-03-04","objectID":"/the-lovelt-theme-guide-built-in-shortcodes/:2:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内置模块的使用文档","uri":"/the-lovelt-theme-guide-built-in-shortcodes/"},{"categories":["Theme"],"content":"高亮 highlight 的文档 一个 highlight 示例: {{\u003c highlight html \u003e}} \u003csection id=\"main\"\u003e \u003cdiv\u003e \u003ch1 id=\"title\"\u003e{{ .Title }}\u003c/h1\u003e {{ range .Pages }} {{ .Render \"summary\"}} {{ end }} \u003c/div\u003e \u003c/section\u003e {{\u003c /highlight \u003e}} 呈现的输出效果如下: \u003csection id=\"main\"\u003e \u003cdiv\u003e \u003ch1 id=\"title\"\u003e{{ .Title }}\u003c/h1\u003e {{ range .Pages }} {{ .Render \"summary\"}} {{ end }} \u003c/div\u003e \u003c/section\u003e ","date":"2020-03-04","objectID":"/the-lovelt-theme-guide-built-in-shortcodes/:3:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内置模块的使用文档","uri":"/the-lovelt-theme-guide-built-in-shortcodes/"},{"categories":["Theme"],"content":"参数 param 的文档 一个 param 示例: {{\u003c param description \u003e}} 呈现的输出效果如下: Hugo 提供了多个内置的 Shortcodes, 以方便作者保持 Markdown 内容的整洁. ","date":"2020-03-04","objectID":"/the-lovelt-theme-guide-built-in-shortcodes/:4:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内置模块的使用文档","uri":"/the-lovelt-theme-guide-built-in-shortcodes/"},{"categories":["Theme"],"content":"5 ref 和 relref ref 和 relref 的文档 ","date":"2020-03-04","objectID":"/the-lovelt-theme-guide-built-in-shortcodes/:5:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内置模块的使用文档","uri":"/the-lovelt-theme-guide-built-in-shortcodes/"},{"categories":["Theme"],"content":"Tweet tweet 的文档 一个 tweet 示例: {{\u003c tweet 877500564405444608 \u003e}} 呈现的输出效果如下: Hugo 0.24 Released: Big archetype update + @Netlify _redirects etc. file supporthttps://t.co/X94FmYDEZJ #gohugo #golang @spf13 @bepsays — GoHugo.io (@GoHugoIO) June 21, 2017 ","date":"2020-03-04","objectID":"/the-lovelt-theme-guide-built-in-shortcodes/:6:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内置模块的使用文档","uri":"/the-lovelt-theme-guide-built-in-shortcodes/"},{"categories":["Theme"],"content":"视频 vimeo 的文档 一个 vimeo 示例: {{\u003c vimeo 146022717 \u003e}} 呈现的输出效果如下: ","date":"2020-03-04","objectID":"/the-lovelt-theme-guide-built-in-shortcodes/:7:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内置模块的使用文档","uri":"/the-lovelt-theme-guide-built-in-shortcodes/"},{"categories":["Theme"],"content":"Youtube youtube 的文档 一个 youtube 示例: {{\u003c youtube w7Ft2ymGmfc \u003e}} 呈现的输出效果如下: ","date":"2020-03-04","objectID":"/the-lovelt-theme-guide-built-in-shortcodes/:8:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题内置模块的使用文档","uri":"/the-lovelt-theme-guide-built-in-shortcodes/"},{"categories":["Theme"],"content":"LoveIt 主题在 Hugo 内置的 shortcode 的基础上提供多个扩展的 shortcode。 ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:0:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"1 style 注意 Hugo extended 版本对于 style shortcode 是必需的。 style shortcode 用来在你的文章中插入自定义样式。 style shortcode 有两个位置参数。 第一个参数是自定义样式的内容. 它支持 SASS 中的嵌套语法, 并且 \u0026 指代这个父元素。 第二个参数是包裹你要更改样式的内容的 HTML 标签, 默认值是 div。 一个 style 示例: {{\u003c style \"text-align:right\" \u003e}} This is a right-aligned paragraph. {{\u003c /style \u003e}} 呈现的输出效果如下: This is a right-aligned paragraph. ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:1:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"2 link link shortcode 是 Markdown 链接语法 的替代。 link shortcode 可以提供一些其它的功能并且可以在代码块中使用。 支持本地资源引用的完整用法。 link shortcode 有以下命名参数: href [必需] (第一个位置参数) 链接的目标。 content [可选] (第二个位置参数) 链接的内容, 默认值是 href 参数的值。 支持 Markdown 或者 HTML 格式. title [可选] (第三个位置参数) HTML a 标签 的 title 属性, 当悬停在链接上会显示的提示。 rel [可选] HTML a 标签 的 rel 补充属性。 class [可选] HTML a 标签 的 class 属性。 一个 link 示例: {{\u003c link \"https://assemble.io\" \u003e}} 或者 {{\u003c link href=\"https://assemble.io\" \u003e}} {{\u003c link \"mailto:[email protected]\" \u003e}} 或者 {{\u003c link href=\"mailto:[email protected]\" \u003e}} {{\u003c link \"https://assemble.io\" Assemble \u003e}} 或者 {{\u003c link href=\"https://assemble.io\" content=Assemble \u003e}} 呈现的输出效果如下: https://assemble.io mailto:[email protected] Assemble 一个带有标题的 link 示例: {{\u003c link \"https://github.com/upstage/\" Upstage \"Visit Upstage!\" \u003e}} 或者 {{\u003c link href=\"https://github.com/upstage/\" content=Upstage title=\"Visit Upstage!\" \u003e}} 呈现的输出效果如下 (将鼠标悬停在链接上,会有一行提示): Upstage ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:2:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"3 image image shortcode 是 figure shortcode 的替代。 image shortcode 可以充分利用 lazysizes 和 lightgallery.js 两个依赖库。 支持本地资源引用的完整用法。 image shortcode 有以下命名参数: src [必需] (第一个位置参数) 图片的 URL。 alt [可选] (第二个位置参数) 图片无法显示时的替代文本, 默认值是 src 参数的值。 支持 Markdown 或者 HTML 格式. caption [可选] (第三个位置参数) 图片标题。 支持 Markdown 或者 HTML 格式. title [可选] 当悬停在图片上会显示的提示。 class [可选] HTML figure 标签的 class 属性。 src_s [可选] 图片缩略图的 URL, 用在画廊模式中, 默认值是 src 参数的值。 src_l [可选] 高清图片的 URL, 用在画廊模式中, 默认值是 src 参数的值。 height [可选] 图片的 height 属性。 width [可选] 图片的 width 属性。 linked [可选] 图片是否需要被链接, 默认值是 true。 rel [可选] HTML a 标签 的 rel 补充属性, 仅在 linked 属性设置成 true 时有效。 一个 image 示例: {{\u003c image src=\"/blog/lighthouse.jpg\" caption=\"Lighthouse (`image`)\" src_s=\"/blog/lighthouse-small.jpg\" src_l=\"/blog/lighthouse-large.jpg\" \u003e}} 呈现的输出效果如下: Lighthouse (image)\" Lighthouse (image) ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:3:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"4 admonition admonition shortcode 支持 12 种 帮助你在页面中插入提示的横幅。 支持 Markdown 或者 HTML 格式. 注意 一个 注意 横幅 摘要 一个 摘要 横幅 信息 一个 信息 横幅 技巧 一个 技巧 横幅 成功 一个 成功 横幅 问题 一个 问题 横幅 警告 一个 警告 横幅 失败 一个 失败 横幅 危险 一个 危险 横幅 Bug 一个 Bug 横幅 示例 一个 示例 横幅 引用 一个 引用 横幅 admonition shortcode 有以下命名参数: type [必需] (第一个位置参数) admonition 横幅的类型, 默认值是 note。 title [可选] (第二个位置参数) admonition 横幅的标题, 默认值是 type 参数的值。 open [可选] (第三个位置参数) 横幅内容是否默认展开, 默认值是 true。 一个 admonition 示例: {{\u003c admonition type=tip title=\"This is a tip\" open=false \u003e}} 一个 **技巧** 横幅 {{\u003c /admonition \u003e}} 或者 {{\u003c admonition tip \"This is a tip\" false \u003e}} 一个 **技巧** 横幅 {{\u003c /admonition \u003e}} 呈现的输出效果如下: This is a tip 一个 技巧 横幅 ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:4:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"5 mermaid mermaid 是一个可以帮助你在文章中生成图表和流程图的库, 类似 Markdown 的语法。 只需将你的 mermaid 代码插入 mermaid shortcode 中即可。 ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:5:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"5.1 流程图 一个 流程图 mermaid 示例: {{\u003c mermaid \u003e}} graph LR; A[Hard edge] --\u003e|Link text| B(Round edge) B --\u003e C{Decision} C --\u003e|One| D[Result one] C --\u003e|Two| E[Result two] {{\u003c /mermaid \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:5:1","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"5.2 时序图 一个 时序图 mermaid 示例: {{\u003c mermaid \u003e}} sequenceDiagram participant Alice participant Bob Alice-\u003e\u003eJohn: Hello John, how are you? loop Healthcheck John-\u003eJohn: Fight against hypochondria end Note right of John: Rational thoughts \u003cbr/\u003eprevail... John--\u003eAlice: Great! John-\u003eBob: How about you? Bob--\u003eJohn: Jolly good! {{\u003c /mermaid \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:5:2","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"5.3 甘特图 一个 甘特图 mermaid 示例: {{\u003c mermaid \u003e}} gantt dateFormat YYYY-MM-DD title Adding GANTT diagram functionality to mermaid section A section Completed task :done, des1, 2014-01-06,2014-01-08 Active task :active, des2, 2014-01-09, 3d Future task : des3, after des2, 5d Future task2 : des4, after des3, 5d section Critical tasks Completed task in the critical line :crit, done, 2014-01-06,24h Implement parser and jison :crit, done, after des1, 2d Create tests for parser :crit, active, 3d Future task in critical line :crit, 5d Create tests for renderer :2d Add to mermaid :1d {{\u003c /mermaid \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:5:3","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"5.4 类图 一个 类图 mermaid 示例: {{\u003c mermaid \u003e}} classDiagram Class01 \u003c|-- AveryLongClass : Cool Class03 *-- Class04 Class05 o-- Class06 Class07 .. Class08 Class09 --\u003e C2 : Where am i? Class09 --* C3 Class09 --|\u003e Class07 Class07 : equals() Class07 : Object[] elementData Class01 : size() Class01 : int chimp Class01 : int gorilla Class08 \u003c--\u003e C2: Cool label {{\u003c /mermaid \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:5:4","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"5.5 状态图 一个 状态图 mermaid 示例: {{\u003c mermaid \u003e}} stateDiagram [*] --\u003e Still Still --\u003e [*] Still --\u003e Moving Moving --\u003e Still Moving --\u003e Crash Crash --\u003e [*] {{\u003c /mermaid \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:5:5","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"5.6 Git 图 一个 Git 图 mermaid 示例: {{\u003c mermaid \u003e}} gitGraph: options { \"nodeSpacing\": 100, \"nodeRadius\": 10 } end commit branch newbranch checkout newbranch commit commit checkout master commit commit merge newbranch {{\u003c /mermaid \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:5:6","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"5.7 饼图 一个 饼图 mermaid 示例: {{\u003c mermaid \u003e}} pie \"Dogs\" : 386 \"Cats\" : 85 \"Rats\" : 15 {{\u003c /mermaid \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:5:7","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"6 echarts ECharts 是一个帮助你生成交互式数据可视化的库. ECharts 提供了常规的 折线图, 柱状图, 散点图, 饼图, K线图, 用于统计的 盒形图, 用于地理数据可视化的 地图, 热力图, 线图, 用于关系数据可视化的 关系图, treemap, 旭日图, 多维数据可视化的 平行坐标, 还有用于 BI 的 漏斗图, 仪表盘, 并且支持图与图之间的混搭. 只需在 echarts shortcode 中以 JSON/YAML/TOML格式插入 ECharts 选项即可. 一个 JSON 格式的 echarts 示例: {{\u003c echarts \u003e}} { \"title\": { \"text\": \"折线统计图\", \"top\": \"2%\", \"left\": \"center\" }, \"tooltip\": { \"trigger\": \"axis\" }, \"legend\": { \"data\": [\"邮件营销\", \"联盟广告\", \"视频广告\", \"直接访问\", \"搜索引擎\"], \"top\": \"10%\" }, \"grid\": { \"left\": \"5%\", \"right\": \"5%\", \"bottom\": \"5%\", \"top\": \"20%\", \"containLabel\": true }, \"toolbox\": { \"feature\": { \"saveAsImage\": { \"title\": \"保存为图片\" } } }, \"xAxis\": { \"type\": \"category\", \"boundaryGap\": false, \"data\": [\"周一\", \"周二\", \"周三\", \"周四\", \"周五\", \"周六\", \"周日\"] }, \"yAxis\": { \"type\": \"value\" }, \"series\": [ { \"name\": \"邮件营销\", \"type\": \"line\", \"stack\": \"总量\", \"data\": [120, 132, 101, 134, 90, 230, 210] }, { \"name\": \"联盟广告\", \"type\": \"line\", \"stack\": \"总量\", \"data\": [220, 182, 191, 234, 290, 330, 310] }, { \"name\": \"视频广告\", \"type\": \"line\", \"stack\": \"总量\", \"data\": [150, 232, 201, 154, 190, 330, 410] }, { \"name\": \"直接访问\", \"type\": \"line\", \"stack\": \"总量\", \"data\": [320, 332, 301, 334, 390, 330, 320] }, { \"name\": \"搜索引擎\", \"type\": \"line\", \"stack\": \"总量\", \"data\": [820, 932, 901, 934, 1290, 1330, 1320] } ] } {{\u003c /echarts \u003e}} 一个 YAML 格式的 echarts 示例: {{\u003c echarts \u003e}}title:text:折线统计图top:2%left:centertooltip:trigger:axislegend:data:- 邮件营销- 联盟广告- 视频广告- 直接访问- 搜索引擎top:10%grid:left:5%right:5%bottom:5%top:20%containLabel:truetoolbox:feature:saveAsImage:title:保存为图片xAxis:type:categoryboundaryGap:falsedata:- 周一- 周二- 周三- 周四- 周五- 周六- 周日yAxis:type:valueseries:- name:邮件营销type:linestack:总量data:- 120- 132- 101- 134- 90- 230- 210- name:联盟广告type:linestack:总量data:- 220- 182- 191- 234- 290- 330- 310- name:视频广告type:linestack:总量data:- 150- 232- 201- 154- 190- 330- 410- name:直接访问type:linestack:总量data:- 320- 332- 301- 334- 390- 330- 320- name:搜索引擎type:linestack:总量data:- 820- 932- 901- 934- 1290- 1330- 1320{{\u003c /echarts \u003e}} 一个 TOML 格式的 echarts 示例: {{\u003c echarts \u003e}} [title] text = \"折线统计图\" top = \"2%\" left = \"center\" [tooltip] trigger = \"axis\" [legend] data = [ \"邮件营销\", \"联盟广告\", \"视频广告\", \"直接访问\", \"搜索引擎\" ] top = \"10%\" [grid] left = \"5%\" right = \"5%\" bottom = \"5%\" top = \"20%\" containLabel = true [toolbox] [toolbox.feature] [toolbox.feature.saveAsImage] title = \"保存为图片\" [xAxis] type = \"category\" boundaryGap = false data = [ \"周一\", \"周二\", \"周三\", \"周四\", \"周五\", \"周六\", \"周日\" ] [yAxis] type = \"value\" [[series]] name = \"邮件营销\" type = \"line\" stack = \"总量\" data = [ 120.0, 132.0, 101.0, 134.0, 90.0, 230.0, 210.0 ] [[series]] name = \"联盟广告\" type = \"line\" stack = \"总量\" data = [ 220.0, 182.0, 191.0, 234.0, 290.0, 330.0, 310.0 ] [[series]] name = \"视频广告\" type = \"line\" stack = \"总量\" data = [ 150.0, 232.0, 201.0, 154.0, 190.0, 330.0, 410.0 ] [[series]] name = \"直接访问\" type = \"line\" stack = \"总量\" data = [ 320.0, 332.0, 301.0, 334.0, 390.0, 330.0, 320.0 ] [[series]] name = \"搜索引擎\" type = \"line\" stack = \"总量\" data = [ 820.0, 932.0, 901.0, 934.0, 1290.0, 1330.0, 1320.0 ] {{\u003c /echarts \u003e}} 呈现的输出效果如下: echarts shortcode 还有以下命名参数: width [可选] (第一个位置参数) 数据可视化的宽度, 默认值是 100%. height [可选] (第二个位置参数) 数据可视化的高度, 默认值是 30rem. ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:6:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"7 mapbox Mapbox GL JS 是一个 JavaScript 库,它使用 WebGL, 以 vector tiles 和 Mapbox styles 为来源, 将它们渲染成互动式地图. mapbox shortcode 有以下命名参数来使用 Mapbox GL JS: lng [必需] (第一个位置参数) 地图初始中心点的经度, 以度为单位. lat [必需] (第二个位置参数) 地图初始中心点的纬度, 以度为单位. zoom [可选] (第三个位置参数) 地图的初始缩放级别, 默认值是 10. marked [可选] (第四个位置参数) 是否在地图的初始中心点添加图钉, 默认值是 true. light-style [可选] (第五个位置参数) 浅色主题的地图样式, 默认值是前置参数或者网站配置中设置的值. dark-style [可选] (第六个位置参数) 深色主题的地图样式, 默认值是前置参数或者网站配置中设置的值. navigation [可选] 是否添加 NavigationControl, 默认值是前置参数或者网站配置中设置的值. geolocate [可选] 是否添加 GeolocateControl, 默认值是前置参数或者网站配置中设置的值. scale [可选] 是否添加 ScaleControl, 默认值是前置参数或者网站配置中设置的值. fullscreen [可选] 是否添加 FullscreenControl, 默认值是前置参数或者网站配置中设置的值. width [可选] 地图的宽度, 默认值是 100%. height [可选] 地图的高度, 默认值是 20rem. 一个简单的 mapbox 示例: {{\u003c mapbox 121.485 31.233 12 \u003e}} 或者 {{\u003c mapbox lng=121.485 lat=31.233 zoom=12 \u003e}} 呈现的输出效果如下: 一个带有自定义样式的 mapbox 示例: {{\u003c mapbox -122.252 37.453 10 false \"mapbox://styles/mapbox/streets-zh-v1\" \u003e}} 或者 {{\u003c mapbox lng=-122.252 lat=37.453 zoom=10 marked=false light-style=\"mapbox://styles/mapbox/streets-zh-v1\" \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:7:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"8 music music shortcode 基于 APlayer 和 MetingJS 提供了一个内嵌的响应式音乐播放器. 有三种方式使用 music shortcode. ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:8:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"8.1 自定义音乐 URL 支持本地资源引用的完整用法. music shortcode 有以下命名参数来使用自定义音乐 URL: server [必需] 音乐的链接. type [可选] 音乐的名称. artist [可选] 音乐的创作者. cover [可选] 音乐的封面链接. 一个使用自定义音乐 URL 的 music 示例: {{\u003c music url=\"/music/MissMass.mp3\" name=MissMass artist=MissMass cover=\"/music/missmass.png\" \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:8:1","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"8.2 音乐平台 URL 的自动识别 music shortcode 有一个命名参数来使用音乐平台 URL 的自动识别: auto [必需]] (第一个位置参数) 用来自动识别的音乐平台 URL, 支持 netease, tencent 和 xiami 平台. 一个使用音乐平台 URL 的自动识别的 music 示例: {{\u003c music auto=\"https://music.163.com/#/playlist?id=60198\" \u003e}} 或者 {{\u003c music \"https://music.163.com/#/playlist?id=60198\" \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:8:2","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"8.3 自定义音乐平台, 类型和 ID music shortcode 有以下命名参数来使用自定义音乐平台: server [必需] (第一个位置参数) [netease, tencent, kugou, xiami, baidu] 音乐平台. type [必需] (第二个位置参数) [song, playlist, album, search, artist] 音乐类型. id [必需] (第三个位置参数) 歌曲 ID, 或者播放列表 ID, 或者专辑 ID, 或者搜索关键词, 或者创作者 ID. 一个使用自定义音乐平台的 music 示例: {{\u003c music server=\"netease\" type=\"song\" id=\"1868553\" \u003e}} 或者 {{\u003c music netease song 1868553 \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:8:3","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"8.4 其它参数 music shortcode 有一些可以应用于以上三种方式的其它命名参数: theme [可选] 音乐播放器的主题色, 默认值是 #448aff. fixed [可选] 是否开启固定模式, 默认值是 false. mini [可选] 是否开启迷你模式, 默认值是 false. autoplay [可选] 是否自动播放音乐, 默认值是 false. volume [可选] 第一次打开播放器时的默认音量, 会被保存在浏览器缓存中, 默认值是 0.7. mutex [可选] 是否自动暂停其它播放器, 默认值是 true. music shortcode 还有一些只适用于音乐列表方式的其它命名参数: loop [可选] [all, one, none] 音乐列表的循环模式, 默认值是 none. order [可选] [list, random] 音乐列表的播放顺序, 默认值是 list. list-folded [可选] 初次打开的时候音乐列表是否折叠, 默认值是 false. list-max-height [可选] 音乐列表的最大高度, 默认值是 340px. ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:8:4","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"9 bilibili bilibili shortcode 提供了一个内嵌的用来播放 bilibili 视频的响应式播放器. 如果视频只有一个部分, 则仅需要视频的 BV id, 例如: https://www.bilibili.com/video/BV1Sx411T7QQ 一个 bilibili 示例: {{\u003c bilibili BV1Sx411T7QQ \u003e}} 或者 {{\u003c bilibili id=BV1Sx411T7QQ \u003e}} 呈现的输出效果如下: 如果视频包含多个部分, 则除了视频的 BV id 之外, 还需要 p, 默认值为 1, 例如: https://www.bilibili.com/video/BV1TJ411C7An?p=3 一个带有 p 参数的 bilibili 示例: {{\u003c bilibili BV1TJ411C7An 3 \u003e}} 或者 {{\u003c bilibili id=BV1TJ411C7An p=3 \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:9:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"10 typeit typeit shortcode 基于 TypeIt 提供了打字动画. 只需将你需要打字动画的内容插入 typeit shortcode 中即可. ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:10:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"10.1 简单内容 允许使用 Markdown 格式的简单内容, 并且 不包含 富文本的块内容, 例如图像等等… 一个 typeit 示例: {{\u003c typeit \u003e}} 这一个带有基于 [TypeIt](https://typeitjs.com/) 的 **打字动画** 的 *段落*... {{\u003c /typeit \u003e}} 呈现的输出效果如下: 另外, 你也可以自定义 HTML 标签. 一个带有 h4 标签的 typeit 示例: {{\u003c typeit tag=h4 \u003e}} 这一个带有基于 [TypeIt](https://typeitjs.com/) 的 **打字动画** 的 *段落*... {{\u003c /typeit \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:10:1","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"10.2 代码内容 代码内容也是允许的, 并且通过使用参数 code 指定语言类型可以实习语法高亮. 一个带有 code 参数的 typeit 示例: {{\u003c typeit code=java \u003e}} public class HelloWorld { public static void main(String []args) { System.out.println(\"Hello World\"); } } {{\u003c /typeit \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:10:2","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"10.3 分组内容 默认情况下, 所有打字动画都是同时开始的. 但是有时你可能需要按顺序开始一组 typeit 内容的打字动画. 一组具有相同 group 参数值的 typeit 内容将按顺序开始打字动画. 一个带有 group 参数的 typeit 示例: {{\u003c typeit group=paragraph \u003e}} **首先**, 这个段落开始 {{\u003c /typeit \u003e}} {{\u003c typeit group=paragraph \u003e}} **然后**, 这个段落开始 {{\u003c /typeit \u003e}} 呈现的输出效果如下: ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:10:3","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Theme"],"content":"11 script script shortcode 用来在你的文章中插入 Javascript 脚本. 注意 脚本内容可以保证在所有的第三方库加载之后按顺序执行. 所以你可以自由地使用第三方库. 一个 script 示例: {{\u003c script \u003e}} console.log('Hello LoveIt!'); {{\u003c /script \u003e}} 你可以在开发者工具的控制台中看到输出. ","date":"2020-03-03","objectID":"/the-lovelt-theme-guide-built-extended-shortcodes/:11:0","tags":["Installation","Configuration"],"title":"(转) - Lovelt 主题拓展模块的使用文档","uri":"/the-lovelt-theme-guide-built-extended-shortcodes/"},{"categories":["Git"],"content":"本文中我不介绍如何创建 GitHub 仓库或如何使用 Git 终端进行代码的提交。相反,我将解释为什么每天使用 Git 和 GitHub 是如此重要,特别是对于那些正在学习编程的同学来说 Github 一点都不会陌生的,Github 上的开源代码是非常的丰富,我也从 GitHub 上学到很多。今天我将分享三个简单原则,以便让你成为使用 Git 和 GitHub 的大师。 如果你正在学习编程,那么你最重要的目标可能是终获得一份作为软件开发人员的工作。在这种情况下,答案很简单:学习 Git 和 GitHub 非常重要,因为99%可以雇用你的公司都会使用 Git 和 GitHub。因此,学习如何使用 Git 和 GitHub 可以让你更加受欢迎,并帮助你从更多开发人员中脱颖而出。高级开发人员并不是他们更了解给定语言的语法,而是他们有丰富的经验处理具有真实用户和业务目标的大型复杂项目。当你在学习编程时,很难获得这种体验。但是,获得实际经验的一种简单方法是使用实际项目中使用的工具和方法。Git 和 GitHub 就是其中的一个例子。 你可以做的其他事情是远程结对编程,为开源做贡献,以及为你的投资组合构建专业设计的网站。即使你同意掌握 Git 和 GitHub 将帮助你找到工作,你可能仍然想知道:“为什么 Git 和 Github 对公司如此重要?”简而言之,Git 允许团队以异步方式高效且有效地将代码贡献给同一个项目。这使得团队能够更好地协作,从而使他们能够解决更大,更复杂的问题。Git 是一个分布式版本控制系统,它还提供了还原更改,创建代码分支,解决合并冲突等的机制。这些是非常有用的功能,可以解决每个软件团队每天面临的特定和常见问题。而 Git 是当今的主导解决方案。 另一方面,GitHub 是 Git 之上的一个附加层,它为其他特定和常见问题提供解决方案,例如代码审查,拉取请求,问题管理/错误跟踪等。即使Git是大多数公司的首选版本控制解决方案,GitHub 也有一些强大的竞争对手,如 GitLab 和 Bitbucket。但是,如果您知道如何使用 GitHub,那么使用 GitLab 或 Bitbucket 将不会有任何问题。 现在你知道为什么掌握 Git 和 Github 非常重要,现在是时候告诉你三个简单的原则,以便在你仍在学习编码时轻松成为专业的 Git 和 Github 用户。 让我们简单地分解每个原则,以便了解你应该做什么以及为什么每个规则都很重要。 ","date":"2018-10-11","objectID":"/follow-these-rules-for-git/:0:0","tags":["Git","Github"],"title":"遵循这些简单的规则,你将成为 Git 和 GitHub 大师","uri":"/follow-these-rules-for-git/"},{"categories":["Git"],"content":"1. 为每个新项目创建一个Git仓库 这第一条规则很简单,但养成一个习惯非常重要。每次开始处理新事物 - 您的投资组合,学习项目,编码挑战解决方案等等 - 您应该创建一个新的 Git 存储库并将其推送到 GitHub。 拥有一个专用的 repo 是能够为你编写的每一行代码使用版本控制的第一步。使用版本控制是您加入公司并开始处理实际项目后的工作方式。尽早学习并养成习惯。 ","date":"2018-10-11","objectID":"/follow-these-rules-for-git/:1:0","tags":["Git","Github"],"title":"遵循这些简单的规则,你将成为 Git 和 GitHub 大师","uri":"/follow-these-rules-for-git/"},{"categories":["Git"],"content":"2. 为每个新功能创建一个分支 假设您正在开发您的投资组合,并且您想要构建一个新的“与我联系”部分/组件。为这个新功能创建一个专用分支,给它一个有意义的名称(例如,contact-me-section),并将所有代码提交给该特定分支。 ","date":"2018-10-11","objectID":"/follow-these-rules-for-git/:2:0","tags":["Git","Github"],"title":"遵循这些简单的规则,你将成为 Git 和 GitHub 大师","uri":"/follow-these-rules-for-git/"},{"categories":["Git"],"content":"3. 将分支代码合并到master 默认情况下,每个存储库都以 master 分支开头。您永远不应该将更改直接推送到主分支。相反,您应该使用如上所述的功能分支,并打开一个新的Pull请求以将功能分支代码与主分支代码合并。 在实际工作中,有人会在批准之前查看您的 Pull 请求并进行代码审查。GitHub 甚至会对您的代码运行自动化测试,并让您知道它是否存在问题。如果您的代码与主分支中的代码之间存在任何合并冲突,也会通知您。例如,如果另一个开发人员将更改推送到影响您也修改过的文件的主分支,则会发生这种情况。 在您的代码经过审核,测试和批准后,您的审核人员会批评您合并 Pull 请求,或者他们会直接合并您的请求。 如果你仍然感到困惑,那就慢慢开始并牢记三条规则。不要试着去思考“如何”做事情,并专注于“做什么”和“为什么”它现在很重要。 一旦“什么”和“为什么”清楚,你就可以弄清楚什么时候做事情。一旦你重复这个过程2-3次,它将变得非常简单和自然。 ","date":"2018-10-11","objectID":"/follow-these-rules-for-git/:3:0","tags":["Git","Github"],"title":"遵循这些简单的规则,你将成为 Git 和 GitHub 大师","uri":"/follow-these-rules-for-git/"},{"categories":["USB"],"content":"USB serial port是一个很好的方式,在紧急情况下是可以很好的利用这个方法进行系统扑救的。","date":"2018-08-14","objectID":"/connect-to-server-by-usb-serial-port/","tags":["树莓派","Serial"],"title":"使用 USB Serial Port连接树莓派系统","uri":"/connect-to-server-by-usb-serial-port/"},{"categories":["USB"],"content":"树莓派开发的硬件上连接的 WiFi 有问题时,导致不能通过正常的 SSH 方式连接进去,在实际操作过程中就遇到这个问题,针对这我们可以采用 UBS 串口直连的方式进入系统。 找到 USB serial 串口的端口:设备管理器–\u003e串口(COM 和 LPT)–\u003eUSB serial Port 根据找到的 USB 串口,使用 PUTTY serial 模式来连接终端 进入后在 putty 上需要敲一下“回车键”切换至 debug 界面,通过 help 获取 command 帮助: 输入 console 切换到登陆模式,此时输入账户密码就可以正常登入服务器了。 ","date":"2018-08-14","objectID":"/connect-to-server-by-usb-serial-port/:0:0","tags":["树莓派","Serial"],"title":"使用 USB Serial Port连接树莓派系统","uri":"/connect-to-server-by-usb-serial-port/"},{"categories":null,"content":"一日一钱,千日千钱,绳锯木断,水滴石穿;贵有恒,何必三更起五更眠,最无益,只怕一日曝十日寒;故谓滴水恒心也!","date":"2018-08-03","objectID":"/about/","tags":["me"],"title":"About Me","uri":"/about/"},{"categories":null,"content":"About Me\" About Me ","date":"2018-08-03","objectID":"/about/:0:0","tags":["me"],"title":"About Me","uri":"/about/"},{"categories":null,"content":"Introduction I’m Kalid. Currently working in Shenzhen, China. I’m an operation and maintenance engineer, Currently working at Code Zero. And my focus is on DevOps, cloud services, microservices architecture, security operations, SRE, and the familiar use of Shell, Dcoker, Kubernetes, Python, Golang, etc. ","date":"2018-08-03","objectID":"/about/:0:1","tags":["me"],"title":"About Me","uri":"/about/"},{"categories":null,"content":"Professional Certification The goal for the last two years is to obtain the following certificates. And start crazy exam mode, come on! Alibaba Cloud Certified Associate - DevOps Alibaba Cloud Certified Professional - Cloud Security Alibaba Cloud Certified Professional - Cloud Computing Alibaba Cloud Certified Expert - Cloud Architect Certified Kubernetes Administrator AWS Certified SysOps Administrator - Associate AWS Certified Solutions Architect – Associate AWS Certified Solutions Architect - Professional AWS Certified DevOps Engineer - Professional Microsoft Certified Azure Administrator Associate Microsoft Certified Azure Security Engineer Associate Microsoft Certified Azure DevOps Engineer Expert Microsoft Certified Azure Solutions Architect Expert System Architecture Designer Project Management Professional ","date":"2018-08-03","objectID":"/about/:0:2","tags":["me"],"title":"About Me","uri":"/about/"},{"categories":null,"content":"Career TenBoon Cisystem Code Zero Limited ","date":"2018-08-03","objectID":"/about/:0:3","tags":["me"],"title":"About Me","uri":"/about/"},{"categories":null,"content":"Community Activity Getting start with knative ,Participate in translation. China DevOps Community,Mainly responsible for the maintenance and content operation of the Chinese devops community website. Cloud Native Community ","date":"2018-08-03","objectID":"/about/:0:4","tags":["me"],"title":"About Me","uri":"/about/"},{"categories":null,"content":"Contact Email:[email protected] Twitter: @dishuihengxin Wechat: Please indicate your name and company when you add friends: Scan To Add FriendsMy QRcode \" Scan To Add Friends ","date":"2018-08-03","objectID":"/about/:0:5","tags":["me"],"title":"About Me","uri":"/about/"},{"categories":["Hugo"],"content":"Hugo 是一个用 Go 语言编写的快速而现代的静态网站生成器,简单易用,高效易扩展,轻量易部署,旨在使网站创建再次变得有趣。Hugo 仅需要一个二进制文件 hugo (或 hugo.exe )即可轻松用于本地调试和生成静态页面,Hugo 生成静态页面的效率是非常高的。 Hugo 自带 watch 的调试模式,会自动检测文件的更新而自动刷新页面,可以边写边浏览效果,不仅能提高写作的效率还能提高博文的质量。再加上 Hugo 是使用 Go 语言编写,各方面都很 nice,所以用 Hugo 来写静态网站是一件极其享受的事儿。 静态页面不需要像动态页面那样经常去查询数据库,而是直接将最终页面内容返回,使得访问速度体验非常流畅。同时便于搜索引擎索引,静态的页面对各大搜索引擎是十分友好的。抛弃数据库,减少复杂度,将最复杂的一步交给静态网站生成器,让我们可以更专注于写作。 使用 hugo 构建的网站,可以托管在任何的地方,可以放在自搭的服务器上,也可以放在 Github pages,S3,Azure,CloudFront 等等,不需要依赖于任何的数据库和其他编程语言。通常我们会选择托管在 Github Pages 上,可以自定义一个个性的域名,这就非常 nice 了! 安装 hugo 很简单,可以从 hugo 官方Github下载对应系统的最新的二进制文件( hugo 或 hugo.exe ),目前最新的版本是0.48,然后添加到电脑环境变量即可。 我们通过命令行来先学习一下hugo的基本指令: D:\\Hugo\\bin\u003ehugo help hugo is the main command, used to build your Hugo site. Hugo is a Fast and Flexible Static Site Generator built with love by spf13 and friends in Go. Complete documentation is available at http://gohugo.io/. Usage: hugo [flags] hugo [command] Available Commands: benchmark Benchmark Hugo by building a site a number of times. config Print the site configuration convert Convert your content to different formats env Print Hugo version and environment info gen A collection of several useful generators. help Help about any command import Import your site from others. list Listing out various types of content new Create new content for your site server A high performance webserver version Print the version number of Hugo Flags: -b, --baseURL string hostname (and path) to the root, e.g. http://spf13.com/ -D, --buildDrafts include content marked as draft -E, --buildExpired include expired content -F, --buildFuture include content with publishdate in the future --cacheDir string filesystem path to cache directory. Defaults: $TMPDIR/hugo_cache/ --canonifyURLs (deprecated) if true, all relative URLs will be canonicalized using baseURL --cleanDestinationDir remove files from destination not found in static directories --config string config file (default is path/config.yaml|json|toml) -c, --contentDir string filesystem path to content directory --debug debug output -d, --destination string filesystem path to write files to --disableKinds strings disable different kind of pages (home, RSS etc.) --enableGitInfo add Git revision, date and author info to the pages --forceSyncStatic copy all files when static is changed. --gc enable to run some cleanup tasks (remove unused cache files) after the build -h, --help help for hugo --i18n-warnings print missing translations --ignoreCache ignores the cache directory -l, --layoutDir string filesystem path to layout directory --log enable Logging --logFile string log File path (if set, logging enabled automatically) --minify minify any supported output format (HTML, XML etc.) --noChmod don't sync permission mode of files --noTimes don't sync modification time of files --pluralizeListTitles (deprecated) pluralize titles in lists using inflect (default true) --preserveTaxonomyNames (deprecated) preserve taxonomy names as written (\"Gérard Depardieu\" vs \"gerard-depardieu\") --quiet build in quiet mode --renderToMemory render to memory (only useful for benchmark testing) -s, --source string filesystem path to read files relative from --stepAnalysis display memory and timing of different steps of the program --templateMetrics display metrics about template executions --templateMetricsHints calculate some improvement hints when combined with --templateMetrics -t, --theme string theme to use (located in /themes/THEMENAME/) --themesDir string filesystem path to themes directory --uglyURLs (deprecated) if true, use /filename.html instead of /filename/ -v, --verbose verbose output --verboseLog verbose logging -w, --watch watch filesystem for changes and recreate as needed Additional help topics: hugo check Contains some verification checks Use `hugo [command] --help` for more information about a command. 好了,hugo 已经安装好了,下一篇将介绍一下基于 github pages 的快速创建一个个人博客。 ","date":"2018-03-26","objectID":"/hugo-install/:0:0","tags":["Hugo"],"title":"Windows 10 安装 hugo 的文档","uri":"/hugo-install/"}]