feat: 适配“无效友链”

_config.yml

@@ -1052,6 +1052,18 @@ links:
       avatar: "/img/favicon.png"
     }
 
+  # 失效/未激活的友链Add commentMore actions
+  inactive:
+    enable: false
+    label: "异常友链 | 长时间不可访问站点"
+    inactiveItems:
+        - {
+          title: "404 Links",
+          intro: "404 Links",
+          link: "https://hexo.fluid-dev.com/404",
+          avatar: "/img/favicon.png"
+        }
+
   # 当成员头像加载失败时，替换为指定图片
   # When the member avatar fails to load, replace the specified image
   onerror_avatar: /img/avatar.png

languages/de.yml

@@ -32,6 +32,9 @@ links:
   menu: 'Weblinks'
   title: 'Weblinks'
   subtitle: 'Weblinks'
+  inactive:
+    collapsed: 'Erweitern'
+    expanded: 'Reduzieren'
 
 page404:
   menu: 'Die Seite wurde nicht gefunden'

languages/en.yml

@@ -32,6 +32,9 @@ links:
   menu: 'Links'
   title: 'Links'
   subtitle: 'Links'
+  inactive:
+    collapsed: 'Expand'
+    expanded: 'Collapse'
 
 page404:
   menu: 'Page not found'

languages/eo.yml

@@ -32,6 +32,9 @@ links:
   menu: 'Ligoj'
   title: 'Ligoj'
   subtitle: 'Ligoj'
+  inactive:
+    collapsed: 'Malfermi'
+    expanded: 'Fermi'
 
 page404:
   menu: 'Paĝo ne trovita'

languages/es.yml

@@ -32,6 +32,9 @@ links:
   menu: 'Enlaces'
   title: 'Enlaces'
   subtitle: 'Enlaces'
+  inactive:
+    collapsed: 'Expandir'
+    expanded: 'Contraer'
 
 page404:
   menu: 'Página no encontrada'

languages/ja.yml

@@ -32,6 +32,9 @@ links:
   menu: 'リンク'
   title: 'リンク'
   subtitle: 'リンク'
+  inactive:
+    collapsed: '開く'
+    expanded: '閉じる'
 
 page404:
   menu: 'ページが見つかりませんでした'

languages/ru.yml

@@ -32,6 +32,9 @@ links:
   menu: 'Ссылки'
   title: 'Ссылки'
   subtitle: 'Ссылки'
+  inactive:
+    collapsed: 'Открыть'
+    expanded: 'Закрыть'
 
 page404:
   menu: 'Страница не найдена'

languages/zh-CN.yml

@@ -32,6 +32,9 @@ links:
   menu: '友链'
   title: '友链'
   subtitle: '友情链接'
+  inactive:
+    collapsed: '展开内容'
+    expanded: '收起内容'
 
 page404:
   menu: '页面不存在'

languages/zh-HK.yml

@@ -32,6 +32,9 @@ links:
   menu: '連結'
   title: '交換連結'
   subtitle: '交換連結'
+  inactive:
+    collapsed: '展開內容'
+    expanded: '收起內容'
 
 page404:
   menu: '頁面不存在'

languages/zh-TW.yml

@@ -32,6 +32,9 @@ links:
   menu: '連結'
   title: '交換連結'
   subtitle: '交換連結'
+  inactive:
+    collapsed: '展開內容'
+    expanded: '收起內容'
 
 page404:
   menu: '頁面不存在'

layout/links.ejs

@@ -12,11 +12,12 @@ page.comment = theme.links.comments.type
   <% for(const each of theme.links.items || []) { %>
     <% if (!each.title || !each.link) continue %>
     <div class="card col-lg-4 col-md-6 col-sm-12">
-      <a href="<%= url_for(each.link) %>" class="card-body hover-with-bg" target="_blank" rel="noopener">
+      <a href="<%= url_for(each.link) %>" class="card-body hover-with-bg" target="_blank" rel="noopener" aria-label="<%= `访问 ${each.title}` %>">
         <div class="card-content">
           <% if (each.avatar || each.image) { %>
             <div class="link-avatar my-auto">
               <img src="<%= url_for(each.avatar || each.image) %>" alt="<%= each.title %>"
+                   loading="lazy"
                    onerror="this.onerror=null; this.src=this.srcset='<%= url_for(theme.links.onerror_avatar) %>'"/>
             </div>
           <% } %>
@@ -30,6 +31,60 @@ page.comment = theme.links.comments.type
   <% } %>
 </div>
 
+<% if (theme.links.inactive && theme.links.inactive.enable && theme.links.inactive.inactiveItems) { %>
+  <hr/>
+  <% if (theme.links.inactive.label) { %>
+    <div class="d-flex justify-content-between align-items-center">
+      <p class="inactive-label mb-0"><%- theme.links.inactive.label %></p>
+      <button class="btn btn-link text-muted p-0" type="button" data-toggle="collapse" data-target="#inactiveLinksCollapse" aria-expanded="false" aria-controls="inactiveLinksCollapse" style="text-decoration: none; font-size: 0.9rem;">
+        <span class="toggle-text"><%- __('links.inactive.collapsed') %></span>
+        <i class="fas fa-chevron-down toggle-icon ml-1" style="transition: transform 0.3s ease;"></i>
+      </button>
+    </div>
+  <% } %>
+
+  <div class="collapse-container" style="max-height: 100px; overflow: hidden; transition: max-height 0.3s ease;">
+    <div class="collapse" id="inactiveLinksCollapse">
+      <div class="row links">
+        <% for(const item of theme.links.inactive.inactiveItems || []) { %>
+          <% if (!item.title || !item.link) continue %>
+          <div class="card col-lg-4 col-md-6 col-sm-12">
+            <a href="<%= url_for(item.link) %>" class="card-body hover-with-bg" target="_blank" rel="noopener" aria-label="<%= `访问 ${item.title}` %>">
+              <div class="card-content">
+                <% if (item.avatar || item.image) { %>
+                  <div class="link-avatar my-auto">
+                    <img src="<%= url_for(item.avatar || item.image) %>" alt="<%= item.title %>"
+                          loading="lazy"
+                          onerror="this.onerror=null; this.src=this.srcset='<%= url_for(theme.links.onerror_avatar) %>'"/>
+                  </div>
+                <% } %>
+                <div class="link-text">
+                  <div class="link-title"><%- item.title %></div>
+                  <div class="link-intro"><%- item.intro || '' %></div>
+                </div>
+              </div>
+            </a>
+          </div>
+        <% } %>
+      </div>
+    </div>
+  </div>
+
+  <script>
+      const collapseElement = document.getElementById('inactiveLinksCollapse');
+      const toggleButton = document.querySelector('[data-target="#inactiveLinksCollapse"]');
+      toggleButton.addEventListener('click', () => {
+        const isExpanded = collapseElement.classList.contains('show');
+        const toggleText = document.querySelector('.toggle-text');
+        if (toggleText) {
+          toggleText.textContent = isExpanded ? "<%- __('links.inactive.collapsed') %>" : "<%- __('links.inactive.expanded') %>";
+        }
+      }
+    );
+  </script>
+<% } %>
+
+
 <% if(theme.links.custom && theme.links.custom.enable && theme.links.custom.content) { %>
   <!-- Custom -->
   <div class="custom mx-auto">