Hello, I’m trying to do something. I want to display the user points from the Discourse Gamification plugin at the top of the site. For example, if a user named Adam has 700 points, how can I show this in the header section? Where should I place the code?
I mean, what I really want is for the user to see their own points.
Best regards!
This request is quite excellent; I am also curious to know the answer.
I believe that if each user could see their contribution points under their name tag, it would greatly enhance community engagement.
at least give me an html example for user ratings
Perhaps this?
“I want to move the Cheer Points from the user cards to the top of the homepage. The user should be able to see their score. These scores are taken from the leaderboard.”
This supports just below header and Topic Route too
But you might need to build the Component yourself.
I want to move the Cheer Points from the user cards to the top of the homepage. The user should be able to see their score. These scores are taken from the leaderboard.
Would the placing for this banner/header item be by month, quarter, day, week, year, or all time?
Here’s the current Header API:
But you probably just want to attach a Component to an outlet
before-header-panel looks like a good one.
No sir. The user should only see their score in the header. I need to add the section that is added to the profile card to the header. This score is obtained from the leaderboard, which reflects the points earned from task
t will be based on the total points earned over all time.
Each user should see their score in the header section on the homepage. If there is a code or method to do this, please let me know. I’ve been struggling for 14 hours, and I’m fighting with my cat! 
There are loads of examples of Components. Look at the codebases of Theme component to look at examples of .gjs glimmer Components and note how they are attached to Plugin Outlets.
@merefield was referring to how you could build this component. The thing is, this is not a feature, so it’ll have to be made as a Theme Component.
I am sorry . I thought you didn’t understand me because my English was bad. I felt bad
the job is done
Do you mind sharing how you accomplished this?
I created a new component. I used API for points. I moved the user section to the home page
It is a temporary but useful method. Maybe they want to improve it, I leave the code here
Test website: 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("User not logged in");
return;
}
fetch(`/u/${currentUser.username}.json`)
.then(response => response.json())
.then(data => {
console.log("Gamification Data:", data);
let score = data?.user?.gamification_score ?? 0;
// Eğer puan kutusu zaten varsa tekrar ekleme
if (document.querySelector("#gamification-score")) return;
// Header'ın .contents kapsayıcısını bul
let headerContents = document.querySelector(".d-header>.wrap .contents");
if (headerContents) {
// Puan kutusunu oluştur
let scoreContainer = document.createElement("a");
scoreContainer.id = "gamification-score";
scoreContainer.classList.add("gamification-box");
scoreContainer.href = "website";
scoreContainer.target = "_blank"; // Yeni sekmede aç
// Altın simge
let icon = document.createElement("span");
icon.innerText = "T";
icon.classList.add("gold-icon");
// Puan metni
let scoreText = document.createElement("span");
scoreText.innerText = `${score}`;
scoreText.classList.add("gold-text");
// Simge ve metni kutuya ekle
scoreContainer.appendChild(icon);
scoreContainer.appendChild(scoreText);
// Kutuyu header'a ekle
headerContents.appendChild(scoreContainer);
}
})
.catch(error => console.error("Error fetching gamification score:", error));
});
});
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.