🎨 Links Plus

Typecho 友链管理插件增强版

配置教程(正文重写)

原版支持函数调用法和HTML标签调用法（教程），但是部分主题用不了（需要二次开发），于是我们用万能的重写法，即使插件丢失了也能正确显示友链！

1.配置CID

在友链（独立页面）的编辑页面中，地址栏https://example.com/admin/write-page.php?cid=920中920便是CID，将他填到需要重写的 cid中

2.添加固定占位符

将下面的内容复制到需要添加友链的地方，如：

{{links_plus}}

然后发布页面

在已经重写的页面中使用下面的标签来定位

<!-- LINKS_PLUS_START -->
<!-- LINKS_PLUS_END -->

如果不希望修改友链了可以删除，删除后如果还要修改可以加上标签或者全部删除然后重新使用{{links_plus}}

3.配置重写输出

在插件设置中，必须配置需要重写的cid 重写输出主题 重写输出HTML
通用主题(模板没有主题专用字样)，请在重写输出HTML中选择使用!!!包裹

4.重写

进入菜单-Links Plus-友情链接页面，添加需要添加的友链，然后点击右上角执行重写即可

主题

主题名称	主题图片	介绍	注入
Material Design Cards 1		MD3 风格的友链卡片网格	CSS,JS
Material Design Cards 2		MD3 风格的友链卡片网格	CSS,JS

主题下载

Github: https://github.com/lhl77/Typecho-Plugin-LinksPlus/tree/main/templates
网盘: https://cloud.lhl.one/s/oYCl

同步已发布(已投稿)主题，只需在插件页面点击按钮同步Github主题

（如有主题不兼容情况，是正常的，请发Issue或博客评论区留言，我会尽快兼容）

主题开发文档

模板目录为 templates/{NAME}/。
必要文件：manifest.json、template.html。
可选文件：style.css、script.js（manifest.json 中 inject 决定是否注入）。
模板占位符：{name} {url} {image} {description} {sort} {lid} 等。

manifest.json

{
  "name": "主题英文名",      //这里需要与templates/{NAME}/中的NAME一致
  "title": "主题名称",       //外显主题名称
  "version": "1.0.0",       //主题更新时匹配version,格式x.x.x
  "description": "主题简介", //简要说明即可
  "inject": {
    "css": true,            //是否需要注入css，true则将style.css注入
    "js": true              //是否需要注入js，true则将script.js注入
  }
}

专用主题

部分主题可能已经终于友链显示，有特殊的Markdown语法，那么template.html直接写Markdown格式即可，注意填写占位符。

<!-- template.html (以Mirages主题为例)-->
[{name}]({url})+({image})

主题专用一般不需要注入css和js,如果需要随机显示那么可以加js

通用主题

这个就比较多变了，给个例子，一般都需要css和js注入

template.html

<!-- template.html (MD3-1主题)-->
<li class="lp-md3-item">
    <div class="lp-md3-wrap-fix" style="width:100%!important;height:100%!important">
        <div class="lp-md3-card" role="link" tabindex="0" data-href="{url}" aria-label="{name}">
            <div class="lp-md3-state-layer"></div>
            <div class="lp-md3-ripple-container"></div>
            <div class="lp-md3-content-wrap">
                <div class="lp-md3-media"><img class="lp-md3-avatar" src="{image}" alt="{name}" loading="lazy"></div>
                <div class="lp-md3-text">
                    <div class="lp-md3-headline">{name}</div>
                    <div class="lp-md3-subhead">{description}</div>
                </div>
            </div> 
            <div class="lp-md3-meta"><span class="lp-md3-chip">{sort}</span></div>
        </div>
    </div>
</li>

注意：部分主题可能会对部分标签（如a、img)等添加样式或点击事件，可以避免使用a而用js代替，避免使用img而用background代替。

style.css

对于亮/暗主题适配，可以用css选择器，如

[data-theme=dark]
body.dark
body.dark-mode
body.theme-dark
html.dark
html.dark-mode
html.theme-dark

举个例子

/* 亮色 */
.lp-md3-chip{
  background-color:rgba(0,0,0,.06);
}

/* 暗色 */
[data-theme=dark] .lp-md3-chip{
  background-color:rgba(255,255,255,.1)!important;
}

(建议写完一套之后，交给AI来写适配)

主题投稿

专用主题 manifest.json 格式要求

• name请加z-前缀

如Mirages主题的专用友链主题，name填写z-mirages

• title请加(主题专用) 前缀

如Mirages主题的专用友链主题，title填写(主题专用) Mirages

通用主题没有 manifest.json 格式要求

投稿方式

主题可以提交PR： https://github.com/lhl77/Typecho-Plugin-LinksPlus/pulls

不方便可以将主题文件发到评论区，审核过后更新到Github和博客

采用 CC BY-NC-SA 4.0 协议授权，转载请注明来源。