Icons

Icons






Iconbar 2.0
Smileys mit wenigen Mausklicks in die Symbolbar übernehmen und per Drag and Drop an die richtige Stelle verschieben - komfortabler geht es kaum. Mit dem neuen Zip-Import können auch große Iconsets einfach und schnell in das Forum übernommen werden. Dieses Tutorial soll euch dabei helfen, das Maximum aus der neuen Symbolbar herauszuholen.


Inhalt


Einleitung
1. Elemente in der neuen Symbolbar
1.1 Smiley
1.2 Foren-Codes
1.3 Textbaustein
1.4 Gruppe
1.5 HTML-Baustein

2. Anpassung
2.1 Drag & Drop
2.2 Bearbeiten
2.3 Löschen

3. Zip-Import

4. Live-Vorschau

5. Beispiele
5.1 Hintergrundfarbe einer Gruppe ändern



Einleitung
Forencodes bieten Ihnen und Ihren Mitgliedern eine einfache Möglichkeit, Beiträge, Signaturen und Kommentare individuell zu gestalten. Mit Sicherheit haben Sie selbst schon einmal Forencodes benutzt. Aber was genau sind Forencodes und wie lassen sich Forencodes im Board einbauen?

Das ist ein Forencode ->
Das ist ein Forencode ->

1
 
[b]Mit Forencode formatierter Text![/b]
 

Grafische Ausgabe: Mit Forencode formatierter Text

Kennen Sie die Symbol-Bar? Dann kennen Sie auch Forencode. Jedes mal, wenn Sie Elemente aus der Bar benutzen - indem Sie beispielsweise Text formatieren oder Smileys einfügen - kommt Forumscode zum Einsatz. Dieser "versteckt" sich hinter der grafischen Ausgabe, also hinter den Symbolen. Es ist doch praktischer mit einem Klick eine Grafik einzufügen, anstatt den gesamten Code auszuschreiben.





Forencodes sind ganz einfach Platzhalter, die mit HTML Befehlen "gefüllt"- und durch eine Grafik in der Symbolbar visuell dargestellt werden. So lautet der Forumscode für den gelben Smiley schlicht:

1
 
[grin]
 



In diesem "Behälter" steckt folgender HTML-Code, der den Pfad zum Speicherort der Smiley Grafik beinhaltet:

1
 
<img src=\'https://img.homepagemodules.de/grin.gif\'>
 

*Anmerkung: da dies ein HTML und kein XHTML Befehl ist, muss der IMG-Tag nicht geschlossen werden. Sofern Sie mit XHTML arbeiten, schließen Sie Ihre IMG-Tags mit einem Slash.

1. - Elemente der neuen Symbolbar

Es gibt 5 verschiedene Element-Typen, die der Symbolbar hinzugefügt werden können. Diese werden im Folgenden genauer erläutert:

1.1 Smileys

Die wohl häufigste Art des Foren-Codes ist ein Smiley. Hier wird der angegebene code einfach durch eine Grafik ersetzt:

z.B Beispiel: [grin]
wird zu <img src=\'http://img.homepagemodules.de/grin.gif\'>
und das wiederum wird dann so angezeigt:

Einen Smiley anzulegen ist mit der neuen Symbolbar kinderleicht. Sie müssen lediglich einen Namen angeben (z.B. grin) und eine Grafik für den Smiley festlegen (z.B <img src=\'http://img.homepagemodules.de/grin.gif\'> ).
Nach einem Klick auf speichern wird der Smileys automatisch in die Symbolbar übernommen.

Es gibt keine Begrenzung für die Anzahl oder die Größe der verwendeten Smileys - bedenken Sie jedoch, dass die Symbolbar durch eine zu hohe Anzahl an Smileys auch schnell unübersichtlich werden kann.

Smiley [grin]


Erweiterte Einstellungen
Unter dem Link weitere Einstellungen können Benutzergruppen festgelegt werden, für die der Smiley nicht in der Symbolbar angezeigt werden soll.
Wie auch im Menüpunkt Navigation betrifft diese Einstellung nur die Anzeige des Smileys. Gibt ein Mitglied den entsprechenden Tag direkt ein, wird dieser trotzdem durch den korrekten Smiley ersetzt.

1.2 Foren-Code
Ein Smiley ist ein ganz spezieller Foren-Code, bei dem immer ein Tag durch eine Grafik ersetzt wird.
Häufig kommt es jedoch vor, dass man über die Symbolbar verschiedene Optionen zur Formatierung des Inhaltes anbieten will. Diese können über die Foren-Codes realisiert werden.

Ein Forencode besteht (fast) immer aus 3 Teilen - dem Start-Tag, dem Inhalt, und dem End-Tag:
Ein einfaches Beispiel ist z.B. der Foren-Code "fett schreiben"

[b]Ich bin fett geschrieben[/b]
Start-Tag: [b]
Inhalt: Ich bin fett geschrieben
End-Tag: [/b]

Die [b] und [/b]-Tags werden intern durch die HTML-Tags <b> und </b> ersetzt.
Der Screenshot zeigt die Definition des [b]-Tags in der Administration.
[b]-Tag


fortgeschrittene Foren-Codes
Foren-Codes haben das Potenzial, nahezu jede HTML-Anweisung im Forum zu ermöglichen. Um maximale Flexibilität zu erreichen, können beliebig viele eigene Variablen verwendet werden.
Variablen werden durch 2 geschweifte Klammern gekennzeichnet ({{varname}}), als Variablenname sind nur alphabetische Werte (a - z) zugelassen. Der Name {{main}} ist außerdem schon vergeben für die Hauptbenutzereingabe (...).

Ein Beispiel wäre:
Ersetze: [LINK={{url}}]...[/LINK]
mit: <a href="{{url}}">...</a>.

Es können beliebig viele Variablen verwendet werden, in der ersetze Zeile, darf aber sinnvollerweise jede Variable nur einmal vorkommen.
Beispiel Forencode mit Variablen



Erweiterte Einstellungen
Neben der Einstellung für die Sichtbarkeit des Codes für verschiedene Benutzergruppen, finden sich bei den Foren Codes zwei weitere Optionen:
Priorität
Die Priorität bestimmt die Reihenfolge, in der die Ersetzungen ausgeführt werden. Für die Reihenfolge kann ein Wert zwischen 0 und 100 angegeben werden. Codes mit einem kleineren Wert werden zuerst umgewandelt. Dies wird bbenötigt, um abhängige Ersetzungen realisieren zu können (zum Beispiel um HTML <table>-Elemente nachzubilden.)

JS-Funktion
Um wirklich jeden Anwendungsfall zu ermöglichen, kann optional eine Javascript-Funktion angegeben werden, die beim Klick auf das Icon in der Symbolbar ausgeführt wird. So kann man z.B. nach Klick auf das Icon für "Video einfügen" eine Javascript-Abfrage nach der Videoadresse ausführen und dann den fertigen Tag in das Textfeld übertragen.
Wichtig: An dieser Stelle wird nur der Aufruf der Javascript-Funktion angegeben (also z.B. insertVideoTag()). Wird eine eigene Javascript-Funktion verwendet, muss diese in einem HTML-Element definiert werden

Einfache Foren-Codes
Über einen Klick auf die Schaltfläche erweiterten Foren-Code ein-/ausblenden kann ein einfacher Forencode erstellt werden. Ein einfacher Forencode besteht nur aus einem Tag, der durch etwas anderes (meist ein HTML-Tag) ersetzt wird. Alle Smileys sind z.B. einfache Forencodes. Ein anderes Beispiel wäre [hr], das durch <hr/> ersetzt wird.
Beispiel einfacher Forencode


Warum nicht gleich HTML in Beiträgen erlauben?
Mit vordefinierten Forencodes entscheiden Sie als Admin, welche Möglichkeiten Ihre Mitglieder zur Formatierung des Textes oder zur Integration von weiteren Inhalten wie beispielsweise Videos, Bilder etc. haben. Natürlich könnten Sie von vorne herein – und mit weit weniger Aufwand - HTML in Ihren Beiträgen erlauben. Dies wird jedoch aus mehreren Gründen nicht empfohlen.

Über HTML besteht die Möglichkeit, schädlichen Code (beispielsweise Javascript, welches Ihre Cookies ausliest oder Werbung "unterschummelt") in Ihr Forum "einzuschleusen"

Möglicherweise wird Ihr Design ungewollt verändert oder gar zerstört

Forencodes (Platzhalter / BBCode) bergen den Vorteil, dass auch komplexe HTML Befehle einfach "verpackt" und in die Symbol Bar integriert werden können. So profitieren auch Mitglieder ohne Programmier-Kenntnisse davon



1.3 Textbaustein
Textbausteine bieten eine einfache Möglichkeit, häufig verwendete Texte über die Symbolbar einzubinden.
Legen Sie dazu einfach einen Text fest, der dann per Klick in den Beitrag übernommen wird.

In diesem Beispiel wird keine Grafik angegeben. In diesem Fall erscheint in der Symbolbar der Name des Elements (Update)
Beispiel Textbaustein


1.4 Gruppe
Ein Gruppen-Element ist kein eigener Foren-Code. Vielmehr können andere Elemente per Drag&Drop in einer Gruppe zusammengefasst werden. Fährt ein Mitglied mit der Maus über ein solches Gruppen-Icon, wird ein Feld mit allen enthaltenen Elementen angezeigt (dropdown). Gruppen bieten eine komfortable Möglichkeit, auch Iconbars mit vielen Elementen noch übersichtlich zu gestalten. So können z.B. Smileys oder auch Formatierungen thematisch geordnet werden (z.B. Weihnachts-Smileys, Farben oder auch Schriften).

Gruppen Screenshot


erweiterte Einstellungen
Neben den Einstellungen zur Sichtbarkeit für verschiedene Benutzergruppen findet sich hier noch die Checkbox diese Gruppe nicht anzeigen. Wird diese angewählt, wird die Gruppe und alle enthaltenen Icons nicht in der Iconbar angezeigt. Auf diese Weise lassen sich Icons kurzfristig ein- bzw. ausblenden, ohne dass es nötig wäre diese zu löschen oder neu anzulegen.

Nicht angezeigte Elemente
Dies ist eine besondere Gruppe, die in jeder Iconbar enthalten ist. Elemente in dieser Gruppe werden - wie der Name schon sagt - nicht in der Symbolbar angezeigt. Sie dient als Platzhalter für Foren-Codes, die zwar ausgewertet werden, aber nicht in der Symbolbar stehen sollen. Ein Beispiel für einen solchen Code hier im Forum wäre z.B. [xobor][/xobor]. Dieser Code ist zwar nicht über die Symbolbar abrufbar - wird aber trotzdem ausgewertet, wenn er in einem Textfeld verwendet wird (Text innerhalb dieses Tags erscheint im gewohnten Xobor-Blau). Die Gruppe nicht angezeigte Elemente kann nicht bearbeitet oder gelöscht werden.

nicht angezeigte Elemente



1.5 HTML
Auch ein HTML-Element ist kein Foren-Code, sondern dient lediglich zur einfacheren Gestaltung der Iconbar.
Mit einem HTML-Element haben Sie die Möglichkeit, jeden noch so individuellen Design-Wunsch in ihrer Symbolbar zu realisieren. HTML-Elemente bestehen aus HTML oder Javascript Code. Dieser Code wird an der Stelle, an der das Element positioniert ist, direkt in den Quelltext der Symbolbar übernommen.

Der Screenshot zeigt die beiden HTML-Elemente blau_start und blau_end. Alle Elemente, die zwischen diesen beiden HTML-Elementen angeordnet werden, erhalten einen blauen Hintergrund.

Beispiel HTML-Elemente



2. - Anpassung

2.1 Drag & Drop

Alle Elemente der Symbolbar können per Drag&Drop an die gewünschte Stelle verschoben werden. Gruppen können allerdings nicht innerhalb einer anderen Gruppe abgelegt werden. Wenn Sie ein Element verschieben, wird die neue Reihenfolge automatisch gespeichert und die Live-Vorschau aktualisiert.

Screenshot Drag&Drop


2.2 Bearbeiten

Über das bearbeiten-icon http://105.achille.miranus.eu/admin/pencil.png haben Sie die Möglichkeit, ein einmal angelegtes Element im Nachhinein zu verändern. Sie könne alle Werte anpassen, lediglich der Typ des Elementes (also Smiley, Gruppe , Foren-Code etc.) lässt sich nicht mehr ändern.

2.3 Löschen
Drücken Sie auf das löschen-icon http://105.achille.miranus.eu/admin/cross-script.png um ein Element zu entfernen. Wenn Sie eine Gruppe löschen, werden darin enthaltene Elemente ebenfalls entfernt.
Achtung: Das Löschen eines Elementes lässt sich nicht Rückgängig machen. Sie können zwar jederzeit auf die Standard-Symbolbar zurücksetzen, eigene Elemente lassen sich aber nicht wiederherstellen.

3. - Zip-Import
Der Zip-Import ermöglicht das erstellen von beliebig vielen Smileys in einem Rutsch. Sie benötigen lediglich ein Zip-Archiv, das die gewünschten Bilddateien enthält.
Beim Upload wird automatisch für jedes Bild im Archiv ein Smiley-Elements mit dem Bildnamen erstellt. Außerdem wird eine Gruppe mit dem Namen des Archivs angelegt, die dann die neuen Smileys enthält.
Auf diese lassen sich auch große Iconsets komfortabel in die Symbolbar übertragen.

Screenshot Zip-Import


4 - Live Vorschau
In diesem Abschnitt sehen Sie immer eine aktuelle Vorschau auf die Symbolbar - so wie sie auch im Forum angezeigt wird.

Screenshot Preview


5. - Beispiele

5.1 Hintergrundfarbe einer Gruppe ändern

Ziel: Die Hintergrundfarbe für ein Untermenü soll geändert werden.

Lösung: Wir erstellen 2 HTML-Elemente und platzieren diese per Drag&Drop so, dass alle zwischenliegenden Elemente einen Hintergrund zugewiesen bekommen.

Fallbeispiel: Das Untermenü "Farben" soll grün Hinterlegt werden.

1) HTML-Baustein 1 erstellen: Der Baustein öffnet eine <div> und weist dieser den grünen Hintergrund zu. Die margin-Eigenschaft sorgt dafür, dass die ganze Fläche grün gefüllt wird und nicht links ein kleiner Spalt in der Ursprungsfarbe bleibt.

Baustein gruen_start


2) Der zweite HTML-Baustein schließt die <div>
Baustein gruen_end


3) Schließlich müssen die Bausteine nur noch richtig positioniert werden:
Drag & Drop


4) Ergebnis:
Farben mit grünem Hintergrund

Login
Activity Feed
forum_message forum_message
Ingmar hat einen neuen Beitrag im Thema Rechnungsstellung, falsche Adresse/Empfänger... geschrieben.
Das ist die richtige Adresse. Du bekommst da noch eine Antwort, sorry für die Wartezeit.
forum_topic forum_topic
An welche email soll ich das schicken? Ich habe bisher an "forum@miranus.com" geschrieben, leider noch keine Rückmeldung dazu? Ist das die richtige Adresse?Danke, Martin
rating rating
Gabriella hat sich bedankt!
Beitrag: Mail-Benachrichtigung angehalten
%usernames% hat sich bedankt!
forum_message forum_message
EaglePipe und Ingmar haben 3 neue Beiträge im Thema Post benachrichtigen über der Navigation geschrieben.
@Ingmar danke für die Antwort das Plugin funktioniert leider noch nicht auf V6ich werde es mal mit dem Code versuchen und testen. Gruß Alex
forum_message forum_message
Ingmar hat einen neuen Beitrag im Thema Mail-Benachrichtigung angehalten geschrieben.
Kleines Update:Momentan scheint uns die beste Lösung, in der "Mailversand eingestellt"-Email einen Link anzubieten, über den die Sperre direkt wieder aufgehoben werden kann (also quasi ein "resubscribe-link"). Aktive Admins könnten diesen einmalig anklicken und würden sofort wieder alle Benachrichti...
rating rating
Fedali und 3 weitere haben sich bedankt!
Beitrag: Chatprobleme
%usernames% haben sich bedankt!
rating rating
Gabriella und 1 weitere haben sich bedankt!
Beitrag: Font Problem
%usernames% haben sich bedankt!
forum_message forum_message
Nara und 1 weitere haben 2 neue Beiträge im Thema Font Problem geschrieben.
Dankeschön.
rating rating
%usernames% hat sich bedankt!
forum_message forum_message
Johannes hat einen neuen Beitrag im Thema Chatprobleme geschrieben.
Zitat von Ingmar im Beitrag #2Danke für die Meldung, das wird schnellstmöglich behoben.Inzwischen ist der Fehler in allen Foren behoben!
forum_message forum_message
Moin Ingmar,nun ist es so wie unsere Forianer sich das vorstellen.Danke für die Lösung des ProblemsGruß Gerrit
rating rating
%usernames% hat sich bedankt!
rating rating
Ingmar hat sich bedankt!
Beitrag: WIKI in der mobilen Ansicht
%usernames% hat sich bedankt!
forum_message forum_message
Ingmar und 1 weitere haben 3 neue Beiträge im Thema Reels geschrieben.
Ja, das sieht gut aus. Wieder was gelernt, danke für's raussuchen.Etwas unschön, dass man den handle und die video-id braucht (oder eben den ganzen Link) - aber das Ergebnis sieht gut aus.
rating rating
Fedali hat sich bedankt!
Beitrag: Chatprobleme
%usernames% hat sich bedankt!
rating rating
Fedali und 1 weitere haben sich bedankt!
Beitrag: Chatprobleme
%usernames% haben sich bedankt!
forum_message forum_message
SusanneG und 1 weitere haben 3 neue Beiträge im Thema WIKI in der mobilen Ansicht geschrieben.
Das Wiki habe ich aus dem Untermenü rausgenommen, jetzt ist es im Hauptmenü und auch sichtbar in der mobilen Version.Dankeschön!
forum_message forum_message
EaglePipe hat einen neuen Beitrag im Thema Verschiedene CSS Files anbieten geschrieben.
Hat gemacht das Script schon in der V6 probiertGruß Alex
rating rating
SusanneG hat sich bedankt!
Beitrag: WIKI in der mobilen Ansicht
%usernames% hat sich bedankt!
rating rating
Gabriella hat sich bedankt!
Beitrag: Reels
%usernames% hat sich bedankt!
rating rating
Gabriella hat sich bedankt!
Beitrag: Infotext für Gäste anpassen
%usernames% hat sich bedankt!
forum_message forum_message
taunus-club-freiburg und 2 weitere haben 3 neue Beiträge im Thema Chatprobleme geschrieben.
Genau wie Inge Go, tritt auch bei mir das Problem im Chat auf auf! Läßt sich auch nicht aktivieren! (in 2 Foren)Forennummer 757166 → taunus-club-freiburgForennummer 875271 → oldie-club-freiburgFür Deine Mühe, dankeGruß, Wolle
forum_message forum_message
Jim hat einen neuen Beitrag im Thema Business Template V4 geschrieben.
Hat sich erledigt. Shoutbox deinstalliert und neu geladen.Ebenso den Avatar. Funzt wieder!
forum_topic forum_topic
Ich habe zwei Plugins in denen nur 2 Elemente sind aber 12 in der Liste der Template-Elemente angezeigt werden. [[File:Template-elemente-1.png|none|auto]]Es handelt sich um das Plugin Sie haben Post Zoompid: kopieNachdem ich eine Kopie angelegt habe sind die 12 Elemente auch in der Kopie. pid: sieha...
forum_message forum_message
Kathi_Rine und 1 weitere haben 2 neue Beiträge im Thema Infotext für Gäste anpassen geschrieben.
Oh vielen Dank für die schnelle Antwort. Hat geklappt! :)
forum_topic forum_topic
Inge Go hat das Thema Chatprobleme erstellt
Seit Wochen haben wir Chatprobleme. Es hakt sehr oft und ab ca 19,43 Uhr ist es wie eingefroren und wir müssen uns alle , nach einander aktualisieren . Tritt diese Problem nur bei uns auf , oder hat das noch jemand ? Seit heute Mittag kommt nun ein Fenster mit f...
forum_topic forum_topic
Kathi_Rine hat das Thema Infotext für Gäste anpassen erstellt
Hallo zusammen, ich frage mich, wie ich wohl den Text im angehängten Bild anpassen kann?Die Registrierung in meinem Forum ist bei mir nur nach Bezahlung und Anmeldung über Digistore24 möglich (geschlossener Mitgliederbereich), darüber möchte ich User informieren, die "zufällig" auf die Forenseite...
forum_topic forum_topic
Gabriella hat das Thema Reels erstellt
Hallo zusammen,ich hätte eine Frage, ob man Reels (Videos von TikTok) nicht auch mit unserem Video-Tag im Forum einbinden könnte.Das ist einfach viel schöner, wenn man da ein Bild sieht und nicht nur einen Link.Ginge das überhaupt und kann mir vielleicht jemand erklären, wie?
forum_message forum_message
Zitat von Gerrit Oswald im Beitrag #14ist das was jetzt online ist bereits die endgültige Version (habe extra ein paar Tage nach Deinem Bugfix abgewartet)?Hallo @Gerrit Oswald Das wurde erst heute mittag eingespielt. Eventuell musst du nochmal eine Einstellung am Wasserzeichen ändern, damit die best...
forum_message forum_message
Ingmar und 1 weitere haben 3 neue Beiträge im Thema Administration geschrieben.
Zitat von Mike48 im Beitrag #11Da müssen alle Optionen auf "Wird nicht angezeigt" gesetzt werden. Dann ist der AF deaktiviert.Genau so ist es. Danke für die Klarstellung Mike!
rsummary rsummary
Fedali und 4 weitere haben 2 Beiträge bewertet (Details)
%usernames% haben sich bedankt!
rsummary rsummary
Gerrit Oswald und 1 weitere haben 2 Beiträge bewertet (Details)
%usernames% hat sich bedankt!
rsummary rsummary
Fedali und 1 weitere haben 2 Beiträge bewertet (Details)
%usernames% haben sich bedankt!
rsummary rsummary
SusanneG und 1 weitere haben 3 Beiträge bewertet (Details)
%usernames% hat sich bedankt!
Wer ist Online?
5 Mitglieder und 7 Gäste sind Online
Besucher Statistiken
12 Aktive User
5 Mitglieder und 7 Gäste sind Online:
Ingmar, nobody, Wolfgang, Gemshorn, BeaBielecki


Besucherrekord
1274 Benutzer gleichzeitig online (11.10.2019 18:19)

Besucherzähler
Heute waren 812 Gäste und 29 Mitglieder, gestern 1008 Gäste und 33 Mitglieder online.

Statistiken
Themen 40127
Beiträge 290280
Mitglieder 12.084
Forum empfehlen