diff options
author | Jimmy Cai <github@jimmycai.com> | 2021-12-28 13:28:20 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-12-28 13:28:20 +0300 |
commit | 455e23f22b796c900568d1b772e5af68ede95604 (patch) | |
tree | bb079b62085b9d3bd20aecff310f7b195dac8d75 | |
parent | 4e2c8e74be959cbaba3247349d2f4235c05ccaa2 (diff) |
feat: page links (#446)
-rw-r--r-- | exampleSite/content/page/links/index.md | 37 | ||||
-rw-r--r-- | exampleSite/content/page/links/ts-logo-128.jpg | bin | 0 -> 2071 bytes | |||
-rw-r--r-- | layouts/_default/single.html | 4 | ||||
-rw-r--r-- | layouts/partials/article/components/links.html | 26 |
4 files changed, 67 insertions, 0 deletions
diff --git a/exampleSite/content/page/links/index.md b/exampleSite/content/page/links/index.md new file mode 100644 index 0000000..9e29bf3 --- /dev/null +++ b/exampleSite/content/page/links/index.md @@ -0,0 +1,37 @@ +--- +title: Links +links: + - title: GitHub + description: GitHub is the world's largest software development platform. + website: https://github.com + image: https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png + - title: TypeScript + description: TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. + website: https://www.typescriptlang.org + image: ts-logo-128.jpg +menu: + main: + weight: -50 + params: + icon: link + +comments: false +--- + +To use this feature, add `links` section to frontmatter. + +This page's frontmatter: + +```yaml +links: + - title: GitHub + description: GitHub is the world's largest software development platform. + website: https://github.com + image: https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png + - title: TypeScript + description: TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. + website: https://www.typescriptlang.org + image: ts-logo-128.jpg +``` + +`image` field accepts both local and external images.
\ No newline at end of file diff --git a/exampleSite/content/page/links/ts-logo-128.jpg b/exampleSite/content/page/links/ts-logo-128.jpg Binary files differnew file mode 100644 index 0000000..85e3323 --- /dev/null +++ b/exampleSite/content/page/links/ts-logo-128.jpg diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 8b21c52..8ce42e9 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -15,6 +15,10 @@ {{ define "main" }} {{ partial "article/article.html" . }} + {{ if .Params.links }} + {{ partial "article/components/links" . }} + {{ end }} + {{ partial "article/components/related-contents" . }} {{ if not (eq .Params.comments false) }} diff --git a/layouts/partials/article/components/links.html b/layouts/partials/article/components/links.html new file mode 100644 index 0000000..118dbb3 --- /dev/null +++ b/layouts/partials/article/components/links.html @@ -0,0 +1,26 @@ +<div class="article-list--compact links"> + {{ range $i, $link := .Params.links }} + <article> + <a href="{{ $link.website }}" target="_blank" rel="noopener"> + <div class="article-details"> + <h2 class="article-title"> + {{- $link.title -}} + </h2> + <footer class="article-time"> + {{ with $link.description }} + {{ . }} + {{ else }} + {{ $link.website }} + {{ end }} + </footer> + </div> + + {{ with $link.image }} + <div class="article-image"> + <img src="{{ . }}" loading="lazy"> + </div> + {{ end }} + </a> + </article> + {{ end }} +</div>
\ No newline at end of file |