mirror of
https://github.com/dillonzq/LoveIt.git
synced 2024-11-14 02:46:16 +01:00
chore(docs): remove fr docs
This commit is contained in:
parent
d7960984d7
commit
67b05a1e16
15 changed files with 4732 additions and 8857 deletions
|
@ -424,202 +424,6 @@ enableEmoji = true
|
||||||
Email = "xxxx@xxxx.com"
|
Email = "xxxx@xxxx.com"
|
||||||
RSS = true
|
RSS = true
|
||||||
|
|
||||||
[languages.fr]
|
|
||||||
weight = 3
|
|
||||||
# language code
|
|
||||||
languageCode = "fr"
|
|
||||||
# language name
|
|
||||||
languageName = "Français"
|
|
||||||
# whether to include Chinese/Japanese/Korean
|
|
||||||
hasCJKLanguage = false
|
|
||||||
# default amount of posts in each pages
|
|
||||||
paginate = 12
|
|
||||||
# [UA-XXXXXXXX-X] google analytics code
|
|
||||||
googleAnalytics = ""
|
|
||||||
# copyright description used only for seo schema
|
|
||||||
copyright = "This work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License."
|
|
||||||
# Menu config
|
|
||||||
[languages.fr.menu]
|
|
||||||
[[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
|
|
||||||
[[languages.fr.menu.main]]
|
|
||||||
identifier = "documentation"
|
|
||||||
pre = ""
|
|
||||||
post = ""
|
|
||||||
name = "Docs"
|
|
||||||
url = "/categories/documentation/"
|
|
||||||
title = ""
|
|
||||||
weight = 4
|
|
||||||
[[languages.fr.menu.main]]
|
|
||||||
identifier = "about"
|
|
||||||
pre = ""
|
|
||||||
name = "À propos"
|
|
||||||
url = "/about/"
|
|
||||||
title = ""
|
|
||||||
weight = 5
|
|
||||||
[[languages.fr.menu.main]]
|
|
||||||
identifier = "github"
|
|
||||||
pre = "<i class='fab fa-github fa-fw'></i>"
|
|
||||||
post = ""
|
|
||||||
name = ""
|
|
||||||
url = "https://github.com/dillonzq/LoveIt"
|
|
||||||
title = "GitHub"
|
|
||||||
weight = 6
|
|
||||||
[languages.fr.params]
|
|
||||||
# site description
|
|
||||||
description = "À propos du thème LoveIt"
|
|
||||||
# site keywords
|
|
||||||
keywords = ["Thème", "Hugo"]
|
|
||||||
# App icon config
|
|
||||||
[languages.fr.params.app]
|
|
||||||
# optional site title override for the app when added to an iOS home screen or Android launcher
|
|
||||||
title = "LoveIt"
|
|
||||||
# whether to omit favicon resource links
|
|
||||||
noFavicon = false
|
|
||||||
# modern SVG favicon to use in place of older style .png and .ico files
|
|
||||||
svgFavicon = ""
|
|
||||||
# Android browser theme color
|
|
||||||
themeColor = "#ffffff"
|
|
||||||
# Safari mask icon color
|
|
||||||
iconColor = "#5bbad5"
|
|
||||||
# Windows v8-10 tile color
|
|
||||||
tileColor = "#da532c"
|
|
||||||
# Search config
|
|
||||||
[languages.fr.params.search]
|
|
||||||
enable = true
|
|
||||||
# type of search engine ("lunr", "algolia")
|
|
||||||
type = "algolia"
|
|
||||||
# max index length of the chunked content
|
|
||||||
contentLength = 4000
|
|
||||||
# placeholder of the search bar
|
|
||||||
placeholder = ""
|
|
||||||
# max number of results length
|
|
||||||
maxResultLength = 10
|
|
||||||
# snippet length of the result
|
|
||||||
snippetLength = 30
|
|
||||||
# HTML tag name of the highlight part in results
|
|
||||||
highlightTag = "em"
|
|
||||||
# whether to use the absolute URL based on the baseURL in search index
|
|
||||||
absoluteURL = false
|
|
||||||
[languages.fr.params.search.algolia]
|
|
||||||
index = "index.fr"
|
|
||||||
appID = "PASDMWALPK"
|
|
||||||
searchKey = "b42948e51daaa93df92381c8e2ac0f93"
|
|
||||||
# Home page config
|
|
||||||
[languages.fr.params.home]
|
|
||||||
# amount of RSS pages
|
|
||||||
rss = 10
|
|
||||||
# Home page profile
|
|
||||||
[languages.fr.params.home.profile]
|
|
||||||
enable = true
|
|
||||||
# Gravatar Email for preferred avatar in home page
|
|
||||||
gravatarEmail = ""
|
|
||||||
# URL of avatar shown in home page
|
|
||||||
avatarURL = "/images/avatar.png"
|
|
||||||
# title shown in home page (HTML format is supported)
|
|
||||||
title = ""
|
|
||||||
# subtitle shown in home page
|
|
||||||
subtitle = "Un thème Hugo simple, élégant et efficace"
|
|
||||||
# whether to use typeit animation for subtitle
|
|
||||||
typeit = true
|
|
||||||
# whether to show social links
|
|
||||||
social = true
|
|
||||||
# disclaimer (HTML format is supported)
|
|
||||||
disclaimer = ""
|
|
||||||
# Home page posts
|
|
||||||
[languages.fr.params.home.posts]
|
|
||||||
enable = true
|
|
||||||
# special amount of posts in each home posts page
|
|
||||||
paginate = 6
|
|
||||||
# Social config in home page
|
|
||||||
[languages.fr.params.social]
|
|
||||||
GitHub = "xxxx"
|
|
||||||
Linkedin = "xxxx"
|
|
||||||
Twitter = "xxxx"
|
|
||||||
Instagram = ""
|
|
||||||
Facebook = ""
|
|
||||||
Telegram = ""
|
|
||||||
Medium = ""
|
|
||||||
Gitlab = ""
|
|
||||||
Youtubelegacy = ""
|
|
||||||
Youtubecustom = ""
|
|
||||||
Youtubechannel = ""
|
|
||||||
Tumblr = ""
|
|
||||||
Quora = ""
|
|
||||||
Keybase = ""
|
|
||||||
Pinterest = ""
|
|
||||||
Reddit = ""
|
|
||||||
Codepen = ""
|
|
||||||
FreeCodeCamp = ""
|
|
||||||
Bitbucket = ""
|
|
||||||
Stackoverflow = ""
|
|
||||||
Weibo = ""
|
|
||||||
Odnoklassniki = ""
|
|
||||||
VK = ""
|
|
||||||
Flickr = ""
|
|
||||||
Xing = ""
|
|
||||||
Snapchat = "xxxx"
|
|
||||||
Soundcloud = ""
|
|
||||||
Spotify = ""
|
|
||||||
Bandcamp = ""
|
|
||||||
Paypal = ""
|
|
||||||
Fivehundredpx = ""
|
|
||||||
Mix = ""
|
|
||||||
Goodreads = ""
|
|
||||||
Lastfm = ""
|
|
||||||
Foursquare = ""
|
|
||||||
Hackernews = "xxxx"
|
|
||||||
Kickstarter = ""
|
|
||||||
Patreon = ""
|
|
||||||
Steam = ""
|
|
||||||
Twitch = ""
|
|
||||||
Strava = ""
|
|
||||||
Skype = ""
|
|
||||||
Whatsapp = ""
|
|
||||||
Zhihu = ""
|
|
||||||
Douban = ""
|
|
||||||
Angellist = ""
|
|
||||||
Slidershare = ""
|
|
||||||
Jsfiddle = ""
|
|
||||||
Deviantart = ""
|
|
||||||
Behance = ""
|
|
||||||
Dribbble = "xxxx"
|
|
||||||
Wordpress = ""
|
|
||||||
Vine = ""
|
|
||||||
Googlescholar = ""
|
|
||||||
Researchgate = ""
|
|
||||||
Mastodon = ""
|
|
||||||
Thingiverse = ""
|
|
||||||
Devto = ""
|
|
||||||
Gitea = ""
|
|
||||||
XMPP = ""
|
|
||||||
Matrix = ""
|
|
||||||
Bilibili = ""
|
|
||||||
Email = "xxxx@xxxx.com"
|
|
||||||
RSS = true
|
|
||||||
|
|
||||||
[params]
|
[params]
|
||||||
# LoveIt theme version
|
# LoveIt theme version
|
||||||
# LoveIt 主题版本
|
# LoveIt 主题版本
|
||||||
|
|
|
@ -1,122 +0,0 @@
|
||||||
---
|
|
||||||
title: "À propos de LoveIt"
|
|
||||||
date: 2019-08-02T11:04:49+08:00
|
|
||||||
draft: false
|
|
||||||
|
|
||||||
lightgallery: true
|
|
||||||
|
|
||||||
math:
|
|
||||||
enable: true
|
|
||||||
---
|
|
||||||
|
|
||||||
{{< style "img { height: 1.25rem; }" >}}
|
|
||||||
[![GitHub release (latest by date)](https://img.shields.io/github/v/release/dillonzq/LoveIt?style=flat-square)](https://github.com/dillonzq/LoveIt/releases)
|
|
||||||
[![Hugo](https://img.shields.io/badge/Hugo-%5E0.62.0-ff4088?style=flat-square&logo=hugo)](https://gohugo.io/)
|
|
||||||
[![License](https://img.shields.io/github/license/dillonzq/LoveIt?style=flat-square)](https://github.com/dillonzq/LoveIt/blob/master/LICENSE)
|
|
||||||
[![GitHub stars](https://img.shields.io/github/stars/dillonzq/LoveIt?style=social)](https://github.com/dillonzq/LoveIt)
|
|
||||||
[![GitHub forks](https://img.shields.io/github/forks/dillonzq/LoveIt?style=social)](https://github.com/dillonzq/LoveIt/fork)
|
|
||||||
{{< /style >}}
|
|
||||||
|
|
||||||
{{< admonition warning >}}
|
|
||||||
Sorry, this article has not been completely translated into **French**.
|
|
||||||
Welcome to take the time to propose a translation by [:(fas fa-code-branch fa-fw): making a PR](https://github.com/dillonzq/LoveIt/pulls) to the theme!
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
> [:(far fa-kiss-wink-heart fa-fw): LoveIt](https://github.com/dillonzq/LoveIt) is a **clean**, **elegant** but **advanced** blog theme for [Hugo](https://gohugo.io/) developed by [Dillon](https://dillonzq.com).
|
|
||||||
>
|
|
||||||
> It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt) and [KeepIt Theme](https://github.com/Fastbyte01/KeepIt).
|
|
||||||
|
|
||||||
![Hugo Theme LoveIt](/images/Apple-Devices-Preview.png "Hugo Theme LoveIt")
|
|
||||||
|
|
||||||
### Features
|
|
||||||
|
|
||||||
#### Performance and SEO
|
|
||||||
|
|
||||||
* :(fas fa-rocket fa-fw): Optimized for **performance**: [99]/[100] on mobile and [100]/[100] on desktop in [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights)
|
|
||||||
* :(fab fa-searchengin fa-fw): Optimized SEO performance with a correct **SEO SCHEMA** based on JSON-LD
|
|
||||||
* :(fab fa-google fa-fw): **[Google Analytics](https://analytics.google.com/analytics)** supported
|
|
||||||
* :(far fa-chart-bar fa-fw): **[Fathom Analytics](https://usefathom.com/)** supported
|
|
||||||
* :(fas fa-search fa-fw): Search engine **verification** supported (Google, Bind, Yandex and Baidu)
|
|
||||||
* :(fas fa-tachometer-alt fa-fw): **CDN** for third-party libraries supported
|
|
||||||
* :(fas fa-cloud-download-alt fa-fw): Automatically converted images with **Lazy Load** by [lazysizes](https://github.com/aFarkas/lazysizes)
|
|
||||||
|
|
||||||
#### Appearance and Layout
|
|
||||||
|
|
||||||
* [:(fas fa-desktop):]/[:(fas fa-mobile):] **Responsive** layout
|
|
||||||
* [:(fas fa-sun):]/[:(fas fa-moon):] **[Light]/[Dark]** mode
|
|
||||||
* :(fas fa-layer-group fa-fw): Globally consistent **design language**
|
|
||||||
* :(fas fa-ellipsis-h fa-fw): **Pagination** supported
|
|
||||||
* :(far fa-list-alt fa-fw): Easy-to-use and self-expanding **table of contents**
|
|
||||||
* :(fas fa-language fa-fw): **Multilanguage** supported and i18n ready
|
|
||||||
* :(fab fa-css3-alt fa-fw): Beautiful **CSS animation**
|
|
||||||
|
|
||||||
#### Social and Comment Systems
|
|
||||||
|
|
||||||
* :(far fa-user fa-fw): **Gravatar** supported by [Gravatar](https://gravatar.com)
|
|
||||||
* :(fas fa-user-circle fa-fw): Local **Avatar** supported
|
|
||||||
* :(far fa-id-card fa-fw): Up to **64** social links supported
|
|
||||||
* :(fas fa-share-square fa-fw): Up to **28** share sites supported
|
|
||||||
* :(far fa-comment fa-fw): **Disqus** comment system supported by [Disqus](https://disqus.com)
|
|
||||||
* :(far fa-comment-dots fa-fw): **Gitalk** comment system supported by [Gitalk](https://github.com/gitalk/gitalk)
|
|
||||||
* :(far fa-comment-alt fa-fw): **Valine** comment system supported by [Valine](https://valine.js.org/)
|
|
||||||
* :(far fa-comments fa-fw): **Facebook comments** system supported by [Facebook](https://developers.facebook.com/docs/plugins/comments/)
|
|
||||||
* :(fas fa-comment fa-fw): **Telegram comments** system supported by [Comments](https://comments.app/)
|
|
||||||
* :(fas fa-comment-dots fa-fw): **Commento** comment system supported by [Commento](https://commento.io/)
|
|
||||||
* :(fas fa-comment-alt fa-fw): **Utterances** comment system supported by [Utterances](https://utteranc.es/)
|
|
||||||
|
|
||||||
#### Extended Features
|
|
||||||
|
|
||||||
* :(fas fa-search fa-fw): **Search** supported by [Lunr.js](https://lunrjs.com/) or [algolia](https://www.algolia.com/)
|
|
||||||
* :(far fa-grin-tongue-wink fa-fw): **Twemoji** supported
|
|
||||||
* :(fas fa-code fa-fw): Automatically **highlighting** code
|
|
||||||
* :(far fa-copy fa-fw): **Copy code** to clipboard with one click
|
|
||||||
* :(far fa-images fa-fw): **Images gallery** supported by [lightgallery.js](https://github.com/sachinchoolur/lightgallery.js)
|
|
||||||
* :(fab fa-font-awesome fa-fw): Extended Markdown syntax for **[Font Awesome](https://fontawesome.com/) icons**
|
|
||||||
* :(far fa-sticky-note fa-fw): Extended Markdown syntax for **ruby annotation**
|
|
||||||
* :(fas fa-percentage fa-fw): Extended Markdown syntax for **fraction**
|
|
||||||
* :(fas fa-square-root-alt fa-fw): **Mathematical formula** supported by [$ \KaTeX $](https://katex.org/)
|
|
||||||
* :(fas fa-project-diagram fa-fw): **Diagrams** shortcode supported by [mermaid](https://github.com/knsv/mermaid)
|
|
||||||
* :(fas fa-chart-pie fa-fw): **Interactive data visualization** shortcode supported by [ECharts](https://echarts.apache.org/)
|
|
||||||
* :(fas fa-map-marked-alt fa-fw): **Mapbox** shortcode supported by [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js)
|
|
||||||
* :(fas fa-music fa-fw): **Music player** shortcode supported by [APlayer](https://github.com/MoePlayer/APlayer) and [MetingJS](https://github.com/metowolf/MetingJS)
|
|
||||||
* :(fas fa-video fa-fw): **Bilibili player** shortcode
|
|
||||||
* :(far fa-bell fa-fw): Kinds of **admonitions** shortcode
|
|
||||||
* :(fas fa-align-left fa-fw): **Custom style** shortcode
|
|
||||||
* :(fab fa-js-square fa-fw): **Custom script** shortcode
|
|
||||||
* :(fas fa-i-cursor fa-fw): **Animated typing** supported by [TypeIt](https://typeitjs.com/)
|
|
||||||
* :(fas fa-arrow-down fa-fw): **Dynamic scroll** supported by [Smooth Scroll](https://github.com/cferdinandi/smooth-scroll)
|
|
||||||
* :(fas fa-cookie-bite fa-fw): **Cookie consent banner** supported by [cookieconsent](https://github.com/osano/cookieconsent)
|
|
||||||
* ...
|
|
||||||
|
|
||||||
### License
|
|
||||||
|
|
||||||
LoveIt is licensed under the **MIT** license.
|
|
||||||
|
|
||||||
Check the [LICENSE file](https://github.com/dillonzq/LoveIt/blob/master/LICENSE) for details.
|
|
||||||
|
|
||||||
Thanks to the authors of following resources included in the theme:
|
|
||||||
|
|
||||||
* [normalize.css](https://github.com/necolas/normalize.css)
|
|
||||||
* [Font Awesome](https://fontawesome.com/)
|
|
||||||
* [Simple Icons](https://github.com/simple-icons/simple-icons)
|
|
||||||
* [Animate.css](https://daneden.github.io/animate.css/)
|
|
||||||
* [Smooth Scroll](https://github.com/cferdinandi/smooth-scroll)
|
|
||||||
* [autocomplete.js](https://github.com/algolia/autocomplete.js)
|
|
||||||
* [Lunr.js](https://lunrjs.com/)
|
|
||||||
* [algoliasearch](https://github.com/algolia/algoliasearch-client-javascript)
|
|
||||||
* [lazysizes](https://github.com/aFarkas/lazysizes)
|
|
||||||
* [object-fit-images](https://github.com/fregante/object-fit-images)
|
|
||||||
* [Twemoji](https://github.com/twitter/twemoji)
|
|
||||||
* [lightgallery.js](https://github.com/sachinchoolur/lightgallery.js)
|
|
||||||
* [clipboard.js](https://github.com/zenorocha/clipboard.js)
|
|
||||||
* [Sharer.js](https://github.com/ellisonleao/sharer.js)
|
|
||||||
* [TypeIt](https://typeitjs.com/)
|
|
||||||
* [$ \KaTeX $](https://katex.org/)
|
|
||||||
* [mermaid](https://github.com/knsv/mermaid)
|
|
||||||
* [ECharts](https://echarts.apache.org/)
|
|
||||||
* [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js)
|
|
||||||
* [APlayer](https://github.com/MoePlayer/APlayer)
|
|
||||||
* [MetingJS](https://github.com/metowolf/MetingJS)
|
|
||||||
* [Gitalk](https://github.com/gitalk/gitalk)
|
|
||||||
* [Valine](https://valine.js.org/)
|
|
||||||
* [cookieconsent](https://github.com/osano/cookieconsent)
|
|
|
@ -1,3 +0,0 @@
|
||||||
---
|
|
||||||
title: "Documentation"
|
|
||||||
---
|
|
|
@ -1,768 +0,0 @@
|
||||||
---
|
|
||||||
weight: 4
|
|
||||||
title: "Syntaxe de Markdown de Base"
|
|
||||||
date: 2019-12-01T21:57:40+08:00
|
|
||||||
lastmod: 2020-01-01T16:45:40+08:00
|
|
||||||
draft: false
|
|
||||||
author: "Dillon"
|
|
||||||
authorLink: "https://dillonzq.com"
|
|
||||||
description: "Cet article présente la syntaxe et le format de base de Markdown."
|
|
||||||
resources:
|
|
||||||
- name: "featured-image"
|
|
||||||
src: "featured-image.png"
|
|
||||||
|
|
||||||
tags: ["Markdown", "HTML"]
|
|
||||||
categories: ["Markdown"]
|
|
||||||
|
|
||||||
lightgallery: true
|
|
||||||
---
|
|
||||||
|
|
||||||
Cet article propose un exemple de syntaxe Markdown de base qui peut être utilisée dans les fichiers de contenu Hugo.
|
|
||||||
|
|
||||||
<!--more-->
|
|
||||||
|
|
||||||
{{< admonition warning >}}
|
|
||||||
Sorry, this article has not been completely translated into **French**.
|
|
||||||
Welcome to take the time to propose a translation by [:(fas fa-code-branch fa-fw): making a PR](https://github.com/dillonzq/LoveIt/pulls) to the theme!
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
{{< admonition >}}
|
|
||||||
This article is a shameful copy of the great [Grav original page](http://learn.getgrav.org/content/markdown).
|
|
||||||
|
|
||||||
If you want to know about the extended Markdown syntax of **LoveIt** theme, please read [extended Markdown syntax page](../theme-documentation-content#extended-markdown-syntax).
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
Let's face it: Writing content for the Web is tiresome. WYSIWYG editors help alleviate this task, but they generally result in horrible code, or worse yet, ugly web pages.
|
|
||||||
|
|
||||||
**Markdown** is a better way to write **HTML**, without all the complexities and ugliness that usually accompanies it.
|
|
||||||
|
|
||||||
Some of the key benefits are:
|
|
||||||
|
|
||||||
1. Markdown is simple to learn, with minimal extra characters, so it's also quicker to write content.
|
|
||||||
2. Less chance of errors when writing in Markdown.
|
|
||||||
3. Produces valid XHTML output.
|
|
||||||
4. Keeps the content and the visual display separate, so you cannot mess up the look of your site.
|
|
||||||
5. Write in any text editor or Markdown application you like.
|
|
||||||
6. Markdown is a joy to use!
|
|
||||||
|
|
||||||
John Gruber, the author of Markdown, puts it like this:
|
|
||||||
|
|
||||||
> The overriding design goal for Markdown’s formatting syntax is to make it as readable as possible.
|
|
||||||
> The idea is that a Markdown-formatted document should be publishable as-is, as plain text,
|
|
||||||
> without looking like it’s been marked up with tags or formatting instructions.
|
|
||||||
> While Markdown’s syntax has been influenced by several existing text-to-HTML filters,
|
|
||||||
> the single biggest source of inspiration for Markdown’s syntax is the format of plain text email.
|
|
||||||
>
|
|
||||||
> {{< style "text-align: right;" >}}-- _John Gruber_{{< /style >}}
|
|
||||||
|
|
||||||
Without further delay, let us go over the main elements of Markdown and what the resulting HTML looks like!
|
|
||||||
|
|
||||||
{{< admonition tip >}}
|
|
||||||
:(far fa-bookmark fa-fw): Bookmark this page for easy future reference!
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
## 1 Headings
|
|
||||||
|
|
||||||
Headings from `h2` through `h6` are constructed with a `#` for each level:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
## h2 Heading
|
|
||||||
### h3 Heading
|
|
||||||
#### h4 Heading
|
|
||||||
##### h5 Heading
|
|
||||||
###### h6 Heading
|
|
||||||
```
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<h2>h2 Heading</h2>
|
|
||||||
<h3>h3 Heading</h3>
|
|
||||||
<h4>h4 Heading</h4>
|
|
||||||
<h5>h5 Heading</h5>
|
|
||||||
<h6>h6 Heading</h6>
|
|
||||||
```
|
|
||||||
|
|
||||||
{{< admonition note "Heading IDs" >}}
|
|
||||||
To add a custom heading ID, enclose the custom ID in curly braces on the same line as the heading:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
### A Great Heading {#custom-id}
|
|
||||||
```
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<h3 id="custom-id">A Great Heading</h3>
|
|
||||||
```
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
## 2 Comments
|
|
||||||
|
|
||||||
Comments should be HTML compatible.
|
|
||||||
|
|
||||||
```html
|
|
||||||
<!--
|
|
||||||
This is a comment
|
|
||||||
-->
|
|
||||||
```
|
|
||||||
|
|
||||||
Comment below should **NOT** be seen:
|
|
||||||
|
|
||||||
<!--
|
|
||||||
This is a comment
|
|
||||||
-->
|
|
||||||
|
|
||||||
## 3 Horizontal Rules
|
|
||||||
|
|
||||||
The HTML `<hr>` element is for creating a "thematic break" between paragraph-level elements.
|
|
||||||
In Markdown, you can create a `<hr>` with any of the following:
|
|
||||||
|
|
||||||
* `___`: three consecutive underscores
|
|
||||||
* `---`: three consecutive dashes
|
|
||||||
* `***`: three consecutive asterisks
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
___
|
|
||||||
---
|
|
||||||
***
|
|
||||||
|
|
||||||
## 4 Body Copy
|
|
||||||
|
|
||||||
Body copy written as normal, plain text will be wrapped with `<p></p>` tags in the rendered HTML.
|
|
||||||
|
|
||||||
So this body copy:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Et legere ocurreret pri,
|
|
||||||
animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex,
|
|
||||||
soluta officiis concludaturque ei qui, vide sensibus vim ad.
|
|
||||||
```
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<p>Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.</p>
|
|
||||||
```
|
|
||||||
|
|
||||||
A **line break** can be done with one blank line.
|
|
||||||
|
|
||||||
## 5 Inline HTML
|
|
||||||
|
|
||||||
If you need a certain HTML tag (with a class) you can simply use HTML:
|
|
||||||
|
|
||||||
```html
|
|
||||||
Paragraph in Markdown.
|
|
||||||
|
|
||||||
<div class="class">
|
|
||||||
This is <b>HTML</b>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
Paragraph in Markdown.
|
|
||||||
```
|
|
||||||
|
|
||||||
## 6 Emphasis
|
|
||||||
|
|
||||||
### Bold
|
|
||||||
|
|
||||||
For emphasizing a snippet of text with a heavier font-weight.
|
|
||||||
|
|
||||||
The following snippet of text is **rendered as bold text**.
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
**rendered as bold text**
|
|
||||||
__rendered as bold text__
|
|
||||||
```
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<strong>rendered as bold text</strong>
|
|
||||||
```
|
|
||||||
|
|
||||||
### Italics
|
|
||||||
|
|
||||||
For emphasizing a snippet of text with italics.
|
|
||||||
|
|
||||||
The following snippet of text is _rendered as italicized text_.
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
*rendered as italicized text*
|
|
||||||
_rendered as italicized text_
|
|
||||||
```
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<em>rendered as italicized text</em>
|
|
||||||
```
|
|
||||||
|
|
||||||
### Strikethrough
|
|
||||||
|
|
||||||
In [[GFM]^(GitHub flavored Markdown)](https://github.github.com/gfm/) you can do strikethroughs.
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
~~Strike through this text.~~
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
~~Strike through this text.~~
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<del>Strike through this text.</del>
|
|
||||||
```
|
|
||||||
|
|
||||||
### Combination
|
|
||||||
|
|
||||||
Bold, italics, and strikethrough can be used in combination.
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
***bold and italics***
|
|
||||||
~~**strikethrough and bold**~~
|
|
||||||
~~*strikethrough and italics*~~
|
|
||||||
~~***bold, italics and strikethrough***~~
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
***bold and italics***
|
|
||||||
|
|
||||||
~~**strikethrough and bold**~~
|
|
||||||
|
|
||||||
~~*strikethrough and italics*~~
|
|
||||||
|
|
||||||
~~***bold, italics and strikethrough***~~
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<em><strong>bold and italics</strong></em>
|
|
||||||
<del><strong>strikethrough and bold</strong></del>
|
|
||||||
<del><em>strikethrough and italics</em></del>
|
|
||||||
<del><em><strong>bold, italics and strikethrough</strong></em></del>
|
|
||||||
```
|
|
||||||
|
|
||||||
## 7 Blockquotes
|
|
||||||
|
|
||||||
For quoting blocks of content from another source within your document.
|
|
||||||
|
|
||||||
Add `>` before any text you want to quote:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
> **Fusion Drive** combines a hard drive with a flash storage (solid-state drive) and presents it as a single logical volume with the space of both drives combined.
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
> **Fusion Drive** combines a hard drive with a flash storage (solid-state drive) and presents it as a single logical volume with the space of both drives combined.
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<blockquote>
|
|
||||||
<p>
|
|
||||||
<strong>Fusion Drive</strong> combines a hard drive with a flash storage (solid-state drive) and presents it as a single logical volume with the space of both drives combined.
|
|
||||||
</p>
|
|
||||||
</blockquote>
|
|
||||||
```
|
|
||||||
|
|
||||||
Blockquotes can also be nested:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
> Donec massa lacus, ultricies a ullamcorper in, fermentum sed augue.
|
|
||||||
Nunc augue augue, aliquam non hendrerit ac, commodo vel nisi.
|
|
||||||
>> Sed adipiscing elit vitae augue consectetur a gravida nunc vehicula. Donec auctor
|
|
||||||
odio non est accumsan facilisis. Aliquam id turpis in dolor tincidunt mollis ac eu diam.
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
> Donec massa lacus, ultricies a ullamcorper in, fermentum sed augue.
|
|
||||||
Nunc augue augue, aliquam non hendrerit ac, commodo vel nisi.
|
|
||||||
>> Sed adipiscing elit vitae augue consectetur a gravida nunc vehicula. Donec auctor
|
|
||||||
odio non est accumsan facilisis. Aliquam id turpis in dolor tincidunt mollis ac eu diam.
|
|
||||||
|
|
||||||
## 8 Lists
|
|
||||||
|
|
||||||
### Unordered
|
|
||||||
|
|
||||||
A list of items in which the order of the items does not explicitly matter.
|
|
||||||
|
|
||||||
You may use any of the following symbols to denote bullets for each list item:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
* valid bullet
|
|
||||||
- valid bullet
|
|
||||||
+ valid bullet
|
|
||||||
```
|
|
||||||
|
|
||||||
For example:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
* Lorem ipsum dolor sit amet
|
|
||||||
* Consectetur adipiscing elit
|
|
||||||
* Integer molestie lorem at massa
|
|
||||||
* Facilisis in pretium nisl aliquet
|
|
||||||
* Nulla volutpat aliquam velit
|
|
||||||
* Phasellus iaculis neque
|
|
||||||
* Purus sodales ultricies
|
|
||||||
* Vestibulum laoreet porttitor sem
|
|
||||||
* Ac tristique libero volutpat at
|
|
||||||
* Faucibus porta lacus fringilla vel
|
|
||||||
* Aenean sit amet erat nunc
|
|
||||||
* Eget porttitor lorem
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
* Lorem ipsum dolor sit amet
|
|
||||||
* Consectetur adipiscing elit
|
|
||||||
* Integer molestie lorem at massa
|
|
||||||
* Facilisis in pretium nisl aliquet
|
|
||||||
* Nulla volutpat aliquam velit
|
|
||||||
* Phasellus iaculis neque
|
|
||||||
* Purus sodales ultricies
|
|
||||||
* Vestibulum laoreet porttitor sem
|
|
||||||
* Ac tristique libero volutpat at
|
|
||||||
* Faucibus porta lacus fringilla vel
|
|
||||||
* Aenean sit amet erat nunc
|
|
||||||
* Eget porttitor lorem
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<ul>
|
|
||||||
<li>Lorem ipsum dolor sit amet</li>
|
|
||||||
<li>Consectetur adipiscing elit</li>
|
|
||||||
<li>Integer molestie lorem at massa</li>
|
|
||||||
<li>Facilisis in pretium nisl aliquet</li>
|
|
||||||
<li>Nulla volutpat aliquam velit
|
|
||||||
<ul>
|
|
||||||
<li>Phasellus iaculis neque</li>
|
|
||||||
<li>Purus sodales ultricies</li>
|
|
||||||
<li>Vestibulum laoreet porttitor sem</li>
|
|
||||||
<li>Ac tristique libero volutpat at</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li>Faucibus porta lacus fringilla vel</li>
|
|
||||||
<li>Aenean sit amet erat nunc</li>
|
|
||||||
<li>Eget porttitor lorem</li>
|
|
||||||
</ul>
|
|
||||||
```
|
|
||||||
|
|
||||||
### Ordered
|
|
||||||
|
|
||||||
A list of items in which the order of items does explicitly matter.
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
1. Lorem ipsum dolor sit amet
|
|
||||||
2. Consectetur adipiscing elit
|
|
||||||
3. Integer molestie lorem at massa
|
|
||||||
4. Facilisis in pretium nisl aliquet
|
|
||||||
5. Nulla volutpat aliquam velit
|
|
||||||
6. Faucibus porta lacus fringilla vel
|
|
||||||
7. Aenean sit amet erat nunc
|
|
||||||
8. Eget porttitor lorem
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
1. Lorem ipsum dolor sit amet
|
|
||||||
2. Consectetur adipiscing elit
|
|
||||||
3. Integer molestie lorem at massa
|
|
||||||
4. Facilisis in pretium nisl aliquet
|
|
||||||
5. Nulla volutpat aliquam velit
|
|
||||||
6. Faucibus porta lacus fringilla vel
|
|
||||||
7. Aenean sit amet erat nunc
|
|
||||||
8. Eget porttitor lorem
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<ol>
|
|
||||||
<li>Lorem ipsum dolor sit amet</li>
|
|
||||||
<li>Consectetur adipiscing elit</li>
|
|
||||||
<li>Integer molestie lorem at massa</li>
|
|
||||||
<li>Facilisis in pretium nisl aliquet</li>
|
|
||||||
<li>Nulla volutpat aliquam velit</li>
|
|
||||||
<li>Faucibus porta lacus fringilla vel</li>
|
|
||||||
<li>Aenean sit amet erat nunc</li>
|
|
||||||
<li>Eget porttitor lorem</li>
|
|
||||||
</ol>
|
|
||||||
```
|
|
||||||
|
|
||||||
{{< admonition tip >}}
|
|
||||||
If you just use `1.` for each number, Markdown will automatically number each item. For example:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
1. Lorem ipsum dolor sit amet
|
|
||||||
1. Consectetur adipiscing elit
|
|
||||||
1. Integer molestie lorem at massa
|
|
||||||
1. Facilisis in pretium nisl aliquet
|
|
||||||
1. Nulla volutpat aliquam velit
|
|
||||||
1. Faucibus porta lacus fringilla vel
|
|
||||||
1. Aenean sit amet erat nunc
|
|
||||||
1. Eget porttitor lorem
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
1. Lorem ipsum dolor sit amet
|
|
||||||
1. Consectetur adipiscing elit
|
|
||||||
1. Integer molestie lorem at massa
|
|
||||||
1. Facilisis in pretium nisl aliquet
|
|
||||||
1. Nulla volutpat aliquam velit
|
|
||||||
1. Faucibus porta lacus fringilla vel
|
|
||||||
1. Aenean sit amet erat nunc
|
|
||||||
1. Eget porttitor lorem
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
### Task Lists
|
|
||||||
|
|
||||||
Task lists allow you to create a list of items with checkboxes. To create a task list, add dashes (`-`) and brackets with a space (`[ ]`) before task list items. To select a checkbox, add an x in between the brackets (`[x]`).
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
- [x] Write the press release
|
|
||||||
- [ ] Update the website
|
|
||||||
- [ ] Contact the media
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
- [x] Write the press release
|
|
||||||
- [ ] Update the website
|
|
||||||
- [ ] Contact the media
|
|
||||||
|
|
||||||
## 9 Code
|
|
||||||
|
|
||||||
### Inline Code
|
|
||||||
|
|
||||||
Wrap inline snippets of code with <code>`</code>.
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
In this example, `<section></section>` should be wrapped as **code**.
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
In this example, `<section></section>` should be wrapped as **code**.
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<p>
|
|
||||||
In this example, <code><section></section></code> should be wrapped with <strong>code</strong>.
|
|
||||||
</p>
|
|
||||||
```
|
|
||||||
|
|
||||||
### Indented Code
|
|
||||||
|
|
||||||
Or indent several lines of code by at least four spaces, as in:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
// Some comments
|
|
||||||
line 1 of code
|
|
||||||
line 2 of code
|
|
||||||
line 3 of code
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
// Some comments
|
|
||||||
line 1 of code
|
|
||||||
line 2 of code
|
|
||||||
line 3 of code
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<pre>
|
|
||||||
<code>
|
|
||||||
// Some comments
|
|
||||||
line 1 of code
|
|
||||||
line 2 of code
|
|
||||||
line 3 of code
|
|
||||||
</code>
|
|
||||||
</pre>
|
|
||||||
```
|
|
||||||
|
|
||||||
### Block Fenced Code
|
|
||||||
|
|
||||||
Use "fences" <code>```</code> to block in multiple lines of code with a language attribute.
|
|
||||||
|
|
||||||
{{< highlight markdown >}}
|
|
||||||
```markdown
|
|
||||||
Sample text here...
|
|
||||||
```
|
|
||||||
{{< / highlight >}}
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<pre language-html>
|
|
||||||
<code>Sample text here...</code>
|
|
||||||
</pre>
|
|
||||||
```
|
|
||||||
|
|
||||||
### Syntax Highlighting
|
|
||||||
|
|
||||||
[GFM]^(GitHub Flavored Markdown) also supports syntax highlighting.
|
|
||||||
|
|
||||||
To activate it, simply add the file extension of the language you want to use directly after the first code "fence",
|
|
||||||
<code>```js</code>, and syntax highlighting will automatically be applied in the rendered HTML.
|
|
||||||
|
|
||||||
For example, to apply syntax highlighting to JavaScript code:
|
|
||||||
|
|
||||||
{{< highlight markdown >}}
|
|
||||||
```js
|
|
||||||
grunt.initConfig({
|
|
||||||
assemble: {
|
|
||||||
options: {
|
|
||||||
assets: 'docs/assets',
|
|
||||||
data: 'src/data/*.{json,yml}',
|
|
||||||
helpers: 'src/custom-helpers.js',
|
|
||||||
partials: ['src/partials/**/*.{hbs,md}']
|
|
||||||
},
|
|
||||||
pages: {
|
|
||||||
options: {
|
|
||||||
layout: 'default.hbs'
|
|
||||||
},
|
|
||||||
files: {
|
|
||||||
'./': ['src/templates/pages/index.hbs']
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
```
|
|
||||||
{{< / highlight >}}
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
```js
|
|
||||||
grunt.initConfig({
|
|
||||||
assemble: {
|
|
||||||
options: {
|
|
||||||
assets: 'docs/assets',
|
|
||||||
data: 'src/data/*.{json,yml}',
|
|
||||||
helpers: 'src/custom-helpers.js',
|
|
||||||
partials: ['src/partials/**/*.{hbs,md}']
|
|
||||||
},
|
|
||||||
pages: {
|
|
||||||
options: {
|
|
||||||
layout: 'default.hbs'
|
|
||||||
},
|
|
||||||
files: {
|
|
||||||
'./': ['src/templates/pages/index.hbs']
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
```
|
|
||||||
|
|
||||||
{{< admonition >}}
|
|
||||||
[Syntax highlighting page](https://gohugo.io/content-management/syntax-highlighting/) in **Hugo** Docs introduces more about syntax highlighting, including highlight shortcode.
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
## 10 Tables
|
|
||||||
|
|
||||||
Tables are created by adding pipes as dividers between each cell, and by adding a line of dashes (also separated by bars) beneath the header. Note that the pipes do not need to be vertically aligned.
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
| Option | Description |
|
|
||||||
| ------ | ----------- |
|
|
||||||
| data | path to data files to supply the data that will be passed into templates. |
|
|
||||||
| engine | engine to be used for processing templates. Handlebars is the default. |
|
|
||||||
| ext | extension to be used for dest files. |
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
| Option | Description |
|
|
||||||
| ------ | ----------- |
|
|
||||||
| data | path to data files to supply the data that will be passed into templates. |
|
|
||||||
| engine | engine to be used for processing templates. Handlebars is the default. |
|
|
||||||
| ext | extension to be used for dest files. |
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<table>
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>Option</th>
|
|
||||||
<th>Description</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<td>data</td>
|
|
||||||
<td>path to data files to supply the data that will be passed into templates.</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>engine</td>
|
|
||||||
<td>engine to be used for processing templates. Handlebars is the default.</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>ext</td>
|
|
||||||
<td>extension to be used for dest files.</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
```
|
|
||||||
|
|
||||||
{{< admonition note "Right or center aligned text" >}}
|
|
||||||
Adding a colon on the right side of the dashes below any heading will right align text for that column.
|
|
||||||
|
|
||||||
Adding colons on both sides of the dashes below any heading will center align text for that column.
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
| Option | Description |
|
|
||||||
|:------:| -----------:|
|
|
||||||
| data | path to data files to supply the data that will be passed into templates. |
|
|
||||||
| engine | engine to be used for processing templates. Handlebars is the default. |
|
|
||||||
| ext | extension to be used for dest files. |
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
| Option | Description |
|
|
||||||
|:------:| -----------:|
|
|
||||||
| data | path to data files to supply the data that will be passed into templates. |
|
|
||||||
| engine | engine to be used for processing templates. Handlebars is the default. |
|
|
||||||
| ext | extension to be used for dest files. |
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
## 11 Links
|
|
||||||
|
|
||||||
### Basic Link {#links}
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
<https://assemble.io>
|
|
||||||
<contact@revolunet.com>
|
|
||||||
[Assemble](https://assemble.io)
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this (hover over the link, there is no tooltip):
|
|
||||||
|
|
||||||
<https://assemble.io>
|
|
||||||
|
|
||||||
<contact@revolunet.com>
|
|
||||||
|
|
||||||
[Assemble](https://assemble.io)
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<a href="https://assemble.io">https://assemble.io</a>
|
|
||||||
<a href="mailto:contact@revolunet.com">contact@revolunet.com</a>
|
|
||||||
<a href="https://assemble.io">Assemble</a>
|
|
||||||
```
|
|
||||||
|
|
||||||
### Add a Title
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
[Upstage](https://github.com/upstage/ "Visit Upstage!")
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this (hover over the link, there should be a tooltip):
|
|
||||||
|
|
||||||
[Upstage](https://github.com/upstage/ "Visit Upstage!")
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<a href="https://github.com/upstage/" title="Visit Upstage!">Upstage</a>
|
|
||||||
```
|
|
||||||
|
|
||||||
### Named Anchors
|
|
||||||
|
|
||||||
Named anchors enable you to jump to the specified anchor point on the same page. For example, each of these chapters:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
## Table of Contents
|
|
||||||
* [Chapter 1](#chapter-1)
|
|
||||||
* [Chapter 2](#chapter-2)
|
|
||||||
* [Chapter 3](#chapter-3)
|
|
||||||
```
|
|
||||||
|
|
||||||
will jump to these sections:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
## Chapter 1 <a id="chapter-1"></a>
|
|
||||||
Content for chapter one.
|
|
||||||
|
|
||||||
## Chapter 2 <a id="chapter-2"></a>
|
|
||||||
Content for chapter one.
|
|
||||||
|
|
||||||
## Chapter 3 <a id="chapter-3"></a>
|
|
||||||
Content for chapter one.
|
|
||||||
```
|
|
||||||
|
|
||||||
{{< admonition >}}
|
|
||||||
The specific placement of the anchor tag seems to be arbitrary. They are placed inline here since it seems to be unobtrusive, and it works.
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
## 12 Footnotes
|
|
||||||
|
|
||||||
Footnotes allow you to add notes and references without cluttering the body of the document. When you create a footnote, a superscript number with a link appears where you added the footnote reference. Readers can click the link to jump to the content of the footnote at the bottom of the page.
|
|
||||||
|
|
||||||
To create a footnote reference, add a caret and an identifier inside brackets (`[^1]`). Identifiers can be numbers or words, but they can’t contain spaces or tabs. Identifiers only correlate the footnote reference with the footnote itself — in the output, footnotes are numbered sequentially.
|
|
||||||
|
|
||||||
Add the footnote using another caret and number inside brackets with a colon and text (`[^1]: My footnote.`). You don’t have to put footnotes at the end of the document. You can put them anywhere except inside other elements like lists, block quotes, and tables.
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
This is a digital footnote[^1].
|
|
||||||
This is a footnote with "label"[^label]
|
|
||||||
|
|
||||||
[^1]: This is a digital footnote
|
|
||||||
[^label]: This is a footnote with "label"
|
|
||||||
```
|
|
||||||
|
|
||||||
This is a digital footnote[^1].
|
|
||||||
|
|
||||||
This is a footnote with "label"[^label]
|
|
||||||
|
|
||||||
[^1]: This is a digital footnote
|
|
||||||
[^label]: This is a footnote with "label"
|
|
||||||
|
|
||||||
## 13 Images
|
|
||||||
|
|
||||||
Images have a similar syntax to links but include a preceding exclamation point.
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
![Minion](https://octodex.github.com/images/minion.png)
|
|
||||||
```
|
|
||||||
|
|
||||||
![Minion](https://octodex.github.com/images/minion.png)
|
|
||||||
|
|
||||||
or:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
![Alt text](https://octodex.github.com/images/stormtroopocat.jpg "The Stormtroopocat")
|
|
||||||
```
|
|
||||||
|
|
||||||
![Alt text](https://octodex.github.com/images/stormtroopocat.jpg "The Stormtroopocat")
|
|
||||||
|
|
||||||
Like links, images also have a footnote style syntax:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
![Alt text][id]
|
|
||||||
```
|
|
||||||
|
|
||||||
![Alt text][id]
|
|
||||||
|
|
||||||
With a reference later in the document defining the URL location:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
[id]: https://octodex.github.com/images/dojocat.jpg "The Dojocat"
|
|
||||||
```
|
|
||||||
|
|
||||||
[id]: https://octodex.github.com/images/dojocat.jpg "The Dojocat"
|
|
||||||
|
|
||||||
{{< admonition tip >}}
|
|
||||||
**LoveIt** theme has [special shortcode for image](../theme-documentation-extended-shortcodes#image), which provides more features.
|
|
||||||
{{< /admonition >}}
|
|
File diff suppressed because it is too large
Load diff
|
@ -1036,7 +1036,7 @@ The following is a comparison of two search engines:
|
||||||
{{< admonition tip "Tips about algolia" >}}
|
{{< admonition tip "Tips about algolia" >}}
|
||||||
You need to upload `index.json` files to algolia to activate searching.
|
You need to upload `index.json` files to algolia to activate searching.
|
||||||
You could upload the `index.json` files by browsers but a CLI tool may be better.
|
You could upload the `index.json` files by browsers but a CLI tool may be better.
|
||||||
[Algolia Atomic](https://github.com/chrisdmacrae/atomic-algolia) is a good choice.
|
The official [Algolia CLI](https://github.com/algolia/algolia-cli) is a good choice.
|
||||||
To be compatible with Hugo multilingual mode,
|
To be compatible with Hugo multilingual mode,
|
||||||
you need to upload different `index.json` for each language to the different index of algolia, such as `zh-cn/index.json` or `fr/index.json`...
|
you need to upload different `index.json` for each language to the different index of algolia, such as `zh-cn/index.json` or `fr/index.json`...
|
||||||
{{< /admonition >}}
|
{{< /admonition >}}
|
||||||
|
|
File diff suppressed because it is too large
Load diff
|
@ -1038,6 +1038,6 @@ defaultContentLanguage = "zh-cn"
|
||||||
|
|
||||||
{{< admonition tip "关于 algolia 的使用技巧" >}}
|
{{< admonition tip "关于 algolia 的使用技巧" >}}
|
||||||
你需要上传 `index.json` 到 algolia 来激活搜索功能. 你可以使用浏览器来上传 `index.json` 文件但是一个自动化的脚本可能效果更好.
|
你需要上传 `index.json` 到 algolia 来激活搜索功能. 你可以使用浏览器来上传 `index.json` 文件但是一个自动化的脚本可能效果更好.
|
||||||
[Algolia Atomic](https://github.com/chrisdmacrae/atomic-algolia) 是一个不错的选择.
|
官方提供的 [Algolia CLI](https://github.com/algolia/algolia-cli) 是一个不错的选择.
|
||||||
为了兼容 Hugo 的多语言模式, 你需要上传不同语言的 `index.json` 文件到对应的 algolia index, 例如 `zh-cn/index.json` 或 `fr/index.json`...
|
为了兼容 Hugo 的多语言模式, 你需要上传不同语言的 `index.json` 文件到对应的 algolia index, 例如 `zh-cn/index.json` 或 `fr/index.json`...
|
||||||
{{< /admonition >}}
|
{{< /admonition >}}
|
||||||
|
|
|
@ -1,183 +0,0 @@
|
||||||
---
|
|
||||||
weight: 3
|
|
||||||
title: "Thème Documentation - Built-in Shortcodes"
|
|
||||||
date: 2020-03-04T16:29:59+08:00
|
|
||||||
lastmod: 2020-03-04T16:29:59+08:00
|
|
||||||
draft: false
|
|
||||||
author: "Dillon"
|
|
||||||
authorLink: "https://dillonzq.com"
|
|
||||||
description: "Hugo fournit plusieurs shortcodes intégrés pour la commodité de l'auteur et pour garder votre contenu de démarque propre."
|
|
||||||
resources:
|
|
||||||
- name: "featured"
|
|
||||||
src: "featured-image.png"
|
|
||||||
|
|
||||||
tags: ["shortcodes"]
|
|
||||||
categories: ["documentation"]
|
|
||||||
|
|
||||||
lightgallery: true
|
|
||||||
---
|
|
||||||
|
|
||||||
**Hugo** fournit plusieurs shortcodes intégrés pour la commodité de l'auteur et pour garder votre contenu de démarque propre.
|
|
||||||
|
|
||||||
<!--more-->
|
|
||||||
|
|
||||||
{{< admonition warning >}}
|
|
||||||
Sorry, this article has not been completely translated into **French**.
|
|
||||||
Welcome to take the time to propose a translation by [:(fas fa-code-branch fa-fw): making a PR](https://github.com/dillonzq/LoveIt/pulls) to the theme!
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
Hugo uses Markdown for its simple content format. However, there are a lot of things that Markdown doesn’t support well. You could use pure HTML to expand possibilities.
|
|
||||||
|
|
||||||
But this happens to be a bad idea. Everyone uses Markdown because it’s pure and simple to read even non-rendered. You should avoid HTML to keep it as simple as possible.
|
|
||||||
|
|
||||||
To avoid this limitations, Hugo created [shortcodes](https://gohugo.io/extras/shortcodes/).
|
|
||||||
A shortcode is a simple snippet that can generate reasonable HTML code and conforms to Markdown's design philosophy.
|
|
||||||
|
|
||||||
Hugo ships with a set of predefined shortcodes that represent very common usage. These shortcodes are provided for author convenience and to keep your markdown content clean.
|
|
||||||
|
|
||||||
## 1 figure {#figure}
|
|
||||||
|
|
||||||
[Documentation of `figure`](https://gohugo.io/content-management/shortcodes#figure)
|
|
||||||
|
|
||||||
Example `figure` input:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
{{</* figure src="/images/lighthouse.jpg" title="Lighthouse (figure)" */>}}
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
{{< figure src="/images/lighthouse.jpg" title="Lighthouse (figure)" >}}
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<figure>
|
|
||||||
<img src="/images/lighthouse.jpg"/>
|
|
||||||
<figcaption>
|
|
||||||
<h4>Lighthouse (figure)</h4>
|
|
||||||
</figcaption>
|
|
||||||
</figure>
|
|
||||||
```
|
|
||||||
|
|
||||||
## 2 gist
|
|
||||||
|
|
||||||
[Documentation of `gist`](https://gohugo.io/content-management/shortcodes#gist)
|
|
||||||
|
|
||||||
Example `gist` input:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
{{</* gist spf13 7896402 */>}}
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
{{< gist spf13 7896402 >}}
|
|
||||||
|
|
||||||
The HTML looks like this:
|
|
||||||
|
|
||||||
```html
|
|
||||||
<script type="application/javascript" src="https://gist.github.com/spf13/7896402.js"></script>
|
|
||||||
```
|
|
||||||
|
|
||||||
## 3 highlight
|
|
||||||
|
|
||||||
[Documentation of `highlight`](https://gohugo.io/content-management/shortcodes#instagram)
|
|
||||||
|
|
||||||
Example `highlight` input:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
{{</* highlight html */>}}
|
|
||||||
<section id="main">
|
|
||||||
<div>
|
|
||||||
<h1 id="title">{{ .Title }}</h1>
|
|
||||||
{{ range .Pages }}
|
|
||||||
{{ .Render "summary"}}
|
|
||||||
{{ end }}
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
{{</* /highlight */>}}
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
{{< highlight html >}}
|
|
||||||
<section id="main">
|
|
||||||
<div>
|
|
||||||
<h1 id="title">{{ .Title }}</h1>
|
|
||||||
{{ range .Pages }}
|
|
||||||
{{ .Render "summary"}}
|
|
||||||
{{ end }}
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
{{< /highlight >}}
|
|
||||||
|
|
||||||
## 4 instagram
|
|
||||||
|
|
||||||
[Documentation of `instagram`](https://gohugo.io/content-management/shortcodes#instagram)
|
|
||||||
|
|
||||||
{{< admonition question "Instagram’s API was deprecated since October 24th, 2020" >}}
|
|
||||||
The instagram-shortcode refers an endpoint of Instagram’s API, that’s deprecated since October 24th, 2020.
|
|
||||||
Thus, no images can be fetched from this API endpoint, resulting in an error when the instagram-shortcode is used.
|
|
||||||
For more information please have a look at GitHub issue [#7879](https://github.com/gohugoio/hugo/issues/7879).
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
## 5 param
|
|
||||||
|
|
||||||
[Documentation of `param`](https://gohugo.io/content-management/shortcodes#param)
|
|
||||||
|
|
||||||
Example `param` input:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
{{</* param description */>}}
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
{{< param description >}}
|
|
||||||
|
|
||||||
## 6 ref and relref {#ref-and-relref}
|
|
||||||
|
|
||||||
[Documentation of `ref` and `relref`](https://gohugo.io/content-management/shortcodes#ref-and-relref)
|
|
||||||
|
|
||||||
## 7 tweet
|
|
||||||
|
|
||||||
[Documentation of `tweet`](https://gohugo.io/content-management/shortcodes#tweet)
|
|
||||||
|
|
||||||
Example `tweet` input:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
{{</* tweet 917359331535966209 */>}}
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
{{< tweet 917359331535966209 >}}
|
|
||||||
|
|
||||||
## 8 vimeo
|
|
||||||
|
|
||||||
[Documentation of `vimeo`](https://gohugo.io/content-management/shortcodes#vimeo)
|
|
||||||
|
|
||||||
Example `vimeo` input:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
{{</* vimeo 146022717 */>}}
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
{{< vimeo 146022717 >}}
|
|
||||||
|
|
||||||
## 9 youtube
|
|
||||||
|
|
||||||
[Documentation of `youtube`](https://gohugo.io/content-management/shortcodes#youtube)
|
|
||||||
|
|
||||||
Example `youtube` input:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
{{</* youtube w7Ft2ymGmfc */>}}
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
{{< youtube w7Ft2ymGmfc >}}
|
|
|
@ -1,404 +0,0 @@
|
||||||
---
|
|
||||||
weight: 2
|
|
||||||
title: "Thème Documentation - Contenu"
|
|
||||||
date: 2020-03-05T16:30:05+08:00
|
|
||||||
lastmod: 2020-03-05T16:30:05+08:00
|
|
||||||
draft: false
|
|
||||||
author: "Dillon"
|
|
||||||
authorLink: "https://dillonzq.com"
|
|
||||||
description: "Découvrez comment créer et organiser votre contenu rapidement et intuitivement dans le thème LoveIt."
|
|
||||||
resources:
|
|
||||||
- name: "featured-image"
|
|
||||||
src: "featured-image.jpg"
|
|
||||||
|
|
||||||
tags: ["content", "Markdown"]
|
|
||||||
categories: ["documentation"]
|
|
||||||
|
|
||||||
lightgallery: true
|
|
||||||
|
|
||||||
toc:
|
|
||||||
auto: false
|
|
||||||
math:
|
|
||||||
enable: true
|
|
||||||
---
|
|
||||||
|
|
||||||
Découvrez comment créer et organiser votre contenu rapidement et intuitivement dans le thème **LoveIt**.
|
|
||||||
|
|
||||||
<!--more-->
|
|
||||||
|
|
||||||
{{< admonition warning >}}
|
|
||||||
Sorry, this article has not been completely translated into **French**.
|
|
||||||
Welcome to take the time to propose a translation by [:(fas fa-code-branch fa-fw): making a PR](https://github.com/dillonzq/LoveIt/pulls) to the theme!
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
## 1 Contents Organization {#contents-organization}
|
|
||||||
|
|
||||||
A few suggestions to help you get a good looking site quickly:
|
|
||||||
|
|
||||||
* Keep post pages in the `content/posts` directory, for example: `content/posts/my-first-post.md`
|
|
||||||
* Keep other pages in the `content` directory, for example: `content/about.md`
|
|
||||||
* Local resources organization
|
|
||||||
|
|
||||||
{{< admonition note "Local Resource Reference" >}}
|
|
||||||
{{< version 0.2.10 >}}
|
|
||||||
|
|
||||||
There are three ways to reference local resources such as **images** and **music**:
|
|
||||||
|
|
||||||
1. Using [page resources](https://gohugo.io/content-management/page-resources/) in [page bundles](https://gohugo.io/content-management/page-bundles/).
|
|
||||||
You can reference page resources by the value for `Resources.GetMatch` or the filepath of the resource relative to the page directory directly.
|
|
||||||
2. Store resources in the **assets** directory, which is `/assets` by default.
|
|
||||||
The filepath of the resource to reference in the post is relative to the assets directory.
|
|
||||||
3. Store resources in the **static** directory, which is `/static` by default.
|
|
||||||
The filepath of the resource to reference in the post is relative to the static directory.
|
|
||||||
|
|
||||||
The **priority** of references is also in the above order.
|
|
||||||
|
|
||||||
There are many places in the theme where the above local resource references can be used,
|
|
||||||
such as **links**, **images**, `image` shortcode, `music` shortcode and some params in the **front matter**.
|
|
||||||
|
|
||||||
Images in page resources or assets directory [processing](https://gohugo.io/content-management/image-processing/)
|
|
||||||
will be supported in the future.
|
|
||||||
It's really cool! :(far fa-grin-squint fa-fw):
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
## 2 Front Matter {#front-matter}
|
|
||||||
|
|
||||||
**Hugo** allows you to add front matter in `yaml`, `toml` or `json` to your content files.
|
|
||||||
|
|
||||||
{{< admonition >}}
|
|
||||||
**Not all** of the below front matters need to be set in each of your posts.
|
|
||||||
It is necessary only if the front matters and the `page` part in your [site configuration](../theme-documentation-basics#site-configuration) are inconsistent.
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
Here is a front matter example:
|
|
||||||
|
|
||||||
```yaml
|
|
||||||
---
|
|
||||||
title: "My First Post"
|
|
||||||
subtitle: ""
|
|
||||||
date: 2020-03-04T15:58:26+08:00
|
|
||||||
lastmod: 2020-03-04T15:58:26+08:00
|
|
||||||
draft: true
|
|
||||||
author: ""
|
|
||||||
authorLink: ""
|
|
||||||
description: ""
|
|
||||||
license: ""
|
|
||||||
images: []
|
|
||||||
|
|
||||||
tags: []
|
|
||||||
categories: []
|
|
||||||
featuredImage: ""
|
|
||||||
featuredImagePreview: ""
|
|
||||||
|
|
||||||
hiddenFromHomePage: false
|
|
||||||
hiddenFromSearch: false
|
|
||||||
twemoji: false
|
|
||||||
lightgallery: true
|
|
||||||
ruby: true
|
|
||||||
fraction: true
|
|
||||||
fontawesome: true
|
|
||||||
linkToMarkdown: true
|
|
||||||
rssFullText: false
|
|
||||||
|
|
||||||
toc:
|
|
||||||
enable: true
|
|
||||||
auto: true
|
|
||||||
code:
|
|
||||||
copy: true
|
|
||||||
# ...
|
|
||||||
math:
|
|
||||||
enable: true
|
|
||||||
# ...
|
|
||||||
mapbox:
|
|
||||||
accessToken: ""
|
|
||||||
# ...
|
|
||||||
share:
|
|
||||||
enable: true
|
|
||||||
# ...
|
|
||||||
comment:
|
|
||||||
enable: true
|
|
||||||
# ...
|
|
||||||
library:
|
|
||||||
css:
|
|
||||||
# someCSS = "some.css"
|
|
||||||
# located in "assets/"
|
|
||||||
# Or
|
|
||||||
# someCSS = "https://cdn.example.com/some.css"
|
|
||||||
js:
|
|
||||||
# someJS = "some.js"
|
|
||||||
# located in "assets/"
|
|
||||||
# Or
|
|
||||||
# someJS = "https://cdn.example.com/some.js"
|
|
||||||
seo:
|
|
||||||
images: []
|
|
||||||
# ...
|
|
||||||
---
|
|
||||||
```
|
|
||||||
|
|
||||||
* **title**: the title for the content.
|
|
||||||
* **subtitle**: {{< version 0.2.0 >}} the subtitle for the content.
|
|
||||||
* **date**: the datetime assigned to this page, which is usually fetched from the `date` field in front matter, but this behaviour is configurabl in the [site configuration](../theme-documentation-basics#site-configuration).
|
|
||||||
* **lastmod**: the datetime at which the content was last modified.
|
|
||||||
* **draft**: if `true`, the content will not be rendered unless the `--buildDrafts`/`-D` flag is passed to the `hugo` command.
|
|
||||||
* **author**: the author for the content.
|
|
||||||
* **authorLink**: the link of the author.
|
|
||||||
* **description**: the description for the content.
|
|
||||||
* **license**: the special lisence for this content.
|
|
||||||
* **images**: page images for Open Graph and Twitter Cards.
|
|
||||||
|
|
||||||
* **tags**: the tags for the content.
|
|
||||||
* **categories**: the categories for the content.
|
|
||||||
* **featuredImage**: the featured image for the content.
|
|
||||||
* **featuredImagePreview**: the featured image for the content preview in the home page.
|
|
||||||
|
|
||||||
* **hiddenFromHomePage**: if `true`, the content will not be shown in the home page.
|
|
||||||
* **hiddenFromSearch**: {{< version 0.2.0 >}} if `true`, the content will not be shown in the search results.
|
|
||||||
* **twemoji**: {{< version 0.2.0 >}} if `true`, the content will enable the twemoji.
|
|
||||||
* **lightgallery**: if `true`, images in the content will be shown as the gallery.
|
|
||||||
* **ruby**: {{< version 0.2.0 >}} if `true`, the content will enable the [ruby extended syntax](#ruby).
|
|
||||||
* **fraction**: {{< version 0.2.0 >}} if `true`, the content will enable the [fraction extended syntax](#fraction).
|
|
||||||
* **fontawesome**: {{< version 0.2.0 >}} if `true`, the content will enable the [Font Awesome extended syntax](#fontawesome).
|
|
||||||
* **linkToMarkdown**: if `true`, the footer of the content will be shown the link to the orignal Markdown file.
|
|
||||||
* **rssFullText**: {{< version 0.2.4 >}} if `true`, the full text content will be shown in RSS.
|
|
||||||
|
|
||||||
* **toc**: {{< version 0.2.9 changed >}} the same as the `params.page.toc` part in the [site configuration](../theme-documentation-basics#site-configuration).
|
|
||||||
* **code**: {{< version 0.2.0 >}} the same as the `params.page.code` part in the [site configuration](../theme-documentation-basics#site-configuration).
|
|
||||||
* **math**: {{< version 0.2.0 changed >}} the same as the `params.page.math` part in the [site configuration](../theme-documentation-basics#site-configuration).
|
|
||||||
* **mapbox**: {{< version 0.2.0 >}} the same as the `params.page.mapbox` part in the [site configuration](../theme-documentation-basics#site-configuration).
|
|
||||||
* **share**: the same as the `params.page.share` part in the [site configuration](../theme-documentation-basics#site-configuration).
|
|
||||||
* **comment**: {{< version 0.2.0 changed >}} the same as the `params.page.comment` part in the [site configuration](../theme-documentation-basics#site-configuration).
|
|
||||||
* **library**: {{< version 0.2.7 >}} the same as the `params.page.library` part in the [site configuration](../theme-documentation-basics#site-configuration).
|
|
||||||
* **seo**: {{< version 0.2.10 >}} the same as the `params.page.seo` part in the [site configuration](../theme-documentation-basics#site-configuration).
|
|
||||||
|
|
||||||
{{< admonition tip >}}
|
|
||||||
{{< version 0.2.10 >}}
|
|
||||||
|
|
||||||
**featuredImage** and **featuredImagePreview** support the complete usage of [local resource references](#contents-organization).
|
|
||||||
|
|
||||||
If the page resource with `name: featured-image` or `name: featured-image-preview` is set in the front matter,
|
|
||||||
it is not necessary to set the parameter `featuredImage` or `featuredImagePreview`:
|
|
||||||
|
|
||||||
```yaml
|
|
||||||
resources:
|
|
||||||
- name: featured-image
|
|
||||||
src: featured-image.jpg
|
|
||||||
- name: featured-image-preview
|
|
||||||
src: featured-image-preview.jpg
|
|
||||||
```
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
## 3 Content Summaries
|
|
||||||
|
|
||||||
**LoveIt** theme uses the summary of the content to display abstract information in the home page. Hugo can generate summaries of your content.
|
|
||||||
|
|
||||||
![Summary Preview](summary.png "Summary Preview")
|
|
||||||
|
|
||||||
### Automatic Summary Splitting
|
|
||||||
|
|
||||||
By default, Hugo automatically takes the first 70 words of your content as its summary.
|
|
||||||
|
|
||||||
You may customize the summary length by setting `summaryLength` in the [site configuration](../theme-documentation-basics#site-configuration).
|
|
||||||
|
|
||||||
If you are creating content in a [CJK]^(Chinese/Japanese/Korean) language and want to use Hugo’s automatic summary splitting, set `hasCJKLanguage` to `true` in your [site configuration](../theme-documentation-basics#site-configuration).
|
|
||||||
|
|
||||||
### Manual Summary Splitting
|
|
||||||
|
|
||||||
Alternatively, you may add the `<!--more-->` summary divider where you want to split the article.
|
|
||||||
|
|
||||||
Content that comes before the summary divider will be used as that content’s summary.
|
|
||||||
|
|
||||||
{{< admonition >}}
|
|
||||||
Be careful to enter `<!--more-->` exactly; i.e., all lowercase and with no whitespace.
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
### Front Matter Summary
|
|
||||||
|
|
||||||
You might want your summary to be something other than the text that starts the article. In this case you can provide a separate summary in the `summary` variable of the article front matter.
|
|
||||||
|
|
||||||
### Use Description as Summary
|
|
||||||
|
|
||||||
You might want your description in the `description` variable of the article front matter as the summary.
|
|
||||||
|
|
||||||
You may add the `<!--more-->` summary divider at the start of the article. Keep content that comes before the summary divider empty. Then **LoveIt** theme will use your description as the summary.
|
|
||||||
|
|
||||||
### Priority Order of Summary Selection
|
|
||||||
|
|
||||||
Because there are multiple ways in which a summary can be specified it is useful to understand the order. It is as follows:
|
|
||||||
|
|
||||||
1. If there is a `<!--more-->` summary divider present in the article but no content is before the divider, the description will be used as the summary.
|
|
||||||
2. If there is a `<!--more-->` summary divider present in the article the text up to the divider will be provided as per the manual summary split method.
|
|
||||||
3. If there is a summary variable in the article front matter the value of the variable will be provided as per the front matter summary method.
|
|
||||||
4. The text at the start of the article will be provided as per the automatic summary split method.
|
|
||||||
|
|
||||||
{{< admonition >}}
|
|
||||||
It is not recommended to include rich text block elements in the summary, which will cause typographic errors. Such as code blocks, pictures, tables, etc.
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
## 4 Basic Markdown Syntax
|
|
||||||
|
|
||||||
This part is shown in the [basic markdown syntax page](../basic-markdown-syntax/).
|
|
||||||
|
|
||||||
## 5 Extended Markdown Syntax {#extended-markdown-syntax}
|
|
||||||
|
|
||||||
**LoveIt** theme has some extended syntax elements for you to write articles.
|
|
||||||
|
|
||||||
### Emoji Support
|
|
||||||
|
|
||||||
This part is shown in the [emoji support page](../emoji-support/).
|
|
||||||
|
|
||||||
### Mathematical Formula
|
|
||||||
|
|
||||||
**LoveIt** theme supports mathematical formulas based on [$ \KaTeX $](https://katex.org/).
|
|
||||||
|
|
||||||
Set the property `enable = true` under `[params.math]` in your [site configuration](../theme-documentation-basics#site-configuration)
|
|
||||||
and the property `math: true` of the article front matter to enable the automatic rendering of mathematical formulas.
|
|
||||||
|
|
||||||
{{< admonition tip >}}
|
|
||||||
Here is a list of [$ \TeX $ functions supported by $ \KaTeX $](https://katex.org/docs/supported.html).
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
#### Block Formula
|
|
||||||
|
|
||||||
The default block delimiters are `$$`/`$$` and `\\[`/`\\]`:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
$$ c = \pm\sqrt{a^2 + b^2} $$
|
|
||||||
|
|
||||||
\\[ f(x)=\int_{-\infty}^{\infty} \hat{f}(\xi) e^{2 \pi i \xi x} d \xi \\]
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
$$ c = \pm\sqrt{a^2 + b^2} $$
|
|
||||||
|
|
||||||
\\[ f(x)=\int_{-\infty}^{\infty} \hat{f}(\xi) e^{2 \pi i \xi x} d \xi \\]
|
|
||||||
|
|
||||||
#### Inline Formula
|
|
||||||
|
|
||||||
The default inline delimiters are `$`/`$` and `\\(`/`\\)`:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
$ c = \pm\sqrt{a^2 + b^2} $ and \\( f(x)=\int_{-\infty}^{\infty} \hat{f}(\xi) e^{2 \pi i \xi x} d \xi \\)
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
$ c = \pm\sqrt{a^2 + b^2} $ and \\( f(x)=\int_{-\infty}^{\infty} \hat{f}(\xi) e^{2 \pi i \xi x} d \xi \\)
|
|
||||||
|
|
||||||
{{< admonition tip >}}
|
|
||||||
You can add more block and inline delimiters in your [site configuration](../theme-documentation-basics#site-configuration).
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
#### Copy-tex
|
|
||||||
|
|
||||||
**[Copy-tex](https://github.com/Khan/KaTeX/tree/master/contrib/copy-tex)** is an extension for **$ \KaTeX $**.
|
|
||||||
|
|
||||||
By the extension, when selecting and copying $ \KaTeX $ rendered elements, copies their $ \LaTeX $ source to the clipboard.
|
|
||||||
|
|
||||||
Set the property `copyTex = true` under `[params.math]` in your [site configuration](../theme-documentation-basics#site-configuration) to enable Copy-tex.
|
|
||||||
|
|
||||||
Select and copy the formula rendered in the previous section, and you can find that the copied content is the LaTeX source code.
|
|
||||||
|
|
||||||
#### mhchem
|
|
||||||
|
|
||||||
**[mhchem](https://github.com/Khan/KaTeX/tree/master/contrib/mhchem)** is an extension for **$ \KaTeX $**.
|
|
||||||
|
|
||||||
By the extension, you can write beautiful chemical equations easily in the article.
|
|
||||||
|
|
||||||
Set the property `mhchem = true` under `[params.math]` in your [site configuration](../theme-documentation-basics#site-configuration) to enable mhchem.
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
$$ \ce{CO2 + C -> 2 CO} $$
|
|
||||||
|
|
||||||
$$ \ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-} $$
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
$$ \ce{CO2 + C -> 2 CO} $$
|
|
||||||
|
|
||||||
$$ \ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-} $$
|
|
||||||
|
|
||||||
### Ruby Annotation {#ruby}
|
|
||||||
|
|
||||||
An extended Markdown syntax for **ruby annotation** is supported in **LoveIt** theme:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
[Hugo]{?^}(An open-source static site generator)
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
[Hugo]^(An open-source static site generator)
|
|
||||||
|
|
||||||
### Fraction {#fraction}
|
|
||||||
|
|
||||||
{{< version 0.2.0 >}}
|
|
||||||
|
|
||||||
An extended Markdown syntax for **fraction** is supported in **LoveIt** theme:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
[Light]{?/}[Dark]
|
|
||||||
|
|
||||||
[99]{?/}[100]
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
[Light]/[Dark]
|
|
||||||
|
|
||||||
[90]/[100]
|
|
||||||
|
|
||||||
### Font Awesome {#fontawesome}
|
|
||||||
|
|
||||||
**LoveIt** theme uses [Font Awesome](https://fontawesome.com/) as the icon library.
|
|
||||||
You can easily use these icons in your articles.
|
|
||||||
|
|
||||||
Get the `class` of icons you wanted from the [Font Awesome website](https://fontawesome.com/icons?d=gallery).
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
Gone camping! {?:}(fas fa-campground fa-fw): Be back soon.
|
|
||||||
|
|
||||||
That is so funny! {?:}(far fa-grin-tears):
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
Gone camping! :(fas fa-campground fa-fw): Be back soon.
|
|
||||||
|
|
||||||
That is so funny! :(far fa-grin-tears):
|
|
||||||
|
|
||||||
### Escape character {#escape-character}
|
|
||||||
|
|
||||||
In some special cases (when writing this theme documentation :(far fa-grin-squint-tears):),
|
|
||||||
your content will conflict with basic or extended Markdown syntax, and it is inevitable.
|
|
||||||
|
|
||||||
The escape character syntax can help you build the content you wanted:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
{{??}X} -> X
|
|
||||||
```
|
|
||||||
|
|
||||||
For example, two `:` will enable emoji syntax, which is not the behavior you want. The escape character syntax is like this:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
{{??}:}joy:
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
**{?:}joy{?:}** instead of **:joy:**
|
|
||||||
|
|
||||||
{{< admonition tip >}}
|
|
||||||
This is related to **[an issue for Hugo](https://github.com/gohugoio/hugo/issues/4978)**, which has not been resolved.
|
|
||||||
{{< /admonition >}}
|
|
||||||
|
|
||||||
Another example is:
|
|
||||||
|
|
||||||
```markdown
|
|
||||||
[link{{??}]}(#escape-character)
|
|
||||||
```
|
|
||||||
|
|
||||||
The rendered output looks like this:
|
|
||||||
|
|
||||||
**[link{?]}(#escape-character)** instead of **[link](#escape-character)**.
|
|
File diff suppressed because it is too large
Load diff
|
@ -1,3 +0,0 @@
|
||||||
---
|
|
||||||
title: "contenu"
|
|
||||||
---
|
|
8268
package-lock.json
generated
8268
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
@ -4,6 +4,7 @@
|
||||||
"description": "LoveIt theme source file",
|
"description": "LoveIt theme source file",
|
||||||
"private": true,
|
"private": true,
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
"@algolia/cli": "^4.0.8",
|
||||||
"@babel/cli": "^7.17.10",
|
"@babel/cli": "^7.17.10",
|
||||||
"@babel/core": "^7.17.10",
|
"@babel/core": "^7.17.10",
|
||||||
"@babel/preset-env": "^7.17.10",
|
"@babel/preset-env": "^7.17.10",
|
||||||
|
@ -17,7 +18,7 @@
|
||||||
"preinstall": "npx npm-force-resolutions",
|
"preinstall": "npx npm-force-resolutions",
|
||||||
"babel": "npx babel src/js --out-file assets/js/theme.js",
|
"babel": "npx babel src/js --out-file assets/js/theme.js",
|
||||||
"build": "npm run babel && hugo -v --source=exampleSite --themesDir ../.. --gc",
|
"build": "npm run babel && hugo -v --source=exampleSite --themesDir ../.. --gc",
|
||||||
"build-lunr-segmentit": "browserify src/lib/lunr.segmentit.js -o assets/lib/lunr/lunr.segmentit.js -t babelify --presets @babel/preset-env --presets minify",
|
"build-lunr-segmentit": "browserify src/lib/lunr/lunr.segmentit.js -o assets/lib/lunr/lunr.segmentit.js -t babelify --presets @babel/preset-env",
|
||||||
"start": "npm run babel && hugo server --source=exampleSite --themesDir ../.. -D --disableFastRender",
|
"start": "npm run babel && hugo server --source=exampleSite --themesDir ../.. -D --disableFastRender",
|
||||||
"start-production": "npm run babel && hugo server --source=exampleSite --themesDir ../.. -D --disableFastRender -e production",
|
"start-production": "npm run babel && hugo server --source=exampleSite --themesDir ../.. -D --disableFastRender -e production",
|
||||||
"check": "htmlproofer exampleSite/public --check-html --allow-hash-href --empty-alt-ignore --disable-external",
|
"check": "htmlproofer exampleSite/public --check-html --allow-hash-href --empty-alt-ignore --disable-external",
|
||||||
|
|
Loading…
Reference in a new issue