mirror of
https://github.com/dillonzq/LoveIt.git
synced 2024-11-12 18:06:17 +01:00
chore: add more README and resoures folder
This commit is contained in:
Dillon
parent
69068c7cfc
commit
7aa65e7414
7 changed files with 93 additions and 29 deletions
2
.gitignore
vendored
2
.gitignore
vendored
|
|
@ -1,6 +1,6 @@
|
|||
# Hugo default output directory
|
||||
public
|
||||
resources
|
||||
/exampleSite/zh/resources
|
||||
|
||||
## OS Files
|
||||
# Windows
|
||||
|
|
|
|||
57
README.md
57
README.md
|
|
@ -2,43 +2,74 @@
|
|||
|
||||
[](https://app.netlify.com/sites/hugo-loveit-en/deploys)
|
||||
|
||||
[中文 README](README.zh.md) | [Demo Site](https://hugo-loveit-en.netlify.com)
|
||||
English README | [中文说明](README.zh.md)
|
||||
|
||||
**LoveIt** is a **clean**, **elegant** but **advanced** blog theme for [Hugo](https://gohugo.io/).
|
||||
|
||||
It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) and [KeepIt Theme](https://github.com/liuzc/LeaveIt/).
|
||||
|
||||
Since the three themes have a similar look, if you have questions about their differences,
|
||||
read [Why choose LoveIt](#why-choose-loveit) so that you can choose the one that works best for you.
|
||||
|
||||
|
||||
|
||||
## Demo
|
||||
## [Demo Site](https://hugo-loveit-en.netlify.com)
|
||||
|
||||
To see this theme in action, here is a live [demo site](https://hugo-loveit-en.netlify.com) which is rendered with **LoveIt** theme.
|
||||
|
||||
Websites using **LoveIt** theme:
|
||||
## Why choose LoveIt
|
||||
|
||||
* [Dillon](https://dillonzq.com)
|
||||
* Yours
|
||||
Compared to the original LeaveIt theme and the KeepIt theme, the LoveIt theme has the following modifications.
|
||||
|
||||
### Features
|
||||
* Fixed title bar
|
||||
* System native fonts
|
||||
* Home subtitles typewriter effect
|
||||
* A new list of home posts, compatible with the latest version of Hugo
|
||||
* Replace all theme icons with [Font Awesome](https://fontawesome.com/)
|
||||
* A lot of style detail adjustments, including color, font size, margins, code preview style
|
||||
* More readable dark mode
|
||||
* Some beautiful CSS animations
|
||||
* Easy-to-use and self-expanding article catalog, while adapting to the mobile side
|
||||
* More suitable as a blog theme, the gallery function has been removed, but the image is lazy loaded to improve performance
|
||||
* Extended markdown syntax for [Font Awesome](https://fontawesome.com/) icons
|
||||
* Math formula support by [Katex](https://katex.org/)
|
||||
* Diagram syntax shortcode support by [mermaid](https://github.com/knsv/mermaid)
|
||||
* Embedded music player support by [APlayer](https://github.com/MoePlayer/APlayer) and [MetingJS](https://github.com/metowolf/MetingJS)
|
||||
* Bilibili player support
|
||||
* Kinds of admonitions shortcode support
|
||||
* Custom align and float style shortcodes support
|
||||
* CDN for all third-party libraries support
|
||||
|
||||
#### Performance and SEO
|
||||
In short,
|
||||
if you prefer the design language and freedom of the LoveIt theme,
|
||||
if you want to use the extended Font Awesome icons conveniently,
|
||||
if you want to embed math formulas, flowcharts, music or Bilibili videos in your posts,
|
||||
the LoveIt theme may be more suitable for you.
|
||||
|
||||
I hope you will LoveIt ❤️!
|
||||
|
||||
## Features
|
||||
|
||||
### Performance and SEO
|
||||
|
||||
* Optimized for performance: 99/100 on mobile and 100/100 on desktop in [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights)
|
||||
* Optimized SEO performance with a correct SEO SCHEMA based on JSON-LD
|
||||
* [Google Analytics](https://analytics.google.com/analytics) support
|
||||
* Search engine verification support (Google, Bind, Yandex and Baidu)
|
||||
* CDN support
|
||||
* CDN for all third-party libraries support
|
||||
* Automatically converted images with Lazy Load by [lazysizes](https://github.com/aFarkas/lazysizes)
|
||||
|
||||
#### Appearance and Layout
|
||||
### Appearance and Layout
|
||||
|
||||
* Desktops/Mobiles Responsive layout
|
||||
* Dark/Light Mode
|
||||
* A More coerent style beetwen page and sections
|
||||
* Pagination support
|
||||
* Easy-to-use and self-expanding article catalog, while adapting to the mobile side
|
||||
* Multilanguage support and I18N ready
|
||||
* Beautiful CSS animation
|
||||
|
||||
#### Social and Comment Systems
|
||||
### Social and Comment Systems
|
||||
|
||||
* Gravatar support by [Gravatar](https://gravatar.com)
|
||||
* Local Avatar support
|
||||
|
|
@ -48,7 +79,7 @@ Websites using **LoveIt** theme:
|
|||
* Gitalk comment system support by [Gitalk](https://github.com/gitalk/gitalk)
|
||||
* Valine comment system support by [Valine](https://valine.js.org/)
|
||||
|
||||
#### Extended Features
|
||||
### Extended Features
|
||||
|
||||
* Automatically highlighting code by chroma in Hugo
|
||||
* Extended markdown syntax for [Font Awesome](https://fontawesome.com/) icons
|
||||
|
|
@ -140,7 +171,7 @@ Because some features are only in production mode, so you need to add a `product
|
|||
* You can click the circle icon to toggle dark-light mode. In the desktop version the circle icon is to the right and in the mobile version is positioned to the left, close to the site title.
|
||||
* If you want to make your own theme toggle-able element, you can create an element with a class `.theme-switch`. See [here](https://github.com/dillonzq/LoveIt/blob/master/assets/js/blog.js#L14)
|
||||
|
||||
## Home Post model
|
||||
### Home Post model
|
||||
|
||||
If you want to show posts on index instead of a personal profile, just open `config.toml`, add the following line:
|
||||
|
||||
|
|
@ -149,7 +180,7 @@ If you want to show posts on index instead of a personal profile, just open `con
|
|||
home_mode = "post"
|
||||
```
|
||||
|
||||
## Add logo and cover for SEO
|
||||
### Add logo and cover for SEO
|
||||
|
||||
Add a logo image (127x40) and a cover image (800x600) in the `static` directory.
|
||||
|
||||
|
|
|
|||
53
README.zh.md
53
README.zh.md
|
|
@ -2,43 +2,70 @@
|
|||
|
||||
[](https://app.netlify.com/sites/hugo-loveit-zh/deploys)
|
||||
|
||||
[English README](README.md) | [预览网站](https://hugo-loveit-zh.netlify.com)
|
||||
[English README](README.md) | 中文说明
|
||||
|
||||
[LoveIt](https://github.com/dillonzq/LoveIt) 是一个**简洁**、**优雅**且**高效**的 [Hugo](https://gohugo.io/) 博客主题。
|
||||
|
||||
它的原型基于 [LeaveIt 主题](https://github.com/liuzc/LeaveIt/) 和 [KeepIt 主题](https://github.com/liuzc/LeaveIt/)。
|
||||
|
||||
由于三个主题外观的相似性，如果你对于它们的不同之处有疑问，请阅读 [为什么选择 LoveIt](#为什么选择-LoveIt)，以便你能选择最适合你的一个。
|
||||
|
||||
|
||||
|
||||
## 主题预览
|
||||
## 主题[预览](https://hugo-loveit-zh.netlify.com)
|
||||
|
||||
为了直观地浏览主题特性，这里有一个基于 **LoveIt** 主题渲染的 [预览网站](https://hugo-loveit-zh.netlify.com)。
|
||||
|
||||
使用 **LoveIt** 主题的网站：
|
||||
## 为什么选择 LoveIt
|
||||
|
||||
* [Dillon](https://dillonzq.com)
|
||||
* 你的网站
|
||||
相较于 LeaveIt 主题 和 KeepIt 主题，LoveIt 主题主要有以下修改
|
||||
|
||||
### 特性
|
||||
* 固定的标题栏
|
||||
* 系统原生字体
|
||||
* 主页副标题的打字机效果
|
||||
* 焕然一新的主页文章列表，已经兼容最新版 Hugo
|
||||
* 所有主题图标替换为 [Font Awesome](https://fontawesome.com/)
|
||||
* 大量的样式细节调整，包括颜色、字体大小、边距、代码预览样式
|
||||
* 可读性更强的暗黑模式
|
||||
* 一些美观的 CSS 动画
|
||||
* 易用和自动展开的文章目录，同时适配移动端
|
||||
* 为了更适合作为博客主题，去除了画廊功能，但保留了图片懒加载以提高性能
|
||||
* 使用 [Font Awesome](https://fontawesome.com/) 图标的扩展 Markdown 语法
|
||||
* 支持基于 [Katex](https://katex.org/) 的数学公式
|
||||
* 支持基于 [mermaid](https://github.com/knsv/mermaid) 的图表和流程图生成功能
|
||||
* 支持基于 [APlayer](https://github.com/MoePlayer/APlayer) 和 [MetingJS](https://github.com/metowolf/MetingJS) 的内嵌音乐播放器
|
||||
* 支持内嵌 Bilibili 视频
|
||||
* 支持多种提醒样式的 shortcode
|
||||
* 支持自定义对齐和浮动方式的 shortcode
|
||||
* 支持所有第三方库的 CDN
|
||||
* 更加丰富的自定义设置
|
||||
|
||||
#### 性能和 SEO
|
||||
所以，如果你更偏好 LoveIt 主题的设计语言和自由度，如果你想便捷地使用扩展的 Font Awesome 图标，如果你想在文章内嵌数学公式、流程图、音乐或是 Bilibili 视频，
|
||||
那么，LoveIt 主题可能是更适合你。
|
||||
希望你会 LoveIt ❤️!
|
||||
|
||||
## 特性
|
||||
|
||||
### 性能和 SEO
|
||||
|
||||
* 性能优化：在 [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights) 中， 99/100 的移动设备得分和 100/100 的桌面设备得分
|
||||
* 使用基于 JSON-LD 格式 的 SEO SCHEMA 文件进行 SEO 优化
|
||||
* 支持 [Google Analytics](https://analytics.google.com/analytics)
|
||||
* 支持搜索引擎的网站验证 (Google, Bind, Yandex and Baidu)
|
||||
* 支持 CDN
|
||||
* 支持所有第三方库的 CDN
|
||||
* 基于 [lazysizes](https://github.com/aFarkas/lazysizes) 自动转换图片为懒加载
|
||||
|
||||
#### 外观和布局
|
||||
### 外观和布局
|
||||
|
||||
* 桌面设备/移动设备 响应式布局
|
||||
* 暗黑/明亮 模式
|
||||
* 页面和列表保持一致的视觉样式
|
||||
* 支持分页
|
||||
* 易用和自动展开的文章目录，同时适配移动端
|
||||
* 支持多语言和国际化
|
||||
* 美观的 CSS 动画
|
||||
|
||||
#### 社交和评论系统
|
||||
### 社交和评论系统
|
||||
|
||||
* 支持 [Gravatar](https://gravatar.com) 头像
|
||||
* 支持本地头像
|
||||
|
|
@ -48,7 +75,7 @@
|
|||
* 支持 [Gitalk](https://github.com/gitalk/gitalk) 评论系统
|
||||
* 支持 [Valine](https://valine.js.org/) 评论系统
|
||||
|
||||
#### 扩展功能
|
||||
### 扩展功能
|
||||
|
||||
* 基于 Hugo 使用的 chroma 进行代码高亮
|
||||
* 使用 [Font Awesome](https://fontawesome.com/) 图标的扩展 Markdown 语法
|
||||
|
|
@ -139,7 +166,7 @@
|
|||
* 你可以点击圆形图标来切换网站 暗黑-明亮 模式。桌面模式下圆形图标在网页右上角，移动设备模式下在网站左上角标题旁边
|
||||
* 如果你想自定义切换网站 暗黑-明亮 模式的元素，可以使用一个 class 包含 `.theme-switch` 的元素，详见[此处](https://github.com/dillonzq/LoveIt/blob/master/assets/js/blog.js#L14)
|
||||
|
||||
## 主页预览文章模式
|
||||
### 主页预览文章模式
|
||||
|
||||
如果你想在主页显示文章而不仅仅是个人信息，请打开配置文件 `config.toml`，并增加下面一行：
|
||||
|
||||
|
|
@ -148,7 +175,7 @@
|
|||
home_mode = "post"
|
||||
```
|
||||
|
||||
## 增加网站 logo 和封面用于 SEO 优化
|
||||
### 增加网站 logo 和封面用于 SEO 优化
|
||||
|
||||
增加一个 logo 图片 (127x40) 和一个封面图片 (800x600) 在 `static` 目录。
|
||||
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) a
|
|||
* :(fab fa-searchengin): Optimized SEO performance with a correct SEO SCHEMA based on JSON-LD
|
||||
* :(fab fa-google): [Google Analytics](https://analytics.google.com/analytics) support
|
||||
* :(fas fa-search): Search engine verification support (Google, Bind, Yandex and Baidu)
|
||||
* :(fas fa-tachometer-alt): CDN support
|
||||
* :(fas fa-tachometer-alt): CDN for all third-party libraries support
|
||||
* :(far fa-images): Automatically converted images with Lazy Load by [lazysizes](https://github.com/aFarkas/lazysizes)
|
||||
|
||||
#### Appearance and Layout
|
||||
|
|
@ -27,7 +27,9 @@ It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) a
|
|||
* :(fas fa-moon): / :(fas fa-sun): Mode
|
||||
* :(fas fa-layer-group): A More coerent style beetwen page and sections
|
||||
* :(fas fa-ellipsis-h): Pagination support
|
||||
* :(far fa-list-alt): Easy-to-use and self-expanding article catalog, while adapting to the mobile side
|
||||
* :(fas fa-language): Multilanguage support and I18N ready
|
||||
* :(fab fa-css3-alt): Beautiful CSS animation
|
||||
|
||||
#### Social and Comment Systems
|
||||
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1 @@
|
|||
{"Target":"css/style.min.css","MediaType":"text/css","Data":{}}
|
||||
|
|
@ -18,7 +18,7 @@ draft: false
|
|||
* :(fab fa-searchengin): 使用基于 JSON-LD 格式 的 SEO SCHEMA 文件进行 SEO 优化
|
||||
* :(fab fa-google): 支持 [Google Analytics](https://analytics.google.com/analytics)
|
||||
* :(fas fa-search): 支持搜索引擎的网站验证 (Google, Bind, Yandex and Baidu)
|
||||
* :(fas fa-tachometer-alt): 支持 CDN
|
||||
* :(fas fa-tachometer-alt): 支持所有第三方库的 CDN
|
||||
* :(far fa-images): 基于 [lazysizes](https://github.com/aFarkas/lazysizes) 自动转换图片为懒加载
|
||||
|
||||
#### 外观和布局
|
||||
|
|
@ -27,7 +27,9 @@ draft: false
|
|||
* :(fas fa-moon): / :(fas fa-sun): 模式
|
||||
* :(fas fa-layer-group): 页面和列表保持一致的视觉样式
|
||||
* :(fas fa-ellipsis-h): 支持分页
|
||||
* :(far fa-list-alt): 易用和自动展开的文章目录，同时适配移动端
|
||||
* :(fas fa-language): 支持多语言和国际化
|
||||
* :(fab fa-css3-alt): 美观的 CSS 动画
|
||||
|
||||
#### 社交和评论系统
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue