552 lines
40 KiB
HTML
552 lines
40 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>
|
||
Cosy 入门
|
||
</title>
|
||
<meta name="description" content="">
|
||
<meta name="keywords" content="">
|
||
<meta name="author" content="Mozzie">
|
||
<link rel="canonical" href="https://mozzie.cn/2023/10/21/Cosy%20%E5%85%A5%E9%97%A8/">
|
||
|
||
|
||
<link rel="icon" type="image/svg" href='data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 7h1a2 2 0 0 1 2 2v.5a.5.5 0 0 0 .5.5a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-.5.5a.5.5 0 0 0-.5.5v.5a2 2 0 0 1-2 2h-2"></path><path d="M8 7H6a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h1"></path><path d="M12 8l-2 4h3l-2 4"></path></g></svg>'>
|
||
|
||
|
||
|
||
|
||
<link rel="stylesheet" href="/css/2f1ea598.css">
|
||
|
||
<meta name="generator" content="Hexo 6.3.0"></head>
|
||
|
||
<body id="app">
|
||
<!-- 响应式布局按钮 -->
|
||
<a class="side-navigation btn-hover btn-hover-bg tip left" data-tip="Expand">
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24">
|
||
<g fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<rect x="4" y="4" width="16" height="16" rx="2"></rect>
|
||
<path d="M9 4v16"></path>
|
||
</g>
|
||
</svg>
|
||
</a>
|
||
<aside>
|
||
<div>
|
||
|
||
<link rel="stylesheet" href="/css/e01add4b.css">
|
||
|
||
|
||
<div class="home-bar">
|
||
<a href="/" class="tip" data-tip="Home">
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512">
|
||
<path
|
||
d="M172.2 226.8c-14.6-2.9-28.2 8.9-28.2 23.8V301c0 10.2 7.1 18.4 16.7 22c18.2 6.8 31.3 24.4 31.3 45c0 26.5-21.5 48-48 48s-48-21.5-48-48V120c0-13.3-10.7-24-24-24H24c-13.3 0-24 10.7-24 24v248c0 89.5 82.1 160.2 175 140.7c54.4-11.4 98.3-55.4 109.7-109.7c17.4-82.9-37-157.2-112.5-172.2zM209 0c-9.2-.5-17 6.8-17 16v31.6c0 8.5 6.6 15.5 15 15.9c129.4 7 233.4 112 240.9 241.5c.5 8.4 7.5 15 15.9 15h32.1c9.2 0 16.5-7.8 16-17C503.4 139.8 372.2 8.6 209 0zm.3 96c-9.3-.7-17.3 6.7-17.3 16.1v32.1c0 8.4 6.5 15.3 14.8 15.9c76.8 6.3 138 68.2 144.9 145.2c.8 8.3 7.6 14.7 15.9 14.7h32.2c9.3 0 16.8-8 16.1-17.3c-8.4-110.1-96.5-198.2-206.6-206.7z"
|
||
fill="currentColor"></path>
|
||
</svg>
|
||
<span>Mozzie</span>
|
||
</a>
|
||
<!-- 切换主题 -->
|
||
<a id="toggle-theme" class="tip left" data-tip="Switch Theme">
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512">
|
||
<path d="M256 118a22 22 0 0 1-22-22V48a22 22 0 0 1 44 0v48a22 22 0 0 1-22 22z" fill="currentColor"></path>
|
||
<path d="M256 486a22 22 0 0 1-22-22v-48a22 22 0 0 1 44 0v48a22 22 0 0 1-22 22z" fill="currentColor"></path>
|
||
<path
|
||
d="M369.14 164.86a22 22 0 0 1-15.56-37.55l33.94-33.94a22 22 0 0 1 31.11 31.11l-33.94 33.94a21.93 21.93 0 0 1-15.55 6.44z"
|
||
fill="currentColor"></path>
|
||
<path
|
||
d="M108.92 425.08a22 22 0 0 1-15.55-37.56l33.94-33.94a22 22 0 1 1 31.11 31.11l-33.94 33.94a21.94 21.94 0 0 1-15.56 6.45z"
|
||
fill="currentColor"></path>
|
||
<path d="M464 278h-48a22 22 0 0 1 0-44h48a22 22 0 0 1 0 44z" fill="currentColor"></path>
|
||
<path d="M96 278H48a22 22 0 0 1 0-44h48a22 22 0 0 1 0 44z" fill="currentColor"></path>
|
||
<path
|
||
d="M403.08 425.08a21.94 21.94 0 0 1-15.56-6.45l-33.94-33.94a22 22 0 0 1 31.11-31.11l33.94 33.94a22 22 0 0 1-15.55 37.56z"
|
||
fill="currentColor"></path>
|
||
<path
|
||
d="M142.86 164.86a21.89 21.89 0 0 1-15.55-6.44l-33.94-33.94a22 22 0 0 1 31.11-31.11l33.94 33.94a22 22 0 0 1-15.56 37.55z"
|
||
fill="currentColor"></path>
|
||
<path d="M256 358a102 102 0 1 1 102-102a102.12 102.12 0 0 1-102 102z" fill="currentColor"></path>
|
||
</svg>
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512">
|
||
<path
|
||
d="M264 480A232 232 0 0 1 32 248c0-94 54-178.28 137.61-214.67a16 16 0 0 1 21.06 21.06C181.07 76.43 176 104.66 176 136c0 110.28 89.72 200 200 200c31.34 0 59.57-5.07 81.61-14.67a16 16 0 0 1 21.06 21.06C442.28 426 358 480 264 480z"
|
||
fill="currentColor"></path>
|
||
</svg>
|
||
|
||
</a>
|
||
</div>
|
||
|
||
|
||
|
||
<script src="/js/1247bc3e.js"></script>
|
||
|
||
<!-- search -->
|
||
|
||
<link rel="stylesheet" href="/css/4c3d0e88.css">
|
||
|
||
<form class="search-group">
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 20 20">
|
||
<g fill="currentColor">
|
||
<path d="M8.5 3a5.5 5.5 0 0 1 4.383 8.823l4.147 4.147a.75.75 0 0 1-.976 1.133l-.084-.073l-4.147-4.147A5.5 5.5 0 1 1 8.5 3zm0 1.5a4 4 0 1 0 0 8a4 4 0 0 0 0-8z" fill="currentColor"></path>
|
||
</g>
|
||
</svg>
|
||
<span id="search-input">Search...</span>
|
||
<div class="short-key">
|
||
<kbd class="key-cap"><span>Ctrl K</span></kbd>
|
||
</div>
|
||
</form>
|
||
|
||
<script>
|
||
window.algolia = {
|
||
appId: "5DTW808BZ8",
|
||
SearchOnlyAPIKey: "27845b245efc8a2853cc0bdc7366ea26"
|
||
}
|
||
</script>
|
||
|
||
|
||
<script src="/js/07f44e09.js"></script>
|
||
|
||
<!-- navigation -->
|
||
|
||
<link rel="stylesheet" href="/css/3efc6cb5.css">
|
||
|
||
|
||
<section class="category-nav scrollbar-obtrusive">
|
||
<ul class="nav-items">
|
||
<li data-path="archives">
|
||
<a href="/archives">
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24">
|
||
<g fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M12 7v14"></path>
|
||
<path d="M9 18l3 3l3-3"></path>
|
||
<circle cx="12" cy="5" r="2"></circle>
|
||
</g>
|
||
</svg>
|
||
<div class="ellipsis">Timeline</div>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<p>Category</p>
|
||
<ul>
|
||
|
||
<li class="active">
|
||
<a href="/categories/Hexo/">
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 17v1a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-1"></path><path d="M8 16h8"></path><path d="M8.322 12.582l7.956.836"></path><path d="M8.787 9.168l7.826 1.664"></path><path d="M10.096 5.764l7.608 2.472"></path></g></svg>
|
||
<div class="ellipsis">
|
||
<span>
|
||
Hexo
|
||
</span>
|
||
</div>
|
||
</a>
|
||
</li>
|
||
|
||
<li class="">
|
||
<a href="/categories/Front-End/">
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 4l-2 14.5l-6 2l-6-2L4 4z"></path><path d="M7.5 8h3v8l-2-1"></path><path d="M16.5 8H14a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h1.423a.5.5 0 0 1 .495.57L15.5 15.5l-2 .5"></path></g></svg>
|
||
<div class="ellipsis">
|
||
<span>
|
||
Front-End
|
||
</span>
|
||
</div>
|
||
</a>
|
||
</li>
|
||
|
||
</ul>
|
||
</section>
|
||
|
||
|
||
<script src="/js/f8b20eb9.js"></script>
|
||
|
||
<!-- icp -->
|
||
|
||
<div class="icp">
|
||
<a target="_blank" rel="noopener" href="http://beian.miit.gov.cn/">苏ICP备19008833号-4</a>
|
||
</div>
|
||
|
||
</div>
|
||
</aside>
|
||
<main>
|
||
|
||
<link rel="stylesheet" href="/css/afbb98c2.css">
|
||
|
||
|
||
<div class="post-container">
|
||
<div class="content">
|
||
<header>
|
||
|
||
<link rel="stylesheet" href="/css/de5de8fb.css">
|
||
|
||
<nav class="breadcrumb">
|
||
<a href="/" class="home tip btn-hover right" data-tip="Home">
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512">
|
||
<path d="M172.2 226.8c-14.6-2.9-28.2 8.9-28.2 23.8V301c0 10.2 7.1 18.4 16.7 22c18.2 6.8 31.3 24.4 31.3 45c0 26.5-21.5 48-48 48s-48-21.5-48-48V120c0-13.3-10.7-24-24-24H24c-13.3 0-24 10.7-24 24v248c0 89.5 82.1 160.2 175 140.7c54.4-11.4 98.3-55.4 109.7-109.7c17.4-82.9-37-157.2-112.5-172.2zM209 0c-9.2-.5-17 6.8-17 16v31.6c0 8.5 6.6 15.5 15 15.9c129.4 7 233.4 112 240.9 241.5c.5 8.4 7.5 15 15.9 15h32.1c9.2 0 16.5-7.8 16-17C503.4 139.8 372.2 8.6 209 0zm.3 96c-9.3-.7-17.3 6.7-17.3 16.1v32.1c0 8.4 6.5 15.3 14.8 15.9c76.8 6.3 138 68.2 144.9 145.2c.8 8.3 7.6 14.7 15.9 14.7h32.2c9.3 0 16.8-8 16.1-17.3c-8.4-110.1-96.5-198.2-206.6-206.7z" fill="currentColor"></path>
|
||
</svg>
|
||
</a>
|
||
|
||
|
||
<em>
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 20 20">
|
||
<g fill="none">
|
||
<path d="M7.733 4.207a.75.75 0 0 1 1.06.026l5.001 5.25a.75.75 0 0 1 0 1.035l-5 5.25a.75.75 0 1 1-1.087-1.034L12.216 10l-4.51-4.734a.75.75 0 0 1 .027-1.06z" fill="currentColor"></path>
|
||
</g>
|
||
</svg>
|
||
</em>
|
||
<a href="/categories/Hexo/">
|
||
Hexo
|
||
</a>
|
||
|
||
|
||
|
||
<em>
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 20 20">
|
||
<g fill="none">
|
||
<path d="M7.733 4.207a.75.75 0 0 1 1.06.026l5.001 5.25a.75.75 0 0 1 0 1.035l-5 5.25a.75.75 0 1 1-1.087-1.034L12.216 10l-4.51-4.734a.75.75 0 0 1 .027-1.06z" fill="currentColor"></path>
|
||
</g>
|
||
</svg>
|
||
</em>
|
||
<span class="ellipsis">
|
||
Cosy 入门
|
||
</span>
|
||
|
||
</nav>
|
||
|
||
|
||
<script src="/js/31d6cfe0.js"></script>
|
||
|
||
</header>
|
||
<main class="scrollbar-obtrusive">
|
||
<div class="article-container">
|
||
<!-- 文章tags -->
|
||
|
||
<!-- 渲染文章内容 -->
|
||
<article><h1 id="Hexo-安装主题"><a href="#Hexo-安装主题" class="headerlink" title="Hexo 安装主题"></a>Hexo 安装主题</h1><p><code>Hexo</code> 主题的安装方式非常简单,只需将主题 <code>Hexo-theme-cosy</code> 复制目录的 <code>themes</code> 目录下,然后在 <code>Hexo</code> 的 <code>_config.yml</code> 中修改下主题配置即可</p>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token comment"># 找到 theme 配置项</span>
|
||
<span class="token key atrule">theme</span><span class="token punctuation">:</span> Hexo<span class="token punctuation">-</span>theme<span class="token punctuation">-</span>cosy<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||
|
||
<h2 id="获取-Cosy"><a href="#获取-Cosy" class="headerlink" title="获取 Cosy"></a>获取 Cosy</h2><ul>
|
||
<li>进入 <a target="_blank" rel="noopener" href="https://github.com/17px/hexo-theme-cosy/tree/main">Cosy 代码仓库</a>,了解最新的主题开发进度</li>
|
||
<li>在 <a target="_blank" rel="noopener" href="https://github.com/17px/hexo-theme-cosy/releases">发布页面</a> 下载 <code>hexo-theme-cosy.zip</code></li>
|
||
<li>解压至站点的 <code>themes</code> 目录下</li>
|
||
<li>在 Hexo 的 <code>_config.yml</code> 中启用</li>
|
||
</ul>
|
||
<h1 id="hexo配置"><a href="#hexo配置" class="headerlink" title="hexo配置"></a>hexo配置</h1><p>在 <code>Hexo</code> 的 <code>_config.yml</code> 中调整</p>
|
||
<h2 id="基础配置"><a href="#基础配置" class="headerlink" title="基础配置"></a>基础配置</h2><pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token comment"># 网页标题</span>
|
||
<span class="token key atrule">title</span><span class="token punctuation">:</span> 17px blog
|
||
<span class="token comment"># 侧边栏顶部显示</span>
|
||
<span class="token key atrule">subtitle</span><span class="token punctuation">:</span> <span class="token string">"Mozzie"</span>
|
||
<span class="token comment"># 用于SEO的html元描述</span>
|
||
<span class="token key atrule">description</span><span class="token punctuation">:</span> <span class="token string">""</span>
|
||
<span class="token comment"># 用于SEO的html关键字</span>
|
||
<span class="token key atrule">keywords</span><span class="token punctuation">:</span>
|
||
<span class="token comment"># 文章版权声明显示作者名称</span>
|
||
<span class="token key atrule">author</span><span class="token punctuation">:</span> Mozzie
|
||
|
||
<span class="token comment"># 在此处设置您的网站url</span>
|
||
<span class="token key atrule">url</span><span class="token punctuation">:</span> https<span class="token punctuation">:</span>//mozzie.cn<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<h2 id="语言"><a href="#语言" class="headerlink" title="语言"></a>语言</h2><p>你可以在 <code>hexo-theme-cosy/languages</code> 中找到不同的语言文件,如果想切换语言,在配置文件中,填入 <code>yml</code> 的文件名</p>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token key atrule">language</span><span class="token punctuation">:</span> en<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||
|
||
<h2 id="文章语法高亮"><a href="#文章语法高亮" class="headerlink" title="文章语法高亮"></a>文章语法高亮</h2><p>关闭hexo默认的highlight.js语法高亮</p>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token key atrule">highlight</span><span class="token punctuation">:</span>
|
||
<span class="token key atrule">enable</span><span class="token punctuation">:</span> <span class="token boolean important">false</span>
|
||
<span class="token key atrule">line_number</span><span class="token punctuation">:</span> <span class="token boolean important">true</span>
|
||
<span class="token key atrule">auto_detect</span><span class="token punctuation">:</span> <span class="token boolean important">false</span>
|
||
<span class="token key atrule">tab_replace</span><span class="token punctuation">:</span> <span class="token string">""</span>
|
||
<span class="token key atrule">wrap</span><span class="token punctuation">:</span> <span class="token boolean important">true</span>
|
||
<span class="token key atrule">hljs</span><span class="token punctuation">:</span> <span class="token boolean important">false</span>
|
||
|
||
<span class="token key atrule">prismjs</span><span class="token punctuation">:</span>
|
||
<span class="token key atrule">enable</span><span class="token punctuation">:</span> <span class="token boolean important">true</span>
|
||
<span class="token key atrule">preprocess</span><span class="token punctuation">:</span> <span class="token boolean important">true</span>
|
||
<span class="token key atrule">line_number</span><span class="token punctuation">:</span> <span class="token boolean important">true</span>
|
||
<span class="token key atrule">line_threshold</span><span class="token punctuation">:</span> <span class="token number">0</span>
|
||
<span class="token key atrule">tab_replace</span><span class="token punctuation">:</span> <span class="token string">""</span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<h1 id="Cosy-主题配置"><a href="#Cosy-主题配置" class="headerlink" title="Cosy 主题配置"></a>Cosy 主题配置</h1><p>下面的配置基于 <code>Hexo-theme-cosy</code> 下的 <code>_config.yml</code> </p>
|
||
<h2 id="文章分类图标"><a href="#文章分类图标" class="headerlink" title="文章分类图标"></a>文章分类图标</h2><p>按照顺序,依次设置 <code>svg</code> 图标,可以在 <a target="_blank" rel="noopener" href="https://www.xicons.org/">xicon</a> 方面的获取丰富的图标</p>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token key atrule">postCategoryIcons</span><span class="token punctuation">:</span>
|
||
<span class="token punctuation">-</span> <svg<span class="token punctuation">></span><span class="token punctuation">...</span></svg<span class="token punctuation">></span>
|
||
<span class="token punctuation">-</span> <svg<span class="token punctuation">></span><span class="token punctuation">...</span></svg<span class="token punctuation">></span>
|
||
<span class="token punctuation">-</span> <svg<span class="token punctuation">></span><span class="token punctuation">...</span></svg<span class="token punctuation">></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<h2 id="网站图标-favicon"><a href="#网站图标-favicon" class="headerlink" title="网站图标 favicon"></a>网站图标 favicon</h2><ul>
|
||
<li>支持 <code>svg</code></li>
|
||
<li>支持 <code>图片url</code>,如:<code>/img/favicon.png</code></li>
|
||
</ul>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token key atrule">favicon</span><span class="token punctuation">:</span> <span class="token string">''</span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||
|
||
<h2 id="ICP备案号"><a href="#ICP备案号" class="headerlink" title="ICP备案号"></a>ICP备案号</h2><p>😁 如不需要备案号,可直接删除</p>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token key atrule">icp</span><span class="token punctuation">:</span> 苏ICP备xxxxxxx号<span class="token punctuation">-</span>x<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||
|
||
<h2 id="首页底部文字"><a href="#首页底部文字" class="headerlink" title="首页底部文字"></a>首页底部文字</h2><p>😁 如不需要,可直接删除,或者改为 <code>false</code> </p>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token key atrule">motto</span><span class="token punctuation">:</span> <span class="token boolean important">false</span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||
|
||
<h2 id="文章版权申明"><a href="#文章版权申明" class="headerlink" title="文章版权申明"></a>文章版权申明</h2><p>默认开启,当 <code>enable: false</code>,默认关闭</p>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token key atrule">postCopyright</span><span class="token punctuation">:</span>
|
||
<span class="token key atrule">enable</span><span class="token punctuation">:</span> <span class="token boolean important">true</span>
|
||
<span class="token key atrule">license</span><span class="token punctuation">:</span> CC BY<span class="token punctuation">-</span>NC<span class="token punctuation">-</span>SA 4.0
|
||
<span class="token key atrule">license_url</span><span class="token punctuation">:</span> https<span class="token punctuation">:</span>//creativecommons.org/licenses/by<span class="token punctuation">-</span>nc<span class="token punctuation">-</span>sa/4.0/<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<h2 id="katex-数学公式"><a href="#katex-数学公式" class="headerlink" title="katex 数学公式"></a>katex 数学公式</h2><p>可自行配置 <code>cdn</code></p>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token key atrule">katex</span><span class="token punctuation">:</span>
|
||
<span class="token key atrule">enable</span><span class="token punctuation">:</span> <span class="token boolean important">true</span>
|
||
<span class="token key atrule">jsCdn</span><span class="token punctuation">:</span> //cdn.jsdelivr.net/npm/katex@0.13.18/dist/katex.min.js
|
||
<span class="token key atrule">cssCdn</span><span class="token punctuation">:</span> //cdn.jsdelivr.net/npm/katex@0.13.18/dist/katex.min.css<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<h2 id="mermaid-流程图"><a href="#mermaid-流程图" class="headerlink" title="mermaid 流程图"></a>mermaid 流程图</h2><p>在撰写时,请使用 <code>{% mermaid %}` 和 `{% endmermaid %}</code> 包裹</p>
|
||
<pre class="line-numbers language-markdown" data-language="markdown"><code class="language-markdown">{% mermaid %}
|
||
graph TD;
|
||
A --> B;
|
||
A --> C;
|
||
B --> D;
|
||
C --> D;
|
||
{% endmermaid %}<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<p>相应配置如下</p>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token key atrule">mermaid</span><span class="token punctuation">:</span>
|
||
<span class="token key atrule">enable</span><span class="token punctuation">:</span> <span class="token boolean important">true</span>
|
||
<span class="token key atrule">cdn</span><span class="token punctuation">:</span> //cdn.jsdelivr.net/npm/mermaid@10.4.0/dist/mermaid.min.js<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<h2 id="valine-文章评论"><a href="#valine-文章评论" class="headerlink" title="valine 文章评论"></a>valine 文章评论</h2><p>首先需要注册 <code>LeanCloud</code> 国际区用户,创建数据库</p>
|
||
<p>请根据相关地区法规,酌情</p>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token key atrule">valine</span><span class="token punctuation">:</span>
|
||
<span class="token key atrule">enable</span><span class="token punctuation">:</span> <span class="token boolean important">true</span>
|
||
<span class="token comment"># 替换</span>
|
||
<span class="token key atrule">appId</span><span class="token punctuation">:</span> appId
|
||
<span class="token comment"># 替换</span>
|
||
<span class="token key atrule">appKey</span><span class="token punctuation">:</span> appKey
|
||
<span class="token key atrule">avatar</span><span class="token punctuation">:</span> monsterid
|
||
<span class="token key atrule">cdn</span><span class="token punctuation">:</span> //unpkg.com/valine@latest/dist/Valine.min.js
|
||
<span class="token comment"># 替换</span>
|
||
<span class="token key atrule">serverURLs</span><span class="token punctuation">:</span> //xxxxxxxx.api.lncldglobal.com<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<h1 id="algolia搜索"><a href="#algolia搜索" class="headerlink" title="algolia搜索"></a>algolia搜索</h1><p>博客自带的本地搜索,基于前端开发,存在或多或少的问题,建议换成 <code>algolia</code>,免费账户 总共有 <code>10,000</code> 条记录,每月有 <code>100,000</code> 的操作数</p>
|
||
<h2 id="注册-amp-获取-Key"><a href="#注册-amp-获取-Key" class="headerlink" title="注册 & 获取 Key"></a>注册 & 获取 Key</h2><ol>
|
||
<li><p>创建一个新的 <code>Index</code>,例如 <code>hex-blog</code></p>
|
||
</li>
|
||
<li><p>复制并保存:</p>
|
||
</li>
|
||
</ol>
|
||
<ul>
|
||
<li>Application ID</li>
|
||
<li>Search-Only API Key</li>
|
||
<li>Admin API Key</li>
|
||
<li>Usage API Key</li>
|
||
</ul>
|
||
<p><a href="/img/algolia-api-keys.png">API Keys</a></p>
|
||
<ol start="3">
|
||
<li>替换配置</li>
|
||
</ol>
|
||
<p>在 <code>Hexo</code> 的 <code>_config.yml</code> 中加入</p>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token key atrule">algolia</span><span class="token punctuation">:</span>
|
||
<span class="token comment"># 替换</span>
|
||
<span class="token key atrule">appId</span><span class="token punctuation">:</span> Application ID
|
||
<span class="token comment"># 替换</span>
|
||
<span class="token key atrule">apiKey</span><span class="token punctuation">:</span> Usage API Key
|
||
<span class="token comment"># 请勿泄露,用于上报,替换</span>
|
||
<span class="token key atrule">adminApiKey</span><span class="token punctuation">:</span> Admin API Key
|
||
<span class="token comment"># 替换</span>
|
||
<span class="token key atrule">SearchOnlyAPIKey</span><span class="token punctuation">:</span> Search<span class="token punctuation">-</span>Only API Key
|
||
<span class="token key atrule">chunkSize</span><span class="token punctuation">:</span> <span class="token number">5000</span>
|
||
<span class="token comment"># 替换</span>
|
||
<span class="token key atrule">indexName</span><span class="token punctuation">:</span> hex<span class="token punctuation">-</span>blog
|
||
<span class="token key atrule">fields</span><span class="token punctuation">:</span>
|
||
<span class="token punctuation">-</span> content<span class="token punctuation">:</span>strip
|
||
<span class="token punctuation">-</span> categories
|
||
<span class="token punctuation">-</span> date
|
||
<span class="token punctuation">-</span> permalink
|
||
<span class="token punctuation">-</span> slug
|
||
<span class="token punctuation">-</span> tags
|
||
<span class="token punctuation">-</span> title<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<h2 id="安装-hexo-algoliasearch"><a href="#安装-hexo-algoliasearch" class="headerlink" title="安装 hexo-algoliasearch"></a>安装 hexo-algoliasearch</h2><p>这是 Hexo 博客帖子索引插件,自动化提交索引到 Algolia</p>
|
||
<blockquote>
|
||
<p>如出遇到问题,可阅读 <a target="_blank" rel="noopener" href="https://www.npmjs.com/package/hexo-algoliasearch">hexo-algoliasearch 仓库</a> 最新说明</p>
|
||
</blockquote>
|
||
<p>安装命令:</p>
|
||
<pre class="line-numbers language-bash" data-language="bash"><code class="language-bash"><span class="token function">npm</span> <span class="token function">install</span> hexo-algoliasearch <span class="token parameter variable">--save</span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||
|
||
<h2 id="使用-algolia"><a href="#使用-algolia" class="headerlink" title="使用 algolia"></a>使用 algolia</h2><p>在每次博客发布之前,进行索引上传的操作,命令通常如下</p>
|
||
<pre class="line-numbers language-bash" data-language="bash"><code class="language-bash">hexo clean
|
||
hexo generate
|
||
hexo algolia<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||
|
||
|
||
<h1 id="🇨🇳-和风天气-Widget"><a href="#🇨🇳-和风天气-Widget" class="headerlink" title="🇨🇳 和风天气 Widget"></a>🇨🇳 和风天气 Widget</h1><p>Cosy 主要针对国内用户,在首页集成了和风天气的卡片,通过 <a target="_blank" rel="noopener" href="https://dev.qweather.com/docs/start/">和风天气开发服务</a> 注册</p>
|
||
<p>注册完成后,在配置中填入你的 <code>appKey</code> 和 <code>cityCode(城市代码)</code></p>
|
||
<pre class="line-numbers language-yaml" data-language="yaml"><code class="language-yaml"><span class="token key atrule">weather</span><span class="token punctuation">:</span>
|
||
<span class="token key atrule">enable</span><span class="token punctuation">:</span> <span class="token boolean important">true</span>
|
||
<span class="token comment"># 替换</span>
|
||
<span class="token key atrule">cityCode</span><span class="token punctuation">:</span> cityCode
|
||
<span class="token key atrule">appKey</span><span class="token punctuation">:</span> appKey<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<p>其中 <code>cityCode</code> 可以在 <a target="_blank" rel="noopener" href="https://github.com/qwd/LocationList">官方的地区列表仓库</a> 中的 <code>China-City-List-latest.csv</code> 找到你所在城市的 <code>cityCode</code></p>
|
||
<h1 id="前置元数据"><a href="#前置元数据" class="headerlink" title="前置元数据"></a>前置元数据</h1><p>在 Hexo 的 Markdown 文件中,一个典型的 YAML 格式的 <code>Front Matter</code> 可能会是这样的:</p>
|
||
<pre class="line-numbers language-markdown" data-language="markdown"><code class="language-markdown"><span class="token front-matter-block"><span class="token punctuation">---</span>
|
||
<span class="token front-matter yaml language-yaml"><span class="token key atrule">title</span><span class="token punctuation">:</span> 我的文章标题
|
||
<span class="token key atrule">categories</span><span class="token punctuation">:</span>
|
||
<span class="token punctuation">-</span> javascript
|
||
<span class="token key atrule">tags</span><span class="token punctuation">:</span>
|
||
<span class="token punctuation">-</span> 编程
|
||
<span class="token punctuation">-</span> JavaScript</span>
|
||
<span class="token punctuation">---</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<h2 id="top"><a href="#top" class="headerlink" title="top"></a>top</h2><p>实现文章置顶的功能,给定一个数值,可以进行排序,设定了 <code>top</code> 元数据的文章,会在分类列表中,使用 📌 标记</p>
|
||
<p>例如有三篇文章:</p>
|
||
<ul>
|
||
<li>文章1</li>
|
||
</ul>
|
||
<pre class="line-numbers language-markdown" data-language="markdown"><code class="language-markdown"><span class="token front-matter-block"><span class="token punctuation">---</span>
|
||
<span class="token front-matter yaml language-yaml"><span class="token key atrule">title</span><span class="token punctuation">:</span> 文章1
|
||
<span class="token key atrule">top</span><span class="token punctuation">:</span> <span class="token number">0</span>
|
||
<span class="token key atrule">categories</span><span class="token punctuation">:</span>
|
||
<span class="token punctuation">-</span> javascript
|
||
<span class="token key atrule">tags</span><span class="token punctuation">:</span>
|
||
<span class="token punctuation">-</span> 编程
|
||
<span class="token punctuation">-</span> JavaScript</span>
|
||
<span class="token punctuation">---</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<ul>
|
||
<li>文章2</li>
|
||
</ul>
|
||
<pre class="line-numbers language-markdown" data-language="markdown"><code class="language-markdown"><span class="token front-matter-block"><span class="token punctuation">---</span>
|
||
<span class="token front-matter yaml language-yaml"><span class="token key atrule">title</span><span class="token punctuation">:</span> 文章2
|
||
<span class="token key atrule">top</span><span class="token punctuation">:</span> <span class="token number">1</span>
|
||
<span class="token key atrule">categories</span><span class="token punctuation">:</span>
|
||
<span class="token punctuation">-</span> javascript
|
||
<span class="token key atrule">tags</span><span class="token punctuation">:</span>
|
||
<span class="token punctuation">-</span> 编程
|
||
<span class="token punctuation">-</span> JavaScript</span>
|
||
<span class="token punctuation">---</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<ul>
|
||
<li>文章3</li>
|
||
</ul>
|
||
<pre class="line-numbers language-markdown" data-language="markdown"><code class="language-markdown"><span class="token front-matter-block"><span class="token punctuation">---</span>
|
||
<span class="token front-matter yaml language-yaml"><span class="token key atrule">title</span><span class="token punctuation">:</span> 文章3
|
||
<span class="token key atrule">categories</span><span class="token punctuation">:</span>
|
||
<span class="token punctuation">-</span> javascript
|
||
<span class="token key atrule">tags</span><span class="token punctuation">:</span>
|
||
<span class="token punctuation">-</span> 编程
|
||
<span class="token punctuation">-</span> JavaScript</span>
|
||
<span class="token punctuation">---</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
<p>那么在 <code>javascript</code> 分类下,排序的顺序依次为:<code>文章1 > 文章2 > 文章3</code></p>
|
||
<h2 id="status"><a href="#status" class="headerlink" title="status"></a>status</h2><p>用于区分文章的状态,同时利用文章分类列表的<code>筛选</code>,进行快速筛选,Cosy 主题内置了 4 种状态</p>
|
||
<ul>
|
||
<li>done:完成</li>
|
||
<li>doing:进行中</li>
|
||
<li>todo:待办</li>
|
||
<li>other:废弃</li>
|
||
</ul>
|
||
<p>例如:</p>
|
||
<pre class="line-numbers language-markdown" data-language="markdown"><code class="language-markdown"><span class="token front-matter-block"><span class="token punctuation">---</span>
|
||
<span class="token front-matter yaml language-yaml"><span class="token key atrule">title</span><span class="token punctuation">:</span> 文章1
|
||
<span class="token key atrule">categories</span><span class="token punctuation">:</span>
|
||
<span class="token punctuation">-</span> javascript
|
||
<span class="token key atrule">status</span><span class="token punctuation">:</span> done</span>
|
||
<span class="token punctuation">---</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||
|
||
|
||
|
||
</article>
|
||
|
||
|
||
<link rel="stylesheet" href="/css/ccbcde32.css">
|
||
|
||
|
||
<div class="copyright">
|
||
<a target="_blank" href="https://mozzie.cn/2023/10/21/Cosy%20%E5%85%A5%E9%97%A8/">
|
||
<span>Post Url:</span>
|
||
<span>https://mozzie.cn/2023/10/21/Cosy%20%E5%85%A5%E9%97%A8/</span>
|
||
</a>
|
||
<ul>
|
||
<li>
|
||
<span>Author</span>
|
||
<p> Mozzie</p>
|
||
</li>
|
||
<li>
|
||
<span>Published on</span>
|
||
<p>2023-10-21</p>
|
||
</li>
|
||
<li>
|
||
<span>License</span>
|
||
<p><a target="_blank" rel="noopener" href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a></p>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
|
||
|
||
<script src="/js/31d6cfe0.js"></script>
|
||
|
||
|
||
<!-- 评论 -->
|
||
<div id="vcomments"></div>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
<div class="meta-container">
|
||
<div class="toc-wrapper content-dialog">
|
||
<p class="catalog">
|
||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24">
|
||
<g fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M4 6h16"></path>
|
||
<path d="M4 12h16"></path>
|
||
<path d="M4 18h12"></path>
|
||
</g>
|
||
</svg>
|
||
<span>Catalog</span>
|
||
</p>
|
||
<!-- 文章toc -->
|
||
<ol class="toc"><li class="toc-item toc-level-1"><a class="toc-link" href="#Hexo-%E5%AE%89%E8%A3%85%E4%B8%BB%E9%A2%98"><span class="toc-number">1.</span> <span class="toc-text">Hexo 安装主题</span></a><ol class="toc-child"><li class="toc-item toc-level-2"><a class="toc-link" href="#%E8%8E%B7%E5%8F%96-Cosy"><span class="toc-number">1.1.</span> <span class="toc-text">获取 Cosy</span></a></li></ol></li><li class="toc-item toc-level-1"><a class="toc-link" href="#hexo%E9%85%8D%E7%BD%AE"><span class="toc-number">2.</span> <span class="toc-text">hexo配置</span></a><ol class="toc-child"><li class="toc-item toc-level-2"><a class="toc-link" href="#%E5%9F%BA%E7%A1%80%E9%85%8D%E7%BD%AE"><span class="toc-number">2.1.</span> <span class="toc-text">基础配置</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#%E8%AF%AD%E8%A8%80"><span class="toc-number">2.2.</span> <span class="toc-text">语言</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#%E6%96%87%E7%AB%A0%E8%AF%AD%E6%B3%95%E9%AB%98%E4%BA%AE"><span class="toc-number">2.3.</span> <span class="toc-text">文章语法高亮</span></a></li></ol></li><li class="toc-item toc-level-1"><a class="toc-link" href="#Cosy-%E4%B8%BB%E9%A2%98%E9%85%8D%E7%BD%AE"><span class="toc-number">3.</span> <span class="toc-text">Cosy 主题配置</span></a><ol class="toc-child"><li class="toc-item toc-level-2"><a class="toc-link" href="#%E6%96%87%E7%AB%A0%E5%88%86%E7%B1%BB%E5%9B%BE%E6%A0%87"><span class="toc-number">3.1.</span> <span class="toc-text">文章分类图标</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#%E7%BD%91%E7%AB%99%E5%9B%BE%E6%A0%87-favicon"><span class="toc-number">3.2.</span> <span class="toc-text">网站图标 favicon</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#ICP%E5%A4%87%E6%A1%88%E5%8F%B7"><span class="toc-number">3.3.</span> <span class="toc-text">ICP备案号</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#%E9%A6%96%E9%A1%B5%E5%BA%95%E9%83%A8%E6%96%87%E5%AD%97"><span class="toc-number">3.4.</span> <span class="toc-text">首页底部文字</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#%E6%96%87%E7%AB%A0%E7%89%88%E6%9D%83%E7%94%B3%E6%98%8E"><span class="toc-number">3.5.</span> <span class="toc-text">文章版权申明</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#katex-%E6%95%B0%E5%AD%A6%E5%85%AC%E5%BC%8F"><span class="toc-number">3.6.</span> <span class="toc-text">katex 数学公式</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#mermaid-%E6%B5%81%E7%A8%8B%E5%9B%BE"><span class="toc-number">3.7.</span> <span class="toc-text">mermaid 流程图</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#valine-%E6%96%87%E7%AB%A0%E8%AF%84%E8%AE%BA"><span class="toc-number">3.8.</span> <span class="toc-text">valine 文章评论</span></a></li></ol></li><li class="toc-item toc-level-1"><a class="toc-link" href="#algolia%E6%90%9C%E7%B4%A2"><span class="toc-number">4.</span> <span class="toc-text">algolia搜索</span></a><ol class="toc-child"><li class="toc-item toc-level-2"><a class="toc-link" href="#%E6%B3%A8%E5%86%8C-amp-%E8%8E%B7%E5%8F%96-Key"><span class="toc-number">4.1.</span> <span class="toc-text">注册 & 获取 Key</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#%E5%AE%89%E8%A3%85-hexo-algoliasearch"><span class="toc-number">4.2.</span> <span class="toc-text">安装 hexo-algoliasearch</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#%E4%BD%BF%E7%94%A8-algolia"><span class="toc-number">4.3.</span> <span class="toc-text">使用 algolia</span></a></li></ol></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%F0%9F%87%A8%F0%9F%87%B3-%E5%92%8C%E9%A3%8E%E5%A4%A9%E6%B0%94-Widget"><span class="toc-number">5.</span> <span class="toc-text">🇨🇳 和风天气 Widget</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%89%8D%E7%BD%AE%E5%85%83%E6%95%B0%E6%8D%AE"><span class="toc-number">6.</span> <span class="toc-text">前置元数据</span></a><ol class="toc-child"><li class="toc-item toc-level-2"><a class="toc-link" href="#top"><span class="toc-number">6.1.</span> <span class="toc-text">top</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#status"><span class="toc-number">6.2.</span> <span class="toc-text">status</span></a></li></ol></li></ol>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
window.katex = {
|
||
enable: "true",
|
||
jsCdn: "//cdn.jsdelivr.net/npm/katex@0.13.18/dist/katex.min.js",
|
||
cssCdn: "//cdn.jsdelivr.net/npm/katex@0.13.18/dist/katex.min.css"
|
||
}
|
||
window.mermaid = {
|
||
enable: "true",
|
||
cdn: "//cdn.jsdelivr.net/npm/mermaid@10.4.0/dist/mermaid.min.js",
|
||
}
|
||
window.valine = {
|
||
enable: "true",
|
||
appId: 'TisMit6uhflounFqAN3ZGjgq-MdYXbMMI',
|
||
appKey: 'CdjirjYdz07U5i62ElsJvXUh',
|
||
avatar: 'monsterid',
|
||
cdn: '//unpkg.com/valine@latest/dist/Valine.min.js',
|
||
serverURLs: '//tismit6u.api.lncldglobal.com'
|
||
};
|
||
</script>
|
||
|
||
|
||
<script src="/js/a02fa72b.js"></script>
|
||
|
||
</main>
|
||
</body>
|
||
<script>
|
||
window.i18n = {
|
||
"tip-collapse": "Collapse",
|
||
"tip-expand": "Expand",
|
||
"text-select": "select",
|
||
"text-move": "movement",
|
||
"text-esc": "close",
|
||
"tip-status-done": "Done",
|
||
"tip-status-doing": "In Progress",
|
||
"tip-status-todo": "Todo",
|
||
"tip-status-other": "Duplicate",
|
||
"tip-status-default": "Default",
|
||
"text-search": "Search..."
|
||
}
|
||
</script>
|
||
|
||
<script src="/js/85d1c72e.js"></script>
|
||
|
||
|
||
</html> |