Widget Zähler

  • Hallo,

    besteht die Möglichkeit dem Widget Zähler noch mit einem Zeichen zu ergänzen, z.B. €, Tage oder Monate.

    Ergebnis sollte dann nicht 800 sein sondern 800 €

  • Salut Standak


    Von Haus aus wird die gewünschte Möglichkeit leider nicht geboten. Das Zähler-Widget lässt sich jedoch mit etwas CSS entsprechend anpassen.

    Ich poste Dir hier bald eine Bastelanleitung.


    Bis bald.

    Viele Grüsse

    elch

  • Also. Hier bin schon ich wieder 😊, mit einem Lösungsmodell.


    1. CSS-Befehl erstellen.

    Nehmen wir mal an, Du möchtest in unterschiedlichen Zähler-Widgets «Tage» und «€» anzeigen lassen. Dazu erstellen wir 2 unterschiedliche CSS-Klassen (class).


    Gehe zu «Einstellungen» -> «CSS» und füge gemäss Beispiel folgenden Code in das Feld ein …

    Code
    <style>
    .zaehlerTage .zpcounterwidget::after {content: " Tage";} /* Leerschlag vor Wert für Abstand */
    .zaehlerEuro .zpcounterwidget::after {content: " €";} /* Leerschlag vor Wert für Abstand */
    </style>

    Mit «OK» speichern und schliessen.


    2. Erstelle das Zähler-Widget an gewünschter Stelle.

    Wähle «Darstellung». (Bei diesem Beispiel-Bild wurden die Änderungen vorgängig schon vollzogen!)


    Wähle "Spalte".

    Im Feld «CSS-Klasse» nach dem bestehenden Wert (z.B. hier c4) einen Leerschlag machen und den Klassen-Wert «zaehlerTage» einfügen.


    Gegebenenfalls per «F6» aktualisieren, wenn der Wert in der Vorschau nicht sofort ersichtlich wird.


    Jetzt sollte «Tage» hinter den Zahlen angezeigt werden.

    Für den Wert «€» wiederholst Du dies bei einem neuen Zähler-Widget mit dem Unterschied, dass Du im Feld «CSS-Klasse» «zaehlerEuro» einfügts.


    Zur Verbildlichung hier noch meine Bastelei als erweitertes Beispiel

    Code
        /* IndivCLASS ZählerDeko */
        .zaehlerDeko .zpcounterwidget {background-image: linear-gradient(#614B47 10%, #4E3C39 50%, #614B47 70%, #4E3C39 85%); border: 0px; border-radius: 30%; box-shadow: 0px 0px 20px 4px #000;}
        .zaehlerDeko .zpcounterwidget::after {content: " hPa";} /* end */


    Einen schönen Sonntag, viel Erfolg und eine gute Zeit.


    Viele Grüsse

    elch

    Zeta Producer 16.x - Express

    Hobby-Website: Heubeere.ch 8) ("ß" gibt es nicht. Sorry!)

    Einmal editiert, zuletzt von elch ()