Ich habe mir überlegt, wie ich einen Stempel abgestempelt erstellen kann.
Die Inspiration und Idee kam einfach, als ich auf meinen Briefumschlag schaute, und dachte mir, das werde ich auch hinbekommen. Gesagt, getan. Habe jetzt die ganze Nacht seit gestern Abend 23:00 Uhr bis jetzt 17:15 Uhr daran gesessen.
Bekomme es hier im Xobor - Forum nicht kleiner, sieht aber nicht schlecht aus so groß abgestempelt.
Hier mal 2 Bilder, wie es im Forum ausschaut.
Meines Erachtens denke ich hat es so keiner, und hoffe das dieser Effekt gut ankommt.
Hier mal das Script, wie ich es geschrieben habe und wie es normal aussieht.
Stempel abgestempel - einheitlicher Stempel - Teil 1!
Hallo Daishi.
Bin erst jetzt dazu gekommen Deine Idee fürs Forum umzusetzen! Sehr interessant, auch die anfangs gewählten Komponenten! Hier gibt es noch viel zu erfahren und zu erforschen. Vieles ist möglich!
Was gut ist:
Wie ich gesehen habe, ist es ein Stempel, den man direkt auf den Text stempelt! Kann man gut in Forum-Beiträgen verwenden! Super Idee!
Was nicht so gut ist:
Der Stempel lässt sich durch "vmin" sehr schlecht verändern und anpassen!
"-webkit-mask" bringt zwar einen interessanten Linen-Effekt, beeinflusst auch die Schrift, die dann schlechter zu lesen ist!
Bild 1: Stempel im Text
Bild 2: Beitrag gelesen!
Bild 3: Stempel mit Effekt
Was habe ich gemacht, was habe ich geändert:
Um den Stempel in Beiträgen zu nutzen, habe ich einen einfacher Foren-Code erstellt! Es wird dann nur noch die CSS in "Eigener CSS Code" kopiert!
Habe "vmin" aus der CSS verbannt und feste Werte für die Größe des Stempels angegeben!
CSS minimiert!
Jetzt ist es möglich die Größe sauber einzugeben!
Auch die Position im Text kann frei gewählt werden!
Wer möchte kann den Linien-Effekt noch freischalten (siehe Bild 3), muss aber in Kauf nehmen, dass die Schrift nicht so gut zu lesen ist!
Der Stempel kann einmal pro Beitrag genutzt werden! Kann auch für "Beitrag gelesen, ist in Arbeit" verwendet werden (siehe Bild 2)!
Installation für alle Template & Mobil
Der HTML-Code
Der neue Foren-Code
CSS
Zu Übersicht der gesamte HTML-Code mit CSS
In Zeile 4+5 wird die Position des Stempels bestimmt, empfehlenswert sind Angaben in Prozent!
In Zeile 10 wird der 3-zeilige Text eingegeben, wobei (\a) den Umbruch erzeugt!
In Zeile 21+22 wird die Größe des Stempels bestimmt.
In Zeile 26-28 kann die Farbe bestimmt werden (hier #0043FE)
Zeile 30 bestimmt die Rotation, Zeile 31 die Durchsichtigkeit!
Möchte man den Linen-Effekt einsetzen, muss Zeile 36-43 freigegeben werden oder mit Hilfe einer Grafik, dann Zeile 33+34 freigeben!
.Stempel { position: absolute; margin-top: 1%; margin-left: 5%; z-index:999999; } .Stempel::after { /* Hier kann man den Text ändern */ content: " Service Crew \a Loreth \a 07.Juli 23 ";
Wow, super Arbeit Wolfgang, sieht sehr schön aus. Eine Idee hätte ich noch, habe es eben getestet, dass man ein Stempel-Effekt noch dazu hat aber als Bild.
In der CSS von dir habe ich diesen Effekt-Code eingebaut in Zeile 24.
Besten Dank! Habe das Bild gleich als weitere Option mit in den Beitrag übernommen! Die Schrift wird allerdings auch von dem Bild beeinflusst, wodurch die Lesbarkeit schlechter wird.
Was ich nicht hinbekommen habe:
Habe Dein Bild auf 1920x1200px verkleinert und dann auf den Xobor-Server hochgeladen! Das hat funktioniert! Aber das Bild als "webkit mask image" in das Skript einzubinden ging nicht! Der ganze Stempel war verschwunden!
Ich habe gedacht, dass die Schrift immer gut zu lesen sein sollte. Es kommt natürlich auch darauf an, wo man den Stempel einsetzt! Wenn ich mir das so recht überlege, ist der Linieneffekt mit der Durchsichtigkeit (opacity) genial und mit Deiner neuen Code-Erweiterung sieht es nahezu wie ein echter Stempel aus!
Stempel abgestempelt - Stempel mit Ersteller Datum - Teil 2
Hallo Arndt.
Was wären wir ohne Ideen und die, die es testen und nutzen! Manchmal denke ich, dass die Idee einen höheren Stellenwert hat, denn ohne sie würde nichts passieren!
Oft ist es auch so, dass man eine super Idee hat, aber überlegen muss, wo man sie einsetzten kann! Eine unschöne Variante ist, dass Ideen verkannt oder nicht verstanden werden! Aber hier nicht locker lassen! Auch wenn es dann super speziell ist, hat vieles seine Brillianz!
Also, super Idee und mach weiter so!!!
Hier eine mögliche Ausführung:
Leider kann man keine Variablen in der Iconbar oder in der Kopf- und Fußzeile nutzen, dann wäre vieles einfacher und noch mehr möglich!!! Möglich ist allerdings, automatisch das Ersteller Datum eines Beitrages in den Stempel zu bringen! Wichtig! Da Variablen zum Einsatz kommen ist das Anlegen eines Plugins notwendig!
Installation - Getestet im Business (v4)
Der HTML-Code
Der neue Foren-Code
CSS
Zu Übersicht der gesamte HTML-Code mit CSS
In Zeile 6+7 wird die Position des Stempels bestimmt, empfehlenswert sind Angaben in Prozent!
In Zeile 11 wird der 3-zeilige Text eingegeben, wobei (\a) den Umbruch erzeugt und das Datum durch eine Variable ersetzt wird!
In Zeile 22+23 wird die Größe des Stempels bestimmt.
In Zeile 20, 27-29 kann die Farbe bestimmt werden (hier #0000CC)
Zeile 31 bestimmt die Rotation, Zeile 31 die Durchsichtigkeit!
Möchte man den Linen-Effekt einsetzen, muss Zeile 37-44 freigegeben werden oder mit Hilfe einer Grafik, dann Zeile 34+35 freigeben!
<style> #post{{message:pt}} .Stempel { position: absolute; margin-top: 1%; margin-left: 5%; } #post{{message:pt}} .Stempel::after { /* Hier kann man den Text ändern */ content: " Service Crew \a Loreth \a {{message:messagetime|dateformat(d.m.y)}}";
<style> #post{{message:pt}} .Stempel { position: absolute; margin-top: 1%; margin-left: 5%; } #post{{message:pt}} .Stempel::after { /* Hier kann man den Text ändern */ content: " Service Crew \a Loreth \a {{message:messagetime|dateformat(d.m.y)}}";
Stempel abgestempelt - Stempel als Signatur oder Hinweis - Teil 3 Aktualisiert 12.08.23
Das folgende Skript stammt auch aus der Ideen-Schmiede von @Daishi ! Hier mal wieder besten Dank!
Stempel als Signatur:
Der Stempel lässt sich auch gut über die Iconbar oder direkt als Signatur unter jedem Beitrag setzen! Die Größe des Stempels, die Schrift, die Schriftfarbe, die Schriftgröße und der Hintergrund lassen sich auch hier frei wählen. Die Stempel sind durchsichtig, Hintergrund kann nachgetragen werden! Der Stempel kann durch seine Beschriftung auf das Forum, auf den Admin, auf den Beitrag oder namentlich auf eine Person hinweisen! Der Stempel kann auch verlinkt werden, zum Profil oder zur Startseite des Forums!
Neu! In der Iconbar können auch mehrere Stempel eingesetzt werden, auch nur für den Admin !
Die Stempel in Form und Farbe
Installation für alle Templates & Mobil
Der HTML-Code
Der neue Foren-Code
Als Signatur
In der Iconbar
Nur für den Admin
Zur Übersicht und zum besseren Verständnis der HTML-Code als SVG-Grafik
In Zeile 1 kann die Verlinkung z.B. zur Startseite ( / ) oder zum Profil ( /u1_%20.html ) eingetragen werden!
In Zeile 1 ist auch die Class "admin" zu finden, die für die Admin-Berechtigung sorgt!
In Zeile 2 kann die Größe des Stempels und die Rotationslage bestimmt werden (Stempel 1= 35, Stempel 2 = -35, Stempel 3 = 0)!
In Zeile 4-7, 13+19 kann die Grundfarbe eingestellt werden.
Trägt man in Zeile 4+7 unter "fill" verschiedene Farben ein, wird der Hintergrund des Innerkreises und der des äußeren Kreises farblich unterschiedlich dargestellt (siehe Stempel 5).
In Zeile 13+19 kann die Schriftart geändert werden!
Wird der Foren-Code als Signatur genutzt, neu erstelltes Icon in "nicht sichtbar" verschieben!
Wird der Foren-Code in Beiträgen benötigt, neu erstelltes Icon an den richtigen Platz schieben!
Unter "Profil bearbeiten > Signatur" wird der neu erstellte Foren-Code eingetragen! In der Signatur funktioniert kein HTML-Code!
Eintrag in "Signatur":
[Stempel1]
Schließen
Wird der Foren-Code in Beiträgen benötigt, neu erstelltes Icon an den richtigen Platz schieben!
Wird der Foren-Code als Signatur genutzt, neu erstelltes Icon in "nicht sichtbar" verschieben!
Mit einem Klick auf das neue Icon, wird der Foren-Code automatisch in den Beitrag kopiert!
Schließen
Soll nur der Admin den Stempel sehen, für z.B. "Beitrag in Arbeit" oder Stempel "Admin" gibt es mehrere Möglichkeiten!
1. Berechtigung in der Benutzergruppe einstellen
Ist der Forencode bereits erstellt, werden unter "Weitere Einstellungen" > "Code nicht für folgende Benutzergruppen anzeigen" alle Kästchen angehakt, die den Stempel nicht sehen sollen!
2. Gruppe nur für den Admin erstellen
Hat man mehrere Foren-Codes, die nur der Admin sehen soll, kann man eine "Gruppe" in der Iconbar anlegen und hierfür unter "Weitere Einstellungen" > "Code nicht für folgende Benutzergruppen anzeigen" die Berechtigung vergeben! Hier werden dann alle Foren-Codes reingeschoben, die die Admin-Berechtigung bekommen sollen!
3. Neue Class in den Foren-Code einfügen Wird dem Foren-Code, den nur der Admin sehen soll, eine neue Class mit der folgenden CSS hinzugefügt, kann sogar in einem Dropdown-Menü die Admin-Codes für andere User ausgeblendet werden!
Wenn noch nicht geschehen, die class="admin" im Foren-Code nachtragen!
Da Variablen notwendig sind, muss die CSS als Plugin angelegt werden unter "Untere Leiste - Header"! Wichtig! Im Plugin muss rechts oben das "Unterstützte Template" markiert werden, z.B. Business - Template (144) & Mobil - Template (177), Auswahl mit Mausklick oder Strg + Mausklick!
das ist eine super Idee aus Dashis Ideenschmiede gefällt mir richtig gut, heisst ich kann endlich meinen Admin gelesen Button rausschmeissen. Dank an unseren Forenchef, dass er immer hilft, Ideen auch zeitnah umzusetzen
Frage mich grade, wie ich das nur für den Admin nutze, @Wolfgang, könnte ich das für mich auch in die Iconbar machen, so wie ich im GDP meine Adminutensilien habe?