<script> //bei der zahl 5 kann man den betrag angeben der gepsendet wurde //bei "(Annonymous)" kann der Spender eingetragen werden. var donations = [ [5, "(Annonymous)"], [5, "(Annonymous)"], [5, "(Annonymous)"], [5, "(Annonymous)"], [5, "Lui"],
]; var donationnumber = -1; //Hier kann man den guthaben angeben den man schon hat also geldbetrag. //hat mann keins setzt man es auf null. var total = 0;
In Zeile 71 bis 75 können die Spender eingetragen werden, dies kann erweitert werden, aber bitte darauf achten auf die Zahl vor dem Namen. Dies ist der Betrag
1
[5, "Lui"],
In Zeile 79 ist der aktuelle Betrag, der wird gezählt. Ich habe ihn auf null gestellt, da ich noch kein Guthaben von vorher drauf habe. Muss man vorher etwas ausprobieren, wenn man zum Beispiel vorher 25 Euro Guthaben drauf hat und die Spender Beträge spenden.
Ich habe es bei mir installiert und es geht. Nur habe ich bei mir andere Einstellungen. Dachte es ist mal etwas Spezielles und peppt die Foren-Spende auf.
<script> document.addEventListener('DOMContentLoaded', function() { // Clan tattoo Loreth unter Avatar im Beitrag und im Forum unten Status $(' div#foverview_stat3, .message_leftcol, .messagecont div div:first-child center:first-child, .infoUserBox, #pagewidth table a > table tr:nth-child(3) td:first-child').append(`
<img style="width:45px" src="https://files.homepagemodules.de/b2001010/a_1711_f8762c31.png"> <br> <b>Aktuelles Guthaben: </b><br> <br> <b>Diese User haben gespendet : </b>
<!-- Eigene Seite mit Spendeninfos --> <a href="https://le-dernier-du-clan-loreth.xobor.de/donations.html">
<!-- Weil ich kann --> <div class="secret"><div class="sectot"></div><div class="secname"></div></div> <br> <br> `); }); </script>
So schaut es aus:
So schaut es aus
So sieht es richtig aus, ohne Werbung:
So schaut es aus
Wenn man auf den Zähler klickt, sieht es dann so aus
So schaut es aus
Hoffe ich konnte es so gut es geht erklären, habe es versucht im Script auch bisschen zu erklären.
Ich entschuldige mich sehr, dass ich das Eurozeichen nicht hinbekommen habe, habe nur das Dollar-Zeichen hinbekommen.
P.s.: Damit du es weißt, wenn du es testen möchtest: Kann sein, dass noch in der CSS Feineinstellung an den Schräubchen und an den kleinen Zahnrädchen gedreht werden muss :O) .
Du kannst es auch verändern und weiterentwickeln :O)
Ich hoffe, dass ich hiermit dir eine kleine Freude machen konnte, und dir die Ideen und Inspirationen gefallen.
// Tabellenzeilen generieren (Ticker oder Vollansicht) const renderRows=(full=false)=>{ if(noDonations) return `<tr><td colspan="2"><i>Noch keine Spenden eingegangen</i></td></tr>`; let rows=`<tr><td><b>Total (${donations.length} User):</b></td><td style="font-weight:bold"><span class="donation-amount">${fmt(total)}</span></td></tr>`; return full ? rows+donations.map(d=>`<tr><td>${d.USER}:</td><td>${fmt(d.Beitrag)}</td></tr>`).join("") : rows+`<tr><td class="donation-name"></td><td class="donation-tot"></td></tr>`; };
// --- Box HTML --- const box=` <div class="donation-box"> <div class="donation-header" title="Spenden-Tabelle öffnen & schließen"> <img class="toggle-icon" src="https://files.homepagemodules.de/b2001010/a_1711_f8762c31.png"> <strong>Dieses Jahr 2025 haben folgende User gespendet</strong> <span class="toggle-arrow">▼</span> </div> <table class="donation-table ticker-view">${renderRows(false)}</table> <table class="donation-table full-view" style="display:none">${renderRows(true)}</table> <div class="donation-note">Sämtliche Spenden werden für die Zahlung des Forums verwendet.<br>Keine Auszahlung an den Admin.</div> </div>`;
// --- Box einfügen - Nur fürs V4 --- $('div#foverview_stat3').append(box);
Wow super Arbeit, da hast du wirklich super Ideen und Inspirationen mit einfließen lassen.
Sieht sehr schön aus, und kommt richtig zur Geltung, ist angenehm anzuschauen und lässt die Herzen höher schlagen. Wenn man das sieht, das spricht auch genau das an, was es soll.
Hoffe, ich habe es richtig ausgerückt ( bin mit der Aussprache nicht so gut ).
Wollte nur ein Feedback geben das es in Business 4 sehr gut läuft und funktioniert.
Bestimmt werden sich die anderen freuen, wenn für die anderen Templates es auch noch gibt. Wolfgang ich weiß wie viel Arbeit es ist, habe einen riesigen Respekt, komme gerade mit Business 4 klar.
Wie ich schon sagte, für mich sehen die verschiedene Template-Codes alle gleich aus. Du sagtest die haben alle verschiedene Codes (Classes). Deswegen ziehe ich den Hut, dass du sie alle so locker aus dem Ärmel schüttelst und sie für alle tüchtig machst und dass sie auf allen Templates laufen.
Inspiriert durch viele Gespräche und die großartige Unterstützung von Wolfgang, habe ich mich an ein Projekt gewagt,
das vielen Forenbetreibern am Herzen liegt: Absolute Finanz-Transparenz.
In vielen Foren wird oft gefragt, ob es möglich sei, den aktuellen Geldbetrag live zu sehen. Da das Xobor-System aus Sicherheitsgründen einen Schutz hat, ist eine direkte Live-Schnittstelle zum Konto nicht möglich.
Aber man kann dieses Problem durch eine intelligente, automatisierte Berechnung lösen, die ich nun in unser neues Dashboard integriert habe.
💎 Dank an das Fundament
Ich möchte diesen Moment nutzen, um Wolfgang ganz herzlich zu danken. Sein ursprünglicher Code und seine ständigen Inspirationen waren das Fundament für dieses Modul.
Ich habe seine tolle Arbeit als Basis benutzt, um darauf aufzubauen und das Ganze um die automatische Berechnungslogik und ein neues Design zu erweitern.
Wolfgang, danke für deine Vorarbeit und auf eine weiterhin so gute und inspirierende Zusammenarbeit!
Wie funktioniert das Modul?
Obwohl wir keinen direkten Zugriff auf die Bankdaten haben, spiegelt dieses Skript unser Kassenbuch auf den Cent genau wieder.
Ich muss nur noch in zwei Zeilen händisch die Rohdaten eingeben:
Die Spende (Wer hat unterstützt?)
Den Abzug (Was wurde vom System abgebucht?)
Das Skript erledigt den Rest: Es summiert alle Eingänge, subtrahiert die Ausgaben und berechnet im Moment des Seitenaufrufs automatisch das aktuelle Guthaben und den Fortschrittsbalken.
Was bietet das Dashboard?
Live-Guthaben: Scharf und ehrlich auf den Cent genau.
Interaktiver Balken: Zeigt sofort den aktuellen Deckungsgrad des Jahresziels.
System-Logs: Volle Transparenz über alle monatlichen Abzüge (z.B. Profi-Tarif).
Spender-Ticker: Ehre für alle, die uns am Laufen halten.
Die Funktionsweise der "Guthaben-Spiegelung":
Das Skript, dass auf der Startseite eingebunden wird (z.B. in der Statistik-Leiste), führt alle Einnahmen und Ausgaben zusammen:
Dateneingabe: Der Administrator pflegt neue Spenden und System-Abzüge (z.B. monatliche Serverkosten) in einfachen Listen im Skript-Code.
Automatische Berechnung: Das Skript summiert im Moment des Seitenaufrufs alle Beträge und zeigt den exakten Nettobetrag an.
Visuelle Transparenz: Ein Fortschrittsbalken, Spender-Ticker und ein rotes Log-Fenster visualisieren alle Vorgänge.
Features des Moduls:
Professionelles Design: Edles "Gold-Glass" Design, das sich gut in moderne Foren-Layouts einfügt.
Automatische Mathematik: Kein manuelles Rechnen nötig, das Skript erledigt die Buchhaltung.
Volle Transparenz: Alle Einnahmen, Ausgaben und das aktuelle Guthaben sind jederzeit einsehbar.
Das Modul ist Open Source und kann gerne für eigene Projekte verwendet werden.
Es ist eine elegante Lösung für alle, die in ihrem Forum höchste Transparenz bieten möchten, ohne die Sicherheitsmechanismen von Xobor zu umgehen.
Hier wie es ausschaut:
Bei einem Freund auf dem Forum, unten rechts in der Forum Statistik.
Dies ist der Gesamtbetrag, den wir pro Jahr benötigen (der Soll-Wert für den Fortschrittsbalken). Dieser Wert ändert sich selten.
1 2 3
const spendenZiel = 166.80; // Beispiel: 12 Monate x 13,90 € pro Jahr
💡 3. Wichtiger Hinweis: Automatische Berechnung
Nachdem du die Listen A) oder B) aktualisiert und gespeichert hast, berechnet das Skript das Guthaben und den Fortschrittsbalken automatisch im Hintergrund. Du musst nicht selbst addieren oder subtrahieren.
🔧 4. Fehlerbehebung
Modul verschwindet: Prüfe, ob du ein Komma nach dem letzten Eintrag in einer der Listen (
1
donations
oder
1
systemLogs
) vergessen hast.
Optik falsch: Stelle sicher, dass die Google Font-Links (
1
@import url(...)
) im
1
<style>
-Bereich korrekt sind und dass das Design im Admin-Panel das Laden von externen CSS/JS erlaubt.
Hier Das Script:
Finanz-Dashboard 2026 (fürs Business (v4) Edition)
<div class="transparency-box"> <b style="color:var(--gold-soft); display:block; text-align:center; margin-bottom:5px;">FINANZ-TRANSPARENZ 2026</b> 🛡️ <b>System-Sicherheit:</b> Die Kosten werden direkt über das interne Xobor-Guthaben abgerechnet.<br><br> 💎 <b>Zweckbindung:</b> Deine Unterstützung fließt zu 100% in die Profi-Lizenz, die werbefreie App-Nutzung und die Foren-Sicherheit.<br><br> 🚫 <b>Keine Privat-Entnahme:</b> Es erfolgt keine private Auszahlung an den Admin. Das Geld bleibt im System. </div>
In deinem Skript wird der Spenden-Link über die Variable
1
spendenLink
gesteuert.
Damit der Button „Unterstützen“ oder „Jetzt Spenden“ funktioniert, musst du dort die URL zu deiner Spendenseite eintragen.
1. Die Stelle im Script
Suche in deinem Script (im Bereich der Daten-Eingabe) nach dieser Zeile:
1
const spendenLink = "/donations.html";
2. Welchen Link musst du dort eintragen?
Hier gibt es je nach deiner Foren-Konfiguration drei Möglichkeiten:
Interne Xobor-Seite: Wenn du eine eigene Inhaltsseite im Forum für Spenden erstellt hast (z.B. mit dem Namen "Spenden"), lautet der Link meist einfach
1
/spenden.html
oder
1
/h1-spenden.html
oder
1
https:// - Dein - Forum - Name - /donations.html
.
PayPal-Link: Wenn du direkt zu PayPal verlinken möchtest, trage deinen PayPal.Me Link dort ein:
1
const spendenLink = "https://www.paypal.me";
Ein ganz besonderer Dank gebührt hierbei Wolfgang. Sein ursprünglicher Code und seine ständigen Inspirationen waren das Fundament für dieses Projekt.
Ich habe seine hervorragende Vorarbeit als Basis genutzt, um darauf aufzubauen und das Modul, um die automatische Berechnungslogik, sowie das neue Design zu erweitern.
Wolfgang, danke für die großartige Unterstützung und auf eine weiterhin so gute und inspirierende Zusammenarbeit!
Hoffe das die Idee und Inspiration sehr gut ankommen