feat(content): support complete local resource references (#388)

This commit is contained in:
Dillon
2020-05-28 17:05:37 +08:00
committed by GitHub
parent 0c1f7d0ef8
commit aa48df5edd
93 changed files with 872 additions and 714 deletions

View File

@@ -7,12 +7,14 @@ draft: false
author: "Dillon"
authorLink: "https://dillonzq.com"
description: "LoveIt theme provides multiple shortcodes on top of built-in ones in Hugo."
images: ["/images/theme-documentation-extended-shortcodes/featured-image-preview.jpg"]
resources:
- name: "featured-image"
src: "featured-image.jpg"
- name: "featured-image-preview"
src: "featured-image-preview.jpg"
tags: ["shortcodes"]
categories: ["documentation"]
featuredImage: "/images/theme-documentation-extended-shortcodes/featured-image.jpg"
featuredImagePreview: "/images/theme-documentation-extended-shortcodes/featured-image-preview.jpg"
lightgallery: true
---
@@ -59,6 +61,8 @@ This is a **right-aligned** paragraph.
`link` shortcode is an alternative to [Markdown link syntax](../basic-markdown-syntax#links). `link` shortcode can provide some other features and can be used in code blocks.
{{< version 0.2.10 >}} The complete usage of [local resource references](../theme-documentation-content#contents-organization) is supported.
The `link` shortcode has the following named parameters:
* **href** *[required]* (**first** positional parameter)
@@ -123,6 +127,8 @@ The rendered output looks like this (hover over the link, there should be a tool
`image` shortcode is an alternative to [`figure` shortcode](../theme-documentation-built-in-shortcodes#figure). `image` shortcode can take full advantage of the dependent libraries of [lazysizes](https://github.com/aFarkas/lazysizes) and [lightgallery.js](https://github.com/sachinchoolur/lightgallery.js).
{{< version 0.2.10 >}} The complete usage of [local resource references](../theme-documentation-content#contents-organization) is supported.
The `image` shortcode has the following named parameters:
* **src** *[required]* (**first** positional parameter)
@@ -173,19 +179,15 @@ The `image` shortcode has the following named parameters:
Additional `rel` attributes of the HTML `a` tag, if **linked** parameter is set to `true`.
* **large** *[optional]*
Whether the image is large used for loading animation, if **linked** parameter is set to `false`.
Example `image` input:
```markdown
{{</* image src="/images/theme-documentation-extended-shortcodes/lighthouse.jpg" caption="Lighthouse (`image`)" src-s="/images/theme-documentation-extended-shortcodes/lighthouse-small.jpg" src-l="/images/theme-documentation-extended-shortcodes/lighthouse-large.jpg" */>}}
{{</* image src="/images/lighthouse.jpg" caption="Lighthouse (`image`)" src_s="/images/lighthouse-small.jpg" src_l="/images/lighthouse-large.jpg" */>}}
```
The rendered output looks like this:
{{< image src="/images/theme-documentation-extended-shortcodes/lighthouse.jpg" caption="Lighthouse (`image`)" src-s="/images/theme-documentation-extended-shortcodes/lighthouse-small.jpg" src-l="/images/theme-documentation-extended-shortcodes/lighthouse-large.jpg" >}}
{{< image src="/images/lighthouse.jpg" caption="Lighthouse (`image`)" src_s="/images/lighthouse-small.jpg" src_l="/images/lighthouse-large.jpg" >}}
## 4 admonition
@@ -997,6 +999,8 @@ There are three ways to use it the `music` shortcode.
### 8.1 Custom Music URL {#custom-music-url}
{{< version 0.2.10 >}} The complete usage of [local resource references](../theme-documentation-content#contents-organization) is supported.
The `music` shortcode has the following named parameters by custom music URL:
* **server** *[required]*
@@ -1018,12 +1022,12 @@ The `music` shortcode has the following named parameters by custom music URL:
Example `music` input by custom music URL:
```markdown
{{</* music url="/music/Wavelength.mp3" name=Wavelength artist=oldmanyoung cover="/images/theme-documentation-extended-shortcodes/Wavelength.jpg" */>}}
{{</* music url="/music/Wavelength.mp3" name=Wavelength artist=oldmanyoung cover="/images/Wavelength.jpg" */>}}
```
The rendered output looks like this:
{{< music url="/music/Wavelength.mp3" name=Wavelength artist=oldmanyoung cover="/images/theme-documentation-extended-shortcodes/Wavelength.jpg" >}}
{{< music url="/music/Wavelength.mp3" name=Wavelength artist=oldmanyoung cover="/images/Wavelength.jpg" >}}
### 8.2 Music Platform URL Automatic Identification {#automatic-identification}