github
/
halo-theme-hao
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

图片懒加载-加载图片

This commit is contained in:
1152958806@qq.com 2023-08-19 19:04:26 +08:00
parent 01f9f69254
commit a3c60e83ca
15 changed files with 67 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
settings.yaml
View File

@ -2667,14 +2667,25 @@ spec:
value: value:
enable: true enable: true
errorImg: "/themes/theme-hao/assets/images/404.gif" errorImg: "/themes/theme-hao/assets/images/404.gif"
loadingImg: /themes/theme-hao/assets/images/404s.gif
children: children:
- $formkit: radio - $formkit: radio
name: enable name: enable
id: enable
key: enable
options: options:
- label: 启用 - label: 启用
value: true value: true
- label: 禁用 - label: 禁用
value: false value: false
- $formkit: attachment
name: loadingImg
id: loadingImg
key: loadingImg
if: $get(enable).value
label: 加载图片
validation: required
placeholder: 请输入图片 url
- $formkit: attachment - $formkit: attachment
name: errorImg name: errorImg
label: 图片加载失败图 label: 图片加载失败图

4
templates/album.html
View File

@ -25,7 +25,7 @@
<div class="card" th:onclick="go([[${group.metadata.name}]])"> <div class="card" th:onclick="go([[${group.metadata.name}]])">
<img class="card_cover" <img class="card_cover"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : #annotations.get(group, 'cover')}" th:src="${isLazyload ? loadingImg : #annotations.get(group, 'cover')}"
th:data-lazy-src="${ isLazyload ? #annotations.get(group, 'cover') : ''}" th:data-lazy-src="${ isLazyload ? #annotations.get(group, 'cover') : ''}"
> >
<div class="card__content"> <div class="card__content">
@ -46,7 +46,7 @@
<figure class="gallery-group"> <figure class="gallery-group">
<img class="gallery-group-img no-lightbox" <img class="gallery-group-img no-lightbox"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : #annotations.get(group, 'cover')}" th:src="${isLazyload ? loadingImg : #annotations.get(group, 'cover')}"
th:data-lazy-src="${ isLazyload ? #annotations.get(group, 'cover') : ''}" th:data-lazy-src="${ isLazyload ? #annotations.get(group, 'cover') : ''}"
alt="Group Image Gallery"> alt="Group Image Gallery">

2
templates/macro/bangumi-item.html
View File

@ -4,7 +4,7 @@
<div class="bangumi-item"> <div class="bangumi-item">
<div class="bangumi-picture"> <div class="bangumi-picture">
<img <img
th:src="${isLazyload ? dataImage : spec.cover}" th:src="${isLazyload ? loadingImg : spec.cover}"
th:data-lazy-src="${ isLazyload ? spec.cover : ''}" th:data-lazy-src="${ isLazyload ? spec.cover : ''}"
referrerpolicy="no-referrer" width="110" referrerpolicy="no-referrer" width="110"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"

14
templates/macro/content-links.html
View File

@ -25,7 +25,7 @@
th:title="${linkOdd.spec.displayName}" th:title="${linkOdd.spec.displayName}"
th:with="linkOdd = ${group.links.get(iterStat.index - 1)}"> th:with="linkOdd = ${group.links.get(iterStat.index - 1)}">
<img th:with=" img = @{${linkOdd.spec.logo}}" <img th:with=" img = @{${linkOdd.spec.logo}}"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:title="${linkOdd.spec.displayName}"> th:title="${linkOdd.spec.displayName}">
@ -33,7 +33,7 @@
<a class="tags-group-icon" target="_blank" th:href="${linkEven.spec.url}" <a class="tags-group-icon" target="_blank" th:href="${linkEven.spec.url}"
th:title="${linkEven.spec.displayName}" th:with="linkEven = ${link}"> th:title="${linkEven.spec.displayName}" th:with="linkEven = ${link}">
<img th:with="img = @{${linkEven.spec.logo}}" <img th:with="img = @{${linkEven.spec.logo}}"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:title="${linkEven.spec.displayName}"> th:title="${linkEven.spec.displayName}">
@ -97,7 +97,7 @@
<img class="flink-avatar" style="pointer-events: none;" th:alt="${link.spec.displayName}" <img class="flink-avatar" style="pointer-events: none;" th:alt="${link.spec.displayName}"
th:with="img = @{${#strings.isEmpty(#annotations.get(link, 'siteshot')) ? link.spec.logo : #annotations.get(link,'siteshot') }}" th:with="img = @{${#strings.isEmpty(#annotations.get(link, 'siteshot')) ? link.spec.logo : #annotations.get(link,'siteshot') }}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}"> th:data-lazy-src="${ isLazyload ? img : ''}">
</a> </a>
@ -106,7 +106,7 @@
<div class="site-card-avatar"> <div class="site-card-avatar">
<img class="flink-avatar cf-friends-avatar" th:alt="${link.spec.displayName}" <img class="flink-avatar cf-friends-avatar" th:alt="${link.spec.displayName}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : link.spec.logo}" th:src="${isLazyload ? loadingImg : link.spec.logo}"
th:data-lazy-src="${ isLazyload ? link.spec.logo : ''}"> th:data-lazy-src="${ isLazyload ? link.spec.logo : ''}">
</div> </div>
<div class="site-card-text"> <div class="site-card-text">
@ -130,14 +130,14 @@
th:title="${link.spec.displayName}"> th:title="${link.spec.displayName}">
<img class="flink-avatar cf-friends-avatar" th:alt="${link.spec.displayName}" <img class="flink-avatar cf-friends-avatar" th:alt="${link.spec.displayName}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : link.spec.logo}" th:src="${isLazyload ? loadingImg : link.spec.logo}"
th:data-lazy-src="${ isLazyload ? link.spec.logo : ''}"> th:data-lazy-src="${ isLazyload ? link.spec.logo : ''}">
<div class="flink-item-info"> <div class="flink-item-info">
<span class="flink-item-name cf-friends-name" th:text="${link.spec.displayName}"></span> <span class="flink-item-name cf-friends-name" th:text="${link.spec.displayName}"></span>
<span class="flink-item-desc" th:text="${link.spec.description}" <span class="flink-item-desc" th:text="${link.spec.description}"
th:title="${link.spec.description}"></span> th:title="${link.spec.description}"></span>
<img th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" <img th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : link.spec.logo}" th:src="${isLazyload ? loadingImg : link.spec.logo}"
th:data-lazy-src="${ isLazyload ? link.spec.logo : ''}"> th:data-lazy-src="${ isLazyload ? link.spec.logo : ''}">
</div> </div>
</a> </a>
@ -151,7 +151,7 @@
th:title="${link.spec.displayName}"> th:title="${link.spec.displayName}">
<img class="flink-avatar cf-friends-avatar" <img class="flink-avatar cf-friends-avatar"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : link.spec.logo}" th:src="${isLazyload ? loadingImg : link.spec.logo}"
th:data-lazy-src="${ isLazyload ? link.spec.logo : ''}" th:data-lazy-src="${ isLazyload ? link.spec.logo : ''}"
th:alt="${link.spec.displayName}"> th:alt="${link.spec.displayName}">
<div class="img-alt is-center">[[${link.spec.displayName}]]</div> <div class="img-alt is-center">[[${link.spec.displayName}]]</div>

2
templates/modules/layouts/layout.html
View File

@ -6,7 +6,7 @@
theme_version = ${ theme.config.other.staticResource.use == 'local' ? '?v='+ theme.spec.version : ''}, theme_version = ${ theme.config.other.staticResource.use == 'local' ? '?v='+ theme.spec.version : ''},
errorImg = @{${theme.config.other.vanillaLazyload.errorImg}}, errorImg = @{${theme.config.other.vanillaLazyload.errorImg}},
isLazyload = ${theme.config.other.vanillaLazyload.enable}, isLazyload = ${theme.config.other.vanillaLazyload.enable},
dataImage = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'"> loadingImg = ${theme.config.other.vanillaLazyload.loadingImg}">
<!-- head 中自定义的 --> <!-- head 中自定义的 -->

2
templates/modules/post-list.html
View File

@ -20,7 +20,7 @@
th:alt="${post.spec.title}" th:alt="${post.spec.title}"
th:attr="onerror='this.onerror=null;this.src=\''+@{${errorImg}}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+@{${errorImg}}+'\''"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
th:src="${isLazyload ? dataImage : img}"> th:src="${isLazyload ? loadingImg : img}">
</a> </a>
</div> </div>
<!-- 类别非空时 --> <!-- 类别非空时 -->

4
templates/modules/post/relatedPosts.html
View File

@ -19,7 +19,7 @@ containsTitle = ${#strings.contains(recommandPosts,post.spec.title)}">
<img alt="cover" class="cover" id="preimg" <img alt="cover" class="cover" id="preimg"
th:with="img = ${#strings.isEmpty(recommandPost.spec.cover) ? theme.config.layout.postRandomImg : recommandPost.spec.cover}" th:with="img = ${#strings.isEmpty(recommandPost.spec.cover) ? theme.config.layout.postRandomImg : recommandPost.spec.cover}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}"> th:data-lazy-src="${ isLazyload ? img : ''}">
<div class="content is-center"> <div class="content is-center">
<div class="date" style="color: white"><i class="far fa-calendar-alt fa-fw"></i> <div class="date" style="color: white"><i class="far fa-calendar-alt fa-fw"></i>
@ -40,7 +40,7 @@ containsTitle = ${#strings.contains(recommandPosts,post.spec.title)}">
<img class="cover" alt="cover" <img class="cover" alt="cover"
th:with="img = ${#strings.isEmpty(recommandPost.spec.cover) ? theme.config.layout.postRandomImg : recommandPost.spec.cover}" th:with="img = ${#strings.isEmpty(recommandPost.spec.cover) ? theme.config.layout.postRandomImg : recommandPost.spec.cover}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}"> th:data-lazy-src="${ isLazyload ? img : ''}">
<div class="content is-center"> <div class="content is-center">
<div class="date"><i class="far fa-calendar-alt fa-fw"></i> <div class="date"><i class="far fa-calendar-alt fa-fw"></i>

2
templates/modules/widgets/about-widgets/game.html
View File

@ -41,7 +41,7 @@
<div class="comic-item-cover"><img <div class="comic-item-cover"><img
th:with="img = @{${comic.bg}}" th:with="img = @{${comic.bg}}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
th:alt="${comic.title}" th:alt="${comic.title}"
draggable="false" > draggable="false" >

4
templates/modules/widgets/aside/friend-link.html
View File

@ -18,7 +18,7 @@
class="card-friend-item online-friend-link" th:href="${link.spec.url}" th:title="${link.spec.displayName}" class="card-friend-item online-friend-link" th:href="${link.spec.url}" th:title="${link.spec.displayName}"
target="_blank"><img class="no-lightbox card-friend-avatar" target="_blank"><img class="no-lightbox card-friend-avatar"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : link.spec.logo}" th:src="${isLazyload ? loadingImg : link.spec.logo}"
th:data-lazy-src="${ isLazyload ? link.spec.logo : ''}" th:data-lazy-src="${ isLazyload ? link.spec.logo : ''}"
th:alt="${link.spec.displayName}"> th:alt="${link.spec.displayName}">
<div class="card-friend-details"> <div class="card-friend-details">
@ -37,7 +37,7 @@
class="card-friend-item offline-friend-link" th:href="${link.spec.url}" th:title="${link.spec.displayName}" class="card-friend-item offline-friend-link" th:href="${link.spec.url}" th:title="${link.spec.displayName}"
target="_blank"><img class="no-lightbox card-friend-avatar" target="_blank"><img class="no-lightbox card-friend-avatar"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : link.spec.logo}" th:src="${isLazyload ? loadingImg : link.spec.logo}"
th:data-lazy-src="${ isLazyload ? link.spec.logo : ''}" th:data-lazy-src="${ isLazyload ? link.spec.logo : ''}"
th:alt="${link.spec.displayName}"> th:alt="${link.spec.displayName}">
<div class="card-friend-details"> <div class="card-friend-details">

6
templates/modules/widgets/aside/profile.html
View File

@ -15,7 +15,7 @@
<img class="avatar-img" <img class="avatar-img"
th:with=" img = @{${#strings.isEmpty(site.logo) ? assets_link + '/images/hao-logo.jpg' : site.logo}}" th:with=" img = @{${#strings.isEmpty(site.logo) ? assets_link + '/images/hao-logo.jpg' : site.logo}}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}"> th:data-lazy-src="${ isLazyload ? img : ''}">
</div> </div>
<div class="author-info__name" th:if="${#strings.isEmpty(theme.config.sidebar.profile.profileName)}" <div class="author-info__name" th:if="${#strings.isEmpty(theme.config.sidebar.profile.profileName)}"
@ -147,13 +147,13 @@
<img class="avatar-img" alt="avatar" <img class="avatar-img" alt="avatar"
th:with="img = @{${#strings.isEmpty(site.logo) ? assets_link + '/images/hao-logo.jpg' : site.logo}}" th:with="img = @{${#strings.isEmpty(site.logo) ? assets_link + '/images/hao-logo.jpg' : site.logo}}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}"> th:data-lazy-src="${ isLazyload ? img : ''}">
<div class="avatar-sticker"> <div class="avatar-sticker">
<img class="avatar-sticker-img" alt="avatar" <img class="avatar-sticker-img" alt="avatar"
th:with="img = @{${theme.config.sidebar.profile.stickerImg}}" th:with="img = @{${theme.config.sidebar.profile.stickerImg}}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}"> th:data-lazy-src="${ isLazyload ? img : ''}">
</div> </div>
</div> </div>

2
templates/modules/widgets/aside/recent-posts.html
View File

@ -10,7 +10,7 @@
<img th:alt="${post.spec.title}" <img th:alt="${post.spec.title}"
th:with="img = ${#strings.isEmpty(post.spec.cover) ? postRandomImg+post.spec.title : post.spec.cover}" th:with="img = ${#strings.isEmpty(post.spec.cover) ? postRandomImg+post.spec.title : post.spec.cover}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}"> th:data-lazy-src="${ isLazyload ? img : ''}">
</a> </a>
<div class="content"> <div class="content">

60
templates/modules/widgets/banner-group.html
View File

@ -22,7 +22,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/AfterEffect.png'}" th:with=" img = ${assets_link + '/images/icons/AfterEffect.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="AfterEffect"> title="AfterEffect">
</div> </div>
@ -30,7 +30,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Sketch.png'}" th:with=" img = ${assets_link + '/images/icons/Sketch.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Sketch"> title="Sketch">
</div> </div>
@ -40,7 +40,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Docker.png'}" th:with=" img = ${assets_link + '/images/icons/Docker.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Docker"> title="Docker">
</div> </div>
@ -48,7 +48,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Photoshop.png'}" th:with=" img = ${assets_link + '/images/icons/Photoshop.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Photoshop"> title="Photoshop">
</div> </div>
@ -58,7 +58,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/FinalCutPro.png'}" th:with=" img = ${assets_link + '/images/icons/FinalCutPro.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="FinalCutPro"> title="FinalCutPro">
</div> </div>
@ -66,7 +66,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Python.png'}" th:with=" img = ${assets_link + '/images/icons/Python.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Python"> title="Python">
</div> </div>
@ -76,7 +76,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Swift.png'}" th:with=" img = ${assets_link + '/images/icons/Swift.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Swift"> title="Swift">
</div> </div>
@ -84,7 +84,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Principle.png'}" th:with=" img = ${assets_link + '/images/icons/Principle.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Principle"> title="Principle">
</div> </div>
@ -94,7 +94,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/illustrator.png'}" th:with=" img = ${assets_link + '/images/icons/illustrator.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="illustrator"> title="illustrator">
</div> </div>
@ -102,7 +102,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/CSS3.png'}" th:with=" img = ${assets_link + '/images/icons/CSS3.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="CSS3"> title="CSS3">
</div> </div>
@ -112,7 +112,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/JS.png'}" th:with=" img = ${assets_link + '/images/icons/JS.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="JS"> title="JS">
</div> </div>
@ -120,7 +120,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/HTML.png'}" th:with=" img = ${assets_link + '/images/icons/HTML.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="HTML"> title="HTML">
</div> </div>
@ -130,7 +130,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Git.webp'}" th:with=" img = ${assets_link + '/images/icons/Git.webp'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Git"> title="Git">
</div> </div>
@ -138,7 +138,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Apifox.webp'}" th:with=" img = ${assets_link + '/images/icons/Apifox.webp'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Apifox"> title="Apifox">
</div> </div>
@ -148,7 +148,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/AfterEffect.png'}" th:with=" img = ${assets_link + '/images/icons/AfterEffect.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="AfterEffect"> title="AfterEffect">
</div> </div>
@ -156,7 +156,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Sketch.png'}" th:with=" img = ${assets_link + '/images/icons/Sketch.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Sketch"> title="Sketch">
</div> </div>
@ -166,7 +166,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Docker.png'}" th:with=" img = ${assets_link + '/images/icons/Docker.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Docker"> title="Docker">
</div> </div>
@ -174,7 +174,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Photoshop.png'}" th:with=" img = ${assets_link + '/images/icons/Photoshop.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Photoshop"> title="Photoshop">
</div> </div>
@ -184,7 +184,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/FinalCutPro.png'}" th:with=" img = ${assets_link + '/images/icons/FinalCutPro.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="FinalCutPro"> title="FinalCutPro">
</div> </div>
@ -192,7 +192,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Python.png'}" th:with=" img = ${assets_link + '/images/icons/Python.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Python"> title="Python">
</div> </div>
@ -202,7 +202,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Swift.png'}" th:with=" img = ${assets_link + '/images/icons/Swift.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Swift"> title="Swift">
</div> </div>
@ -210,7 +210,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Principle.png'}" th:with=" img = ${assets_link + '/images/icons/Principle.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Principle"> title="Principle">
</div> </div>
@ -220,7 +220,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/illustrator.png'}" th:with=" img = ${assets_link + '/images/icons/illustrator.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="illustrator"> title="illustrator">
</div> </div>
@ -228,7 +228,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/CSS3.png'}" th:with=" img = ${assets_link + '/images/icons/CSS3.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="CSS3"> title="CSS3">
</div> </div>
@ -238,7 +238,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/JS.png'}" th:with=" img = ${assets_link + '/images/icons/JS.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="JS"> title="JS">
</div> </div>
@ -246,7 +246,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/HTML.png'}" th:with=" img = ${assets_link + '/images/icons/HTML.png'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="HTML"> title="HTML">
</div> </div>
@ -256,7 +256,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Git.webp'}" th:with=" img = ${assets_link + '/images/icons/Git.webp'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Git"> title="Git">
</div> </div>
@ -264,7 +264,7 @@
<img <img
th:with=" img = ${assets_link + '/images/icons/Apifox.webp'}" th:with=" img = ${assets_link + '/images/icons/Apifox.webp'}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
title="Apifox"> title="Apifox">
</div> </div>
@ -283,7 +283,7 @@
<img <img
th:with=" img = @{${techOdd.url}}" th:with=" img = @{${techOdd.url}}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
th:title="${techOdd.name}"> th:title="${techOdd.name}">
</div> </div>
@ -294,7 +294,7 @@
<img <img
th:with=" img = @{${techEven.url}}" th:with=" img = @{${techEven.url}}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
th:title="${techEven.name}"> th:title="${techEven.name}">
</div> </div>

