✨ feat: advertisement

README.md

@@ -206,34 +206,10 @@ layout:
   article_width: 80rem
   sidebar_width: 8rem
 
-# Comment：1、Valine (recommended)；2、Gitalk
-# You can close the comment section on one of your posts by marking `comments: false` in front-matter.
-
-# 1、Valine [A fast, simple & powerful comment system](https://github.com/xCss/Valine)
-# You need create leancloud account first (https://console.leancloud.app), then put the id|key in below.
-leancloud:  
-  enable: true
-  app_id: #
-  app_key: #
-# Valine Setting
-valine:
-  enable: true 
-  verify: false # comment verify
-  avatar: mp # (https://valine.js.org/avatar.html)
-  placeholder: Add some comments to my article~ # placeholder
-
-# 2、Gitalk(https://github.com/gitalk/gitalk)
-gitalk:
-  enable: false # true
-  clientID: # GitHub Application Client ID
-  clientSecret: # Client Secret
-  repo: # Repository name
-  owner: # GitHub ID
-  admin: # GitHub ID
-
 # GitHub Ribbons(https://github.blog/2008-12-19-github-ribbons/)
 github: 
   # (Set false if you don't need)
+  enable: false
   url: https://github.com/Shen-Yu/hexo-theme-ayer
 
 # pv&uv statistics
@@ -298,6 +274,44 @@ friends_link:
   hexo-tag-chart:
     url: https://github.com/Shen-Yu/hexo-tag-chart
     img: https://i.loli.net/2020/09/07/GIXBYE5SoylhR1r.png
+
+# Comment：1、Valine (recommended)；2、Gitalk；3、Twikoo；4、MiniValine
+# You can close the comment section on one of your posts by marking `comments: false` in front-matter.
+
+# 1、Valine [A fast, simple & powerful comment system](https://github.com/xCss/Valine)
+# You need create leancloud account first (https://console.leancloud.app), then put the id|key in below.
+leancloud:  
+  enable: true
+  app_id: #
+  app_key: #
+# Valine Setting
+valine:
+  enable: true 
+  avatar: mp # (https://valine.js.org/avatar.html)
+  placeholder: Add some comments to my article~ # placeholder
+
+# 2、Gitalk(https://github.com/gitalk/gitalk)
+gitalk:
+  enable: false # true
+  clientID: # GitHub Application Client ID
+  clientSecret: # Client Secret
+  repo: # Repository name
+  owner: # GitHub ID
+  admin: # GitHub ID
+
+# 3、Twikoo(https://github.com/imaegoo/twikoo)
+twikoo:
+  enable: false
+  envId: #
+
+# 4、MiniValine
+# See: https://github.com/MiniValine/MiniValine
+minivaline:
+  enable: false
+  md: true
+  # more options https://minivaline.js.org/docs/cn/#/Options 
+  backend: waline
+  serverURL: https://waline.vercel.app
 ```
 
 ## Plugins

_config.yml

@@ -233,3 +233,17 @@ minivaline:
   # 下面是一个例子：
   backend: waline
   serverURL: https://waline.vercel.app
+
+# 首页广告配置
+# 可以根据需要自行增加ad_3，ad_4...，留空则不显示
+ads:
+  ad_1:
+    title: 腾讯云限时秒杀
+    img: https://cdn.jsdelivr.net/gh/Shen-Yu/cdn/img/ad_1.jpg
+    url: https://curl.qcloud.com/ezctH6FU
+    width: 300
+  ad_2:
+    title: 云服务器全球购低至2折
+    img: https://cdn.jsdelivr.net/gh/Shen-Yu/cdn/img/ad_2.jpg
+    url: https://curl.qcloud.com/kvO7hb43
+    width: 300

layout/_partial/ads.ejs

@@ -0,0 +1,9 @@
+<ul class="ads">
+    <% for (var i in theme.ads){ %>
+        <li>
+            <a href="<%= theme.ads[i].url %>">
+                <img src="<%= theme.ads[i].img %>" width="<%= theme.ads[i].width %>" alt="<%=theme.ads[i].title %>">
+            </a>
+        </li>
+    <% } %>
+</ul>

layout/_partial/archive.ejs

@@ -1,4 +1,7 @@
 <section class="outer">
+  <% if (theme.ads && theme.ads.length != 0){ %>
+  <%- partial('ads') %>
+  <% } %>
   <% if (theme.broadcast.enable && pagination == 2){ %>
   <%- partial('_partial/broadcast') %>
   <% } %>

package.json

@@ -27,6 +27,7 @@
   "homepage": "https://shen-yu.gitee.io/",
   "devDependencies": {
     "autoprefixer": "^9.8.6",
+    "cssnano": "^4.1.10",
     "parcel-bundler": "^1.12.4",
     "parcel-plugin-bundle-visualiser": "^1.2.0",
     "postcss-modules": "^1.5.0"

source-src/css/_partial/ads.styl

@@ -0,0 +1,15 @@
+.ads
+    position absolute
+    right 0
+    top 50px
+    z-index 2
+    transform translateX(110%)
+    ul,li
+        list-unstyled()
+    img 
+        display block
+        margin-bottom 15px
+
+@media (max-width: 768px)
+    .ads
+        display none

source-src/css/_partial/layout.styl

@@ -74,6 +74,9 @@
 .local-search
   width 100%
 
+#main
+  position relative
+
 
 // Media Query
 @media (min-width: 768px)

source-src/css/style.styl

@@ -72,6 +72,7 @@ button
 @import "_partial/reward"
 @import "_partial/share"
 @import "_partial/friends"
+@import "_partial/ads"
 
 if sidebar
   @import "_partial/sidebar"

source/dist/report.html

@@ -42,7 +42,7 @@
   margin-bottom: 10px;
 }</style>
       <script>
-        window.TREE_DATA = {"groups":[{"label":"main.js","path":".\\source\\dist\\main.js","weight":5567,"formattedSize":"5.44 KB","formattedGzipSize":"2.23 KB","formattedTime":"5.48s","isTooLarge":false,"groups":[{"label":"source-src","path":".\\source-src","groups":[{"label":"main.js","path":".\\source-src\\main.js","weight":198,"time":140,"formattedTime":"140ms","formattedSize":"198 B","isTooLarge":false},{"label":"css","path":".\\source-src\\css","groups":[{"label":"style.styl","path":".\\source-src\\css\\style.styl","weight":1073,"time":5323,"formattedTime":"5.32s","formattedSize":"1.05 KB","isTooLarge":false}],"weight":1073,"formattedTime":"5.32s","formattedSize":"1.05 KB"},{"label":"js","path":".\\source-src\\js","groups":[{"label":"ayer.js","path":".\\source-src\\js\\ayer.js","weight":2547,"time":372,"formattedTime":"372ms","formattedSize":"2.49 KB","isTooLarge":false},{"label":"share.js","path":".\\source-src\\js\\share.js","weight":1729,"time":407,"formattedTime":"407ms","formattedSize":"1.69 KB","isTooLarge":false}],"weight":4276,"formattedTime":"779ms","formattedSize":"4.18 KB"}],"weight":5547,"formattedTime":"6.24s","formattedSize":"5.42 KB"}]},{"label":"main.css","path":".\\source\\dist\\main.css","weight":36437,"formattedSize":"35.58 KB","formattedGzipSize":"7.99 KB","formattedTime":"5.33s","isTooLarge":false,"groups":[{"label":"source-src","path":".\\source-src","groups":[{"label":"css","path":".\\source-src\\css","groups":[{"label":"style.styl","path":".\\source-src\\css\\style.styl","weight":1073,"time":5323,"formattedTime":"5.32s","formattedSize":"1.05 KB","isTooLarge":false}],"weight":1073,"formattedTime":"5.32s","formattedSize":"1.05 KB"}],"weight":1073,"formattedTime":"5.32s","formattedSize":"1.05 KB"}]}]};
+        window.TREE_DATA = {"groups":[{"label":"main.js","path":".\\source\\dist\\main.js","weight":5567,"formattedSize":"5.44 KB","formattedGzipSize":"2.23 KB","formattedTime":"28.36s","isTooLarge":false,"groups":[{"label":"source-src","path":".\\source-src","groups":[{"label":"main.js","path":".\\source-src\\main.js","weight":198,"time":221,"formattedTime":"221ms","formattedSize":"198 B","isTooLarge":false},{"label":"css","path":".\\source-src\\css","groups":[{"label":"style.styl","path":".\\source-src\\css\\style.styl","weight":1073,"time":28110,"formattedTime":"28.11s","formattedSize":"1.05 KB","isTooLarge":false}],"weight":1073,"formattedTime":"28.11s","formattedSize":"1.05 KB"},{"label":"js","path":".\\source-src\\js","groups":[{"label":"ayer.js","path":".\\source-src\\js\\ayer.js","weight":2547,"time":455,"formattedTime":"455ms","formattedSize":"2.49 KB","isTooLarge":false},{"label":"share.js","path":".\\source-src\\js\\share.js","weight":1729,"time":491,"formattedTime":"491ms","formattedSize":"1.69 KB","isTooLarge":false}],"weight":4276,"formattedTime":"946ms","formattedSize":"4.18 KB"}],"weight":5547,"formattedTime":"29.28s","formattedSize":"5.42 KB"}]},{"label":"main.css","path":".\\source\\dist\\main.css","weight":36685,"formattedSize":"35.83 KB","formattedGzipSize":"8.04 KB","formattedTime":"28.13s","isTooLarge":false,"groups":[{"label":"source-src","path":".\\source-src","groups":[{"label":"css","path":".\\source-src\\css","groups":[{"label":"style.styl","path":".\\source-src\\css\\style.styl","weight":1073,"time":28110,"formattedTime":"28.11s","formattedSize":"1.05 KB","isTooLarge":false}],"weight":1073,"formattedTime":"28.11s","formattedSize":"1.05 KB"}],"weight":1073,"formattedTime":"28.11s","formattedSize":"1.05 KB"}]}]};
       </script>
       <script>/* eslint-disable */
 /**