您好，我正在尝试做一件事。我想在网站顶部显示 Discourse Gamification 插件的用户积分。例如，如果一个名为 Adam 的用户有 700 分，我该如何在标题部分显示它？我应该把代码放在哪里？
我的意思是，我真正想要的是用户能看到他们自己的积分。
此致敬礼！
至少给我一个用户评分的 HTML 示例
也许是这个？
这支持标题正下方和主题路由
但您可能需要自己构建组件。
我想将用户卡片中的欢呼积分移到主页顶部。用户应该能够看到他们的分数。这些分数是从排行榜中获取的。
此横幅/标题项目的放置是按月、季度、日、周、年还是所有时间？
这是当前的 Header API：
但你可能只想将一个组件附加到一个出口。
before-header-panel 看起来是个不错的选择。
1 个赞
不，先生。用户应该只在标题中看到他们的分数。我需要将添加到个人资料卡的部分添加到标题中。这个分数是从排行榜中获得的，该排行榜反映了从任务中获得的积分。
它将基于所有时间获得的总积分。
主页的标题部分应显示每个用户的分数。如果有什么代码或方法可以实现这一点，请告诉我。我为此奋斗了 14 个小时，还和我的猫打架！
组件的示例非常多。请查看 Theme component 的代码库，了解 .gjs Glimmer 组件的示例，并注意它们是如何附加到插件出口的。
@merefield 是指你可以如何构建此组件。问题是，这不是一个功能，所以它必须作为一个主题组件来制作。
1 个赞
对不起。我以为您不理解我，因为我的英语不好。我感觉很糟糕。
2 个赞
工作已完成
4 个赞
您介意分享一下您是如何完成的吗？
我创建了一个新组件。我使用了 API 来获取积分。我将用户部分移到了主页。
这是一个临时但有用的方法。也许他们想改进它，我把代码放在这里
测试网站：https://trgala.com
Js
import { apiInitializer } from "discourse/lib/api";
export default apiInitializer("0.8", (api) => {
api.onPageChange(() => {
const currentUser = api.getCurrentUser();
if (!currentUser) {
console.warn("用户未登录");
return;
}
fetch(`/u/${currentUser.username}.json`)
.then(response => response.json())
.then(data => {
console.log("游戏化数据：", data);
let score = data?.user?.gamification_score ?? 0;
// 如果分数框已存在，则不再添加
if (document.querySelector("#gamification-score")) return;
// 查找标题的 .contents 容器
let headerContents = document.querySelector(".d-header> .wrap .contents");
if (headerContents) {
// 创建分数框
let scoreContainer = document.createElement("a");
scoreContainer.id = "gamification-score";
scoreContainer.classList.add("gamification-box");
scoreContainer.href = "website";
scoreContainer.target = "_blank"; // 在新标签页中打开
// 金币图标
let icon = document.createElement("span");
icon.innerText = "T";
icon.classList.add("gold-icon");
// 分数文本
let scoreText = document.createElement("span");
scoreText.innerText = `${score}`;
scoreText.classList.add("gold-text");
// 将图标和文本添加到框中
scoreContainer.appendChild(icon);
scoreContainer.appendChild(scoreText);
// 将框添加到标题中
headerContents.appendChild(scoreContainer);
}
})
.catch(error => console.error("获取游戏化分数时出错：", error));
});
});
4 个赞
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.