4
templates/modules/widgets/top-group.html
View File

@ -17,7 +17,7 @@
th:with=' img = ${#strings.isEmpty(post.spec.cover) ? postRandomImg+","+post.spec.title : post.spec.cover}' th:with=' img = ${#strings.isEmpty(post.spec.cover) ? postRandomImg+","+post.spec.title : post.spec.cover}'
th:alt="${post.spec.title}" th:alt="${post.spec.title}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
/> />
@ -44,7 +44,7 @@
th:with='img = ${#strings.isEmpty(post.spec.cover) ? postRandomImg+","+post.spec.title : post.spec.cover}' th:with='img = ${#strings.isEmpty(post.spec.cover) ? postRandomImg+","+post.spec.title : post.spec.cover}'
th:alt="${post.spec.title}" th:alt="${post.spec.title}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:data-lazy-src="${ isLazyload ? img : ''}" th:data-lazy-src="${ isLazyload ? img : ''}"
/> />

2
templates/moments.html
View File

@ -32,7 +32,7 @@
<div class="bber-container-img" th:if="${#strings.contains(content.medium,'PHOTO')}"> <div class="bber-container-img" th:if="${#strings.contains(content.medium,'PHOTO')}">
<img th:each="momentItem : ${content.medium}" <img th:each="momentItem : ${content.medium}"
th:if="${momentItem.type.name == 'PHOTO'}" th:if="${momentItem.type.name == 'PHOTO'}"
th:src="${isLazyload ? dataImage : momentItem.url}" th:src="${isLazyload ? loadingImg : momentItem.url}"
th:data-lazy-src="${ isLazyload ? momentItem.url : ''}" th:data-lazy-src="${ isLazyload ? momentItem.url : ''}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
title="瞬间配图"> title="瞬间配图">

4
templates/post.html
View File

@ -125,7 +125,7 @@
<a th:if="${postCursor.hasPrevious()}" th:href="@{${postCursor.previous.status.permalink}}"> <a th:if="${postCursor.hasPrevious()}" th:href="@{${postCursor.previous.status.permalink}}">
<img alt="cover" id="preimg" class="nolazyload" <img alt="cover" id="preimg" class="nolazyload"
th:with="img = ${#strings.isEmpty(postCursor.previous.spec.cover) ? theme.config.layout.postRandomImg : postCursor.previous.spec.cover}" th:with="img = ${#strings.isEmpty(postCursor.previous.spec.cover) ? theme.config.layout.postRandomImg : postCursor.previous.spec.cover}"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:data-lazy-src="${ isLazyload ? img : ''}"> th:data-lazy-src="${ isLazyload ? img : ''}">
<div class="pagination-info"> <div class="pagination-info">
@ -138,7 +138,7 @@
<a th:if="${postCursor.hasNext()}" th:href="@{${postCursor.next.status.permalink}}"> <a th:if="${postCursor.hasNext()}" th:href="@{${postCursor.next.status.permalink}}">
<img alt="cover" id="preimg" class="nolazyload" <img alt="cover" id="preimg" class="nolazyload"
th:with="img = ${#strings.isEmpty(postCursor.next.spec.cover) ? theme.config.layout.postRandomImg : postCursor.next.spec.cover}" th:with="img = ${#strings.isEmpty(postCursor.next.spec.cover) ? theme.config.layout.postRandomImg : postCursor.next.spec.cover}"
th:src="${isLazyload ? dataImage : img}" th:src="${isLazyload ? loadingImg : img}"
th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''" th:attr="onerror='this.onerror=null;this.src=\''+${errorImg}+'\''"
th:data-lazy-src="${ isLazyload ? img : ''}"> th:data-lazy-src="${ isLazyload ? img : ''}">
<div class="pagination-info"> <div class="pagination-info">