alyenc/hugo-theme-next
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add author's avatar image settings.

Browse Source
This commit is contained in:
凡梦星尘 2022-05-06 22:42:09 +08:00
parent a1393183b9
commit bb482faeec
7 changed files with 44 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
assets/css/style.css
View File

@ -1,11 +1,16 @@
/** User-defined style. **/ /** User-defined style. **/
{{- $P := .Site.Params -}}
.sidebar { .sidebar {
visibility: inherit; visibility: inherit;
} }
.site-author-image { .site-author-image {
{{ if $P.avatar.rounded }}
border-radius:50%; border-radius:50%;
{{ end }}
{{ if $P.avatar.rotated }}
transition: transform 1s ease-out;
{{ end }}
} }
.back-to-top { .back-to-top {

9
exampleSite/config.yaml
View File

@ -68,5 +68,12 @@ params:
# No setting is required here and can be done by multilanguage # No setting is required here and can be done by multilanguage
# language: deed.zh # language: deed.zh
# Sidebar Avatar
avatar:
# Replace the default image and set the url here.
url: /imgs/hugo-next-avatar.png
# If true, the avatar will be displayed in circle.
rounded: true
# If true, the avatar will be rotated with the cursor.
rotated: true

21
layouts/_default/baseof.html
View File

@ -1,8 +1,27 @@
{{ $langCode := replaceRE "-([a-z]+)" (upper (substr .Site.Language -3)) .Site.Language }} {{ $langCode := replaceRE "-([a-z]+)" (upper (substr .Site.Language -3)) .Site.Language }}
{{ $P := .Site.Params }}
<!DOCTYPE html> <!DOCTYPE html>
<html lang="{{ $langCode }}"> <html lang="{{ $langCode }}">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<meta name="generator" content="Hugo v{{ hugo.Version }}">
{{ partial "partials/head.html" (dict "Page" . "langCode" $langCode) }} {{ partial "partials/head.html" . }}
<link rel="canonical" href="{{ .Site.BaseURL }}">
<link rel="shortcut icon" type="image/x-icon" href="{{ $P.favicon.icon }}">
<link rel="icon" type="image/x-icon" href="{{ $P.favicon.icon }}">
<link rel="icon" type="image/png" sizes="16x16" href="{{ $P.favicon.small }}">
<link rel="icon" type="image/png" sizes="32x32" href="{{ $P.favicon.medium }}">
<link rel="apple-touch-icon" sizes="180x180" href="{{ $P.favicon.appleTouchIcon }}">
<link rel="stylesheet" href="/css/main.css">
{{- $style := resources.Get "css/style.css" | resources.ExecuteAsTemplate "css/style.css" . -}}
<link rel="stylesheet" href="{{ $style.RelPermalink }}">
<title>{{ .Site.Title }}</title>
</head>
<body itemscope itemtype="http://schema.org/WebPage" {{/*class="use-motion"*/}}> <body itemscope itemtype="http://schema.org/WebPage" {{/*class="use-motion"*/}}>
<div class="headband"></div> <div class="headband"></div>

37
layouts/partials/head.html
View File

@ -1,30 +1,9 @@
{{ $Site := .Page.Site }} <meta property="og:type" content="website">
{{ $Params := $Site.Params }} <meta property="og:title" content="Hugo">
<head> <meta property="og:url" content="{{ .Site.BaseURL }}">
<meta charset="UTF-8"> <meta property="og:site_name" content="Hugo">
<meta name="viewport" content="width=device-width"> {{/*<meta property="og:locale" content="{{ .langCode }}">*/}}
<meta name="generator" content="Hugo v{{ hugo.Version }}"> <meta property="article:author" content="{{ .Site.Params.author }}">
<meta property="og:type" content="website"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.1.1/css/all.min.css" integrity="sha256-DfWjNxDkM94fVBWx1H5BMMp0Zq7luBlV8QRcSES7s+0=" crossorigin="anonymous">
<meta property="og:title" content="Hugo"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/animate.css@3.1.1/animate.min.css" integrity="sha256-PR7ttpcvz8qrF57fur/yAx1qXMFJeJFiA6pSzWi0OIE=" crossorigin="anonymous">
<meta property="og:url" content="{{ $Site.BaseURL }}">
<meta property="og:site_name" content="Hugo">
<meta property="og:locale" content="{{ .langCode }}">
<meta property="article:author" content="{{ $Params.author }}">
<link rel="canonical" href="{{ $Site.BaseURL }}">
<link rel="shortcut icon" type="image/x-icon" href="{{ $Params.favicon.icon }}">
<link rel="icon" type="image/x-icon" href="{{ $Params.favicon.icon }}">
<link rel="icon" type="image/png" sizes="16x16" href="{{ $Params.favicon.small }}">
<link rel="icon" type="image/png" sizes="32x32" href="{{ $Params.favicon.medium }}">
<link rel="apple-touch-icon" sizes="180x180" href="{{ $Params.favicon.appleTouchIcon }}">
<link rel="stylesheet" href="/css/main.css">
{{ $style := resources.Get "css/style.css" | resources.ExecuteAsTemplate "css/style.css" . -}}
<link rel="stylesheet" href="{{ $style.RelPermalink }}">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.1.1/css/all.min.css" integrity="sha256-DfWjNxDkM94fVBWx1H5BMMp0Zq7luBlV8QRcSES7s+0=" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/animate.css@3.1.1/animate.min.css" integrity="sha256-PR7ttpcvz8qrF57fur/yAx1qXMFJeJFiA6pSzWi0OIE=" crossorigin="anonymous">
<title>{{ $Site.Title }}</title>
</head>

16
layouts/partials/header.html
View File

@ -46,7 +46,7 @@
<div class="site-overview-wrap sidebar-panel"> <div class="site-overview-wrap sidebar-panel">
<div class="site-author site-overview-item animated" itemprop="author" itemscope itemtype="http://schema.org/Person"> <div class="site-author site-overview-item animated" itemprop="author" itemscope itemtype="http://schema.org/Person">
<img class="site-author-image" itemprop="image" alt="John Doe" src="/imgs/hugo-next-avator.png"> <img class="site-author-image" itemprop="image" alt="John Doe" src="{{ .Site.Params.avatar.url }}">
<p class="site-author-name" itemprop="name">{{ .Site.Params.author }}</p> <p class="site-author-name" itemprop="name">{{ .Site.Params.author }}</p>
<div class="site-description" itemprop="description">{{ .Site.Params.description }}</div> <div class="site-description" itemprop="description">{{ .Site.Params.description }}</div>
</div> </div>
@ -80,19 +80,7 @@
</span> </span>
<span class="links-of-author-item"> <span class="links-of-author-item">
<a href="mailto:yourname@gmail.com" title="E-Mail → mailto:yourname@gmail.com" rel="noopener" target="_blank"><i class="fa fa-envelope fa-fw"></i>E-Mail</a> <a href="mailto:yourname@gmail.com" title="E-Mail → mailto:yourname@gmail.com" rel="noopener" target="_blank"><i class="fa fa-envelope fa-fw"></i>E-Mail</a>
</span> </span>
<span class="links-of-author-item">
<a href="https://weibo.com/yourname" title="Weibo → https:&#x2F;&#x2F;weibo.com&#x2F;yourname" rel="noopener" target="_blank"><i class="fab fa-weibo fa-fw"></i>Weibo</a>
</span>
<span class="links-of-author-item">
<a href="https://plus.google.com/yourname" title="Google → https:&#x2F;&#x2F;plus.google.com&#x2F;yourname" rel="noopener" target="_blank"><i class="fab fa-google fa-fw"></i>Google</a>
</span>
<span class="links-of-author-item">
<a href="https://twitter.com/yourname" title="Twitter → https:&#x2F;&#x2F;twitter.com&#x2F;yourname" rel="noopener" target="_blank"><i class="fab fa-twitter fa-fw"></i>Twitter</a>
</span>
<span class="links-of-author-item">
<a href="https://www.facebook.com/yourname" title="FB Page → https:&#x2F;&#x2F;www.facebook.com&#x2F;yourname" rel="noopener" target="_blank"><i class="fab fa-facebook fa-fw"></i>FB Page</a>
</span>
</div> </div>
{{ $cc := .Site.Params.creativeCommons }} {{ $cc := .Site.Params.creativeCommons }}
{{ if and $cc $cc.sidebar }} {{ if and $cc $cc.sidebar }}

2
static/css/main.css
View File

@ -1277,8 +1277,6 @@ pre code {
border: 1px solid #eee; border: 1px solid #eee;
max-width: 120px; max-width: 120px;
padding: 2px; padding: 2px;
border-radius: 50%;
transition: transform 1s ease-out;
} }
.site-author-image:hover { .site-author-image:hover {
transform: rotateZ(360deg); transform: rotateZ(360deg);

0
static/imgs/hugo-next-avator.png → static/imgs/hugo-next-avatar.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB