Florians Forum » Webmaster » Ideen für Skripte und sonstige Quellcodes » spoiler, bilder, aufzählungszeichen
Hallo Movert,
leider kann ich die Seiten von deinen Links nicht betrachten.
Es scheint so, als hättest du sie kopiert als du eingeloggt warst.
Dennoch werde ich mal versuchen, auf deine Fragen einzugehen, da ich denke, dass ich ungefähr weiß was du meinst.
Zitat von Movert
1) vBulletin Spoiler, die so aussehen, und dessen Rahmen farbe sich durch den Color Tags ändern lässt
Das könnte schwierig werden, ist in meinen Augen auch etwas sinnlos. 
Wenn du direkt die Farbcodes nutzt, dann werden im generierten Beitrag letztendlich FONT-Tags verwendet, beim Style-BBCode sind es letztlich SPAN-Tags.
Diese sind eben standardmäßig nur für Schriftfarben zuständig.
Du könntest nur versuchen, eigene alternative Farb-Codes festzulegen, welche noch die Border-Eigenschaft im Style-Attribut des Elementes oder sie in einer zugehörigen CSS-Anweisung setzt.
Allerdings vererbt sich diese Anweisung evtl. auch auf andere Rahmen von Elementen innerhalb des neuen Farb-Codes.
Und da der Spoiler wahrscheinlich bereits standardmäßig eine Rahmenfarbe spendiert bekommen hat, würde der Standad-HPM-Spoiler somit auch nichtmal überschrieben.
Alternativ könntest du evtl. den HPM-Spoiler kopieren und deinen eigenen BBCode daraus ableiten.
Das DIV-Element mit der CSS-Klasse ".hpm_spoiler" konnte ich allerdings auch nur überschreiben, indem ich nicht nur "border-color" verwendet, sondern den Rand komplett neu definiert habe:
border:1px solid red;
Wahrscheinlich war dann aber auch nur der alte Rand irgendwie überlagert.
Gebe deiner Spoiler-Variante noch irgendwie ein Attribut wie z.B. "{{color}}" mit, das du dann z.B. im Style-Attribut des DIV-Elementes, welches die CSS-Klasse ".hpm_spoiler" besitzt, verwendest:
style="border:1px solid {{color}};"
Je nach verwendetem Spoiler muss du da halt ein wenig herumprobieren und anpassen.
Zitat von Movert
2) Bilder automatisch verkleiner und vergrößern
Da werf ich einfach mal gleich zwei Links ein:
Bilderverkleinerungssript
Thumbnails in Beiträgen
Da ist evtl. bereits genau das schon dabei, was du suchst.
Zitat von Movert
3) Ein system für Aufzählungszeichen. Man drückt auf ein Symbol, und dann geht das wie bei vBulletin, dass man in die POP Up box eingibt, nacheinander die Stichpunkte.
Eine Liste in einfacher Form kannst du z.B. auch hier im Forum beim Schreiben eines Beitrages verwenden.
Die Listen-Codes findest du oben bei dem Symbol, welches wie ein Notizblock aussieht.
Eine Liste kann beispielsweise so aussehen:
Listen-Demo:
• Punkt 1
Punkt 1.1
Punkt 1.2
• Punkt 2
» Punkt 3
» Punkt 4
• Punkt 5
Der zugehörige BBCode wäre dieser hier:
2
3
4
5
6
7
8
9
10
[b]Listen-Demo:[/b]
[list]
[tab][*]Punkt 1
[tab][tab]Punkt 1.1
[tab][tab]Punkt 1.2
[tab][*]Punkt 2
[tab][}}]Punkt 3
[tab][}}]Punkt 4
[tab][*]Punkt 5
[/list]
Da einer der ersten Spoiler zuerst augenscheinlich ein Problem mit Listen hatte, habe ich damals beim Beitrag zum Spoiler-Button eine kleine Erklärung zu Listen geliefert.
Sie gibt auch an, wie BBCodes für Listen erstellt werden könnten.
Mit den erweiterten BBCodes, für welche inzwischen mit dem Start-Tag auch gleich das zugehörige End-Tag eingegeben werden kann,
muss wenigstens nicht mehr jedes End-Tag in einen extra Code gepackt werden.
Es bildet zwar keine Codestruktur für eine richtige HTML-Liste, sieht aber optisch für einen User genau so aus.
Dafür solltest du dich evtl. noch ein wenig über Listen in HTML informieren.
Aber HTML-Code für Listen 1:1 in BBCodes umzusetzen wäre im Prinzip für den User, als würde er gleich in HTML Listen schreiben.
Also im Endeffekt ist wohl der Spoiler das problematischste.
Ansonsten noch viel Spaß mit den anderen Sachen!
Zitat von Movert
Das ist schonmal gut, aber wie kann ich das wie im Beispiel machen, mit diesem Rahmen, und der Anzeige des VOllbildes, also "Klicke Hier, um das Orginalbild (600x400px) zu sehen."
Hi Movert,
wie schon oben geschrieben, kann ich deine Beispiele nicht ansehen.
Entweder musst du eine Alternative finden oder Screenshots davon anfertigen und die funktionsweise genauer beschreiben.
Ein alternatives Codefeld einzubinden wird so nicht funktionieren.
Sobald du Code einbinden möchtest, musst du die Code-Tags benutzen.
Und diese werden nunmal sofort so formatiert.
Wenn du aber generell den Code anders formatieren möchtest, könntest du das über die CSS-Klasse "codeblock".
Dieses DIV enthält die Zeilenangaben und auch die Codes selbst.
Dabei beziehen sich die Klassen "codelines" und "code" jeweils nur auf die Zeilennummer bzw. Code-Teile.
Zeilennummern kannst du dann mit "display:none;" in der entsprechenden CSS-Klasse permanent ausblenden.
Um all diese Elemente drumherum liegt dann noch das DIV "bbcode_code".
Benutze also diese Klassen, um dein Code-Block etwas an deine Wünsche anzupassen.
Syntaxhighlighting wird zur Zeit noch nicht von Xobor unterstützt.
Ich habe dazu schon vor langer Zeit eine Anfrage im Support-Forum gestellt.
Zum Einbinden der Bilder habe ich inzwischen noch eine offiziell unterstützte Funktion entdeckt.
Im Support-Forum gibt es im Beitrag Bilder in Beitrag einbinden mehr Informationen dazu.
Allerdings ist dies auch nur eine sehr einfache Möglichkeit, sogar weniger umfangreich als die von mir vorgeschlagenen Thumbnails, dafür aber offiziell.
Hey Movert, nur ganz kurz.
Also heute werde ich sowieso zu nichts mehr kommen.
Aber vorab noch die Frage, ob es unbedingt genauso aussehen muss bei den Bildern.
Ansonsten würde ich vorschlagen, du benutzt einfach immer das vorgeschlagene Thumbnail-Skript ohne Parameter, da sich dann die Bilder bei Klick in der Seite vergrößern.
Bei der Foren-Code-Ersetzung schreibst du noch einfach "Klicke auf das Thumbnail, um das Bild in Original-Größe anzuzeigen" oder sowas ähnliches vor oder nach die Elemente des Thumbnails.
Ich persönlich klicke lieber auf das eigentliche Bild als auf eine kleine Leiste...
Bei den Foren-Codes geht es eben nicht anders als den Standard-Container umzustylen.
Aber die Zeilen-Zahlen werden ja nicht mehr aus Versehen mitmarkiert und -kopiert.
Aber ohne Zugriffs-Möglichkeiten per PHP und Zugriff auf die Original-Deteien lässt sich da nicht mehr machen.
Hallo Movert,
für dein Problem mit den fehlenden Farben in den Code-Boxen habe ich nun einen Workaround für Syntax-Highlighting veröffentlicht.
Ich hoffe, dass sich damit deine Probleme bezüglich des Code-Feldes nun gelöst haben.
Viel Spaß damit!