查看“︁微件:用户标签”︁的源代码

<includeonly>
<style>
.bili-widget {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px 20px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e0e0e0;
    max-width: 500px;
    aspect-ratio: 4 / 1;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    box-sizing: border-box;
}
.bili-widget-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    flex-shrink: 0;
    cursor: pointer;
    transition: transform 0.2s;
}
.bili-widget-avatar:hover {
    transform: scale(1.1);
}
.bili-widget-info {
    flex: 1;
    min-width: 0;
}
.bili-widget-name {
    font-weight: bold;
    font-size: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bili-widget-verify {
    font-size: 12px;
    color: #fb7299;
    margin-top: 2px;
}
.bili-widget-follow {
    padding: 8px 18px;
    background: #fb7299;
    color: #fff;
    border-radius: 8px;
    text-decoration: none;
    font-size: 14px;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.2s;
}
.bili-widget-follow:hover {
    background: #e8618a;
}
</style>

<div class="bili-widget" id="bili-widget-<!--{$uid|escape:'html'}-->">
    <img class="bili-widget-avatar" id="bili-avatar-<!--{$uid|escape:'html'}-->" src="" alt="头像">
    <div class="bili-widget-info">
        <div class="bili-widget-name" id="bili-name-<!--{$uid|escape:'html'}-->">加载中...</div>
        <div class="bili-widget-verify" id="bili-verify-<!--{$uid|escape:'html'}-->"></div>
    </div>
    <a class="bili-widget-follow" href="https://space.bilibili.com/<!--{$uid|escape:'html'}-->" target="_blank">关注</a>
</div>

<script>
(function() {
    var uid = '<!--{$uid|escape:'html'}-->';
    if (!uid) return;

    var apiUrl = 'https://api.bilibili.com/x/space/wbi/acc/info?mid=' + uid;

    fetch(apiUrl)
        .then(function(res) { return res.json(); })
        .then(function(json) {
            if (json.code === 0 && json.data) {
                var data = json.data;
                // 头像
                var avatar = document.getElementById('bili-avatar-' + uid);
                if (avatar) {
                    avatar.src = data.face || '';
                    avatar.onclick = function() {
                        window.open('https://space.bilibili.com/' + uid, '_blank');
                    };
                }
                // 名字
                var name = document.getElementById('bili-name-' + uid);
                if (name) {
                    name.textContent = data.name || '未知';
                }
                // 认证
                var verify = document.getElementById('bili-verify-' + uid);
                if (verify && data.official && data.official.title) {
                    verify.textContent = '◆ ' + data.official.title;
                } else if (verify) {
                    verify.textContent = '';
                }
            }
        })
        .catch(function() {
            var name = document.getElementById('bili-name-' + uid);
            if (name) name.textContent = '加载失败';
        });
})();
</script>
</includeonly>