diff --git a/assets/css/_page/_single.scss b/assets/css/_page/_single.scss index 6d550cc..eaaf532 100644 --- a/assets/css/_page/_single.scss +++ b/assets/css/_page/_single.scss @@ -52,6 +52,16 @@ } .content { + .person-mention.h-card { + display: inline-block; + img { + vertical-align: -12%; + max-height: 1.1em; + margin-right: 0ex; + border-radius: 50%; + } + } + > h2 { font-size: 1.5rem; diff --git a/exampleSite/content/posts/theme-documentation-extended-shortcodes/index.en.md b/exampleSite/content/posts/theme-documentation-extended-shortcodes/index.en.md index cfb2220..b5281f5 100644 --- a/exampleSite/content/posts/theme-documentation-extended-shortcodes/index.en.md +++ b/exampleSite/content/posts/theme-documentation-extended-shortcodes/index.en.md @@ -2,7 +2,7 @@ weight: 4 title: "Theme Documentation - Extended Shortcodes" date: 2020-03-03T16:29:41+08:00 -lastmod: 2020-03-03T16:29:41+08:00 +lastmod: 2020-06-12T09:32:15+03:00 draft: false author: "Dillon" authorLink: "https://dillonzq.com" @@ -1293,3 +1293,41 @@ You can see the output in the console of the developer tool. {{< script >}} console.log('Hello LoveIt!'); {{< /script >}} + +## 12 person + +`person` is a shortcode to insert a link to a personal webpage marked up as [h-card](http://microformats.org/wiki/h-card). + +The `person` shortcode takes the following parameters (all of these are optional, but it makes no sense to omit the first two): + +* **url** (**first** positional parameter) + + URL of the personal page. + +* **name** (**second** positional parameter) + + Name of the person. + +* **text** (**third** positional parameter) + + Text to display as hover tooltip of the link. + +* **picture** (**fourth** positional parameter) + + A picture to use as person's avatar. + +Example `person` input: + +```markdown +{{}} +``` + +This renders as {{< person url="https://evgenykuznetsov.org" name="Evgeny Kuznetsov" text="author of this shortcode" picture="https://evgenykuznetsov.org/img/avatar.jpg" >}}. + +Without an explicitly given picture, a generic icon is used. This input: + +```markdown +{{}} +``` + +renders as {{< person "https://dillonzq.com/" Dillon "author of the LoveIt theme" >}}. \ No newline at end of file diff --git a/layouts/partials/plugin/h-card.html b/layouts/partials/plugin/h-card.html new file mode 100644 index 0000000..ee5cea9 --- /dev/null +++ b/layouts/partials/plugin/h-card.html @@ -0,0 +1,15 @@ +{{- $rel := .Rel -}} +{{- $nick := .Nickname -}} +{{- $text := .Text -}} +{{- $n := .Nickname | default .Name | default .Email | default .URL | default "👀" -}} + +{{- with .URL -}}{{- else -}}{{- with .Email -}}{{- end -}}{{- end -}} +{{- with .Image -}}{{ $n }}{{- else -}}{{ end -}}  +{{- with .Name -}}{{ . }}{{ with $nick }} ({{- end -}}{{- end -}} +{{- with .Nickname -}}{{ . }}{{- end -}} +{{- with .Name -}}{{ with $nick }}){{- end -}}{{- end -}} +{{- with .URL -}}{{- else -}}{{- with .Email -}}{{- end -}}{{- end -}} +{{- with .Email }} + {{ . }} +{{- end -}} + \ No newline at end of file diff --git a/layouts/shortcodes/person.html b/layouts/shortcodes/person.html new file mode 100644 index 0000000..1ac6ca0 --- /dev/null +++ b/layouts/shortcodes/person.html @@ -0,0 +1,5 @@ +{{- $url := cond .IsNamedParams (.Get "url") (.Get 0) -}} +{{- $name := cond .IsNamedParams (.Get "name") (.Get 1) -}} +{{- $text := cond .IsNamedParams (.Get "text") (.Get 2) -}} +{{- $pic := cond .IsNamedParams (.Get "picture") (.Get 3) -}} +{{- $p := dict "Class" "person-mention" "Name" $name "URL" $url "Text" $text "Image" $pic -}}{{- partial "plugin/h-card" $p -}}