29
Entwicklertagebuch: Codeblöcke auf unseren Seiten
Hallo Administrator User,
Unsere Codeblöcke werden ab sofort anders dargestellt.
In Zukunft kommen neue Typen dazu. Hier ein Beispiel für ein PHP-Script:
Die Codeblöcke können nun direkt per Copy&Paste kopiert werden. Das zusätzliche Fenster für den Quellcode fällt weg. Die Zeilennummern werden erst dann eingeblendet, wenn ein Codeblock aus mehr als nur einer Zeile besteht. Die Zeilen werden ab sofort nicht mehr Zwangsumgebrochen, es erscheint bei Bedarf eine Scrollbar.
Diese Änderung sind ein erster Teil der neuen Version unserer Seite. Später kommt noch die automatische Erkennung von mehreren Scriptsprachen und das Einfärben bzw. das Erkennen von Variablen, Konstanten etc. dazu.
Dabei soll unser Text-Parser (das ist die Programmierung, die unsere Formatierungen in eine lesbare Seite umwandelt) anhand von z.B. "<?php" oder "/bin/bash" Kürzeln in den Codeblöcken die Skripte automatisch erkennen, ohne das man den Typ angeben muss.
Die Abstände der Codeblöcke zum Text braucht ihr nicht im Editor per 'Return' angeben, dass wird nun per CSS gemacht. Evtl müsst ihr eure Texte oder Anleitungen dafür etwas anpassen.
Ich hoffe die Änderungen gefallen und freue mich, wie immer, auf Euer Feedback
Gruß
Frank
Unsere Codeblöcke werden ab sofort anders dargestellt.
Mit werden Codeblöcke erstellt Mit werden Variablen, Funktionen, Konstanten etc. farblich hervorgehoben.In Zukunft kommen neue Typen dazu. Hier ein Beispiel für ein PHP-Script:
<?php
if (extension_loaded("sodium")) {
$constants = get_defined_constants(true);
var_dump([
SODIUM_LIBRARY_VERSION,
get_extension_funcs('sodium'),
$constants["sodium"]
]);
} else {
// sodium not found
}Mit werden die Zeilennummern komplett ausgeblendet.
Egal ob der Text mehrere Zeilen hat.Die Codeblöcke können nun direkt per Copy&Paste kopiert werden. Das zusätzliche Fenster für den Quellcode fällt weg. Die Zeilennummern werden erst dann eingeblendet, wenn ein Codeblock aus mehr als nur einer Zeile besteht. Die Zeilen werden ab sofort nicht mehr Zwangsumgebrochen, es erscheint bei Bedarf eine Scrollbar.
Diese Änderung sind ein erster Teil der neuen Version unserer Seite. Später kommt noch die automatische Erkennung von mehreren Scriptsprachen und das Einfärben bzw. das Erkennen von Variablen, Konstanten etc. dazu.
Dabei soll unser Text-Parser (das ist die Programmierung, die unsere Formatierungen in eine lesbare Seite umwandelt) anhand von z.B. "<?php" oder "/bin/bash" Kürzeln in den Codeblöcken die Skripte automatisch erkennen, ohne das man den Typ angeben muss.
Die Abstände der Codeblöcke zum Text braucht ihr nicht im Editor per 'Return' angeben, dass wird nun per CSS gemacht. Evtl müsst ihr eure Texte oder Anleitungen dafür etwas anpassen.
Ich hoffe die Änderungen gefallen und freue mich, wie immer, auf Euer Feedback
Gruß
Frank
Auf Facebook teilen
Auf Twitter teilen
Auf Reddit teilen
Auf Linkedin teilenBitte markiere auch die Kommentare, die zur Lösung des Beitrags beigetragen haben
Content-ID: 536281
Url: https://administrator.de/contentid/536281
Ausgedruckt am: 21.11.2024 um 09:11 Uhr
29 Kommentare
Neuester Kommentar
@142232
Laut meiner Analyse hat das aber kaum einer genutzt (unter 1% Erwähnungen in den Kommentaren). Der Nachteil mit Zeilennummer war, dass man den Code oder Text nicht einfach per Copy&Paste direkt aus dem Beitrag kopieren konnte. Das hat mich persönlich mehr gestört, als auf die Zeilennummer zu verweisen. Man musste immer erst den Quellcode Editor öffnen um es gescheit zu kopieren (gerade wenn man Anleitungen nachvollziehen wollte).
Das ist richtig, da soll später ein Popover-Menü erscheinen (wenn man über den Codeblock fährt), wo man den gesamten Code per klick kopieren kann.
@Lochkartenstanzer
Evtl. baue ich in das Popover-Menü eine zusätzliche Ansicht mit Zeilen ein. Ich schau mal ob es passt.
Gruß
Frank
Hm, also die Zeilennummern waren in der Hinsicht hilfreich das man dem TO eine Zeilennummer nennen konnte wenn man sich auf etwas bezog.
Laut meiner Analyse hat das aber kaum einer genutzt (unter 1% Erwähnungen in den Kommentaren). Der Nachteil mit Zeilennummer war, dass man den Code oder Text nicht einfach per Copy&Paste direkt aus dem Beitrag kopieren konnte. Das hat mich persönlich mehr gestört, als auf die Zeilennummer zu verweisen. Man musste immer erst den Quellcode Editor öffnen um es gescheit zu kopieren (gerade wenn man Anleitungen nachvollziehen wollte).
Zusätzlich geht jetzt ein STRG+A nicht mehr um den gesamten Code aus dem Quellcode-Fenster auszuwählen und zu kopieren
Das ist richtig, da soll später ein Popover-Menü erscheinen (wenn man über den Codeblock fährt), wo man den gesamten Code per klick kopieren kann.
@Lochkartenstanzer
Sinnvoller wäre es vielleicht, einen Button zum Ein- und Ausblenden von Nummern zu machen.
Evtl. baue ich in das Popover-Menü eine zusätzliche Ansicht mit Zeilen ein. Ich schau mal ob es passt.
Gruß
Frank
Warum ihr jetzt einen extra Beitrag dafür aufgemacht und nicht den Hauptbeitrag dazu genommen habt, ist mir ein Rätsel.
Frank
Frank
Ich habe übrigens nur auf die Frage geantwortet, war aber irgendwie der Meinung, daß das egentlich ein Kommentar hierzu war, weil ich übersehen habe, daß das eine Frage und nicht ein Kommentar war.
lks
Warum ihr jetzt einen extra Beitrag dafür aufgemacht und nicht den Hauptbeitrag dazu genommen habt, ist mir ein Rätsel.
Der Wissensbeitrag dazu ist an mir vorbei gegangen, sorry hatte ich nicht gesehen.[OFFTOPIC]
Aber noch kurz zu was anderem was mir neuerdings übelst aufstößt, und auch ein paar meiner Kollegen:
Normalerweise lasse ich hier ja den Werbeblocker ausgeschaltet um das Forum zu unterstützen, aber seitdem jetzt neuerdings auf jeder Detailseite unten ein selbst laufendes Video von der Platform *.pepsia.com abläuft bin ich gezwungen ihn einzuschalten, erstens weil das automatische Gezucke tierisch nervt und vom Beitrag ablenkt, zweitens erheblich zusätzlichen Traffic erzeugt (gerade Mobil gehen da in ein paar Sekunden 50-100MB flöten, in DE ist Traffic ja nicht gerade umsonst), und drittens die Seite auch verlangsamt. Ab und zu könnte ich das ja verstehen, aber bei jedem Beitrag immer und immer wieder, sehe ich persönlich nicht ein.
[/OFFTOPIC]
Hi,
hier und da teste ich mal neue Werbemöglichkeiten. Aber du hast recht, die Pepsia-Videos stören den Lesefluss, verbraucht viel Traffic und bringt im Gegenzug auch nicht viel ein. Daher habe ich sie wieder deaktiviert. Danke für Dein Feedback und nicht vergessen, den Werbeblocker wieder auszuschalten
Davon lebt die Seite!
Gruß
Frank
Aber noch kurz zu was anderem was mir neuerdings übelst aufstößt, und auch ein paar meiner Kollegen:
hier und da teste ich mal neue Werbemöglichkeiten. Aber du hast recht, die Pepsia-Videos stören den Lesefluss, verbraucht viel Traffic und bringt im Gegenzug auch nicht viel ein. Daher habe ich sie wieder deaktiviert. Danke für Dein Feedback und nicht vergessen, den Werbeblocker wieder auszuschalten
Davon lebt die Seite!
Gruß
Frank
TOP 👍 👍
Gruß s.
Danke für Dein Feedback und nicht vergessen, den Werbeblocker wieder auszuschalten
Done! Ebenso herzlichen Dank für das prompte Reagieren.Gruß s.
Hallo Frank,
wie von anderen schon geschrieben, waren die Zeilennummern recht gut um sich auf bestimmte Zeilen beziehen zu können. Was ich aber noch schlimmer finde, ist, dass lange Zeilen nun einfach umgebrochen werden, ohne dass erkennbar ist, dass sie zusammen gehören.
Grüße
Steffen
wie von anderen schon geschrieben, waren die Zeilennummern recht gut um sich auf bestimmte Zeilen beziehen zu können. Was ich aber noch schlimmer finde, ist, dass lange Zeilen nun einfach umgebrochen werden, ohne dass erkennbar ist, dass sie zusammen gehören.
Grüße
Steffen
2
Zitat von @rubberman:
wie von anderen schon geschrieben, waren die Zeilennummern recht gut um sich auf bestimmte Zeilen beziehen zu können. Was ich aber noch schlimmer finde, ist, dass lange Zeilen nun einfach umgebrochen werden, ohne dass erkennbar ist, dass sie zusammen gehören.
Dito da stimme ich absolut zu, macht das direkte Lesen und Interpretieren längerer Codes jetzt ziemlich unangenehm ohne Umkopieren in den Editor seiner Wahl.wie von anderen schon geschrieben, waren die Zeilennummern recht gut um sich auf bestimmte Zeilen beziehen zu können. Was ich aber noch schlimmer finde, ist, dass lange Zeilen nun einfach umgebrochen werden, ohne dass erkennbar ist, dass sie zusammen gehören.
So was in der Art wie CodeMirror würde ich mir hier wünschen.
Grüße Uwe
2
Hallo,
auf vielseitigen Wunsch habe ich die neuen Codeblöcke um Zeilennummern erweitert. Hat ein Codeblock mehr als 1 Zeile, werden die Zeilennummer automatisch angezeigt. Mit kann man die Zeilennummern wieder komplett ausblenden. Ich habe den Originaltext oben dementsprechend geändert.
Auch werden die Zeilen nicht mehr Zwangsumgebrochen. Es erscheint bei Bedarf nun eine Scrollbar.
@colinardo CodeMirror ist leider zu langsam. Gerade bei großen Anleitungen (wie z.B. Deine) würde das Javascript von CodeMirror die Seite extrem verlangsamen, da die Autoren der Beiträge oft viele Codeblöcke benutzen.
Ich denke mit der Zeit bekommen wir eine vergleichbare Lösung, die viel schneller ist, selbst hin.
Danke für Euer Feedback
Gruß
Frank
auf vielseitigen Wunsch habe ich die neuen Codeblöcke um Zeilennummern erweitert. Hat ein Codeblock mehr als 1 Zeile, werden die Zeilennummer automatisch angezeigt. Mit kann man die Zeilennummern wieder komplett ausblenden. Ich habe den Originaltext oben dementsprechend geändert.
Auch werden die Zeilen nicht mehr Zwangsumgebrochen. Es erscheint bei Bedarf nun eine Scrollbar.
@colinardo CodeMirror ist leider zu langsam. Gerade bei großen Anleitungen (wie z.B. Deine) würde das Javascript von CodeMirror die Seite extrem verlangsamen, da die Autoren der Beiträge oft viele Codeblöcke benutzen.
Ich denke mit der Zeit bekommen wir eine vergleichbare Lösung, die viel schneller ist, selbst hin.
Danke für Euer Feedback
Gruß
Frank
2
Servus Frank,
so wie es jetzt ist reicht das ja auch, aber leider wird jetzt beim Copy n' Paste in den Boxen mit der Zeilennummerierung zwischen jeder Code-Zeile wieder eine Leerzeile eingefügt.
Habe schon ein einige Beschwerden bekommen ala dein "Code funktioniert doch nicht", eben aus dem Grund der zusätzlich generierten Leerzeilen beim Kopieren (bei den jeweiligen Codes war das relevant).
Grüße Uwe
so wie es jetzt ist reicht das ja auch, aber leider wird jetzt beim Copy n' Paste in den Boxen mit der Zeilennummerierung zwischen jeder Code-Zeile wieder eine Leerzeile eingefügt.
Habe schon ein einige Beschwerden bekommen ala dein "Code funktioniert doch nicht", eben aus dem Grund der zusätzlich generierten Leerzeilen beim Kopieren (bei den jeweiligen Codes war das relevant).
Grüße Uwe
Aaargh....Die Codeblöcke in den PNs sind ebenfalls unvollständig, Code wird unvollständig angezeigt und nicht scrollbar. Das bekommen die TOs nicht gebacken das da raus zu kopieren.
Hi,
@colinardo,
ruhig Blut. Das mit den Leerzeichen habe ich gerade behoben. Ich hatte es auf MacOS getestet und da gab es die Leerzeichen nicht (ich entwickle die Seite auf einem Mac). Wenn so ein Fehler auftritt, gleich eine PN schreiben und ich behebe das.
Auch sollten die PNs jetzt wieder funktionieren. Bitte mal prüfen!
Was meinst du denn damit genau? Ich habe es gerade getestet und die Codeblöcke in den Mails werden richtig dargestellt (mit Scrollbalken, wenn sie zu groß für die sichtbare Fläche sind). Da sich das CSS geändert hat, bitte mal den Cache löschen (oder shift-Reload drücken).
Es ist nicht einfach für so viele Systeme und Browser die optimale Code-Lösung zu finden
Gruß
Frank
@colinardo,
ruhig Blut. Das mit den Leerzeichen habe ich gerade behoben. Ich hatte es auf MacOS getestet und da gab es die Leerzeichen nicht (ich entwickle die Seite auf einem Mac). Wenn so ein Fehler auftritt, gleich eine PN schreiben und ich behebe das.
Auch sollten die PNs jetzt wieder funktionieren. Bitte mal prüfen!
Die Codeblöcke in den PNs sind ebenfalls unvollständig, Code wird unvollständig ...
Was meinst du denn damit genau? Ich habe es gerade getestet und die Codeblöcke in den Mails werden richtig dargestellt (mit Scrollbalken, wenn sie zu groß für die sichtbare Fläche sind). Da sich das CSS geändert hat, bitte mal den Cache löschen (oder shift-Reload drücken).
Es ist nicht einfach für so viele Systeme und Browser die optimale Code-Lösung zu finden
Gruß
Frank
Kein Problem, ist wohl falsch rübergekommen, das war nicht bös gemeint .
Was meinst du denn damit genau? Ich habe es gerade getestet und die Codeblöcke in den Mails werden richtig dargestellt (mit Scrollbalken, wenn sie zu groß für die sichtbare Fläche sind). Da sich das CSS geändert hat, bitte mal den Cache löschen (oder shift-Reload drücken).
Also jetzt gehen die auch wieder für den User "nutzbar", vorher war der DIV rechts abgeschnitten und der Code nicht umgebrochen (wahrscheinlich doch der Cache).
Was hier jedoch fehlt (OS Windows 10 / Browser Firefox 72.0.2) ist deine genannte Scrollbar und der graue Hintergrund und die Abstände (cache vollständig gelöscht)
Hier das Bild davon
.Das mit den Leerzeichen habe ich gerade behoben. Ich hatte es auf MacOS getestet und da gab es die Leerzeichen nicht (ich entwickle die Seite auf einem Mac). Wenn so ein Fehler auftritt, gleich eine PN schreiben und ich behebe das.
Auch sollten die PNs jetzt wieder funktionieren. Bitte mal prüfen!
Funktioniert ! Merci.Auch sollten die PNs jetzt wieder funktionieren. Bitte mal prüfen!
Die Codeblöcke in den PNs sind ebenfalls unvollständig, Code wird unvollständig ...
Was meinst du denn damit genau? Ich habe es gerade getestet und die Codeblöcke in den Mails werden richtig dargestellt (mit Scrollbalken, wenn sie zu groß für die sichtbare Fläche sind). Da sich das CSS geändert hat, bitte mal den Cache löschen (oder shift-Reload drücken).
Was hier jedoch fehlt (OS Windows 10 / Browser Firefox 72.0.2) ist deine genannte Scrollbar und der graue Hintergrund und die Abstände (cache vollständig gelöscht)
Hier das Bild davon
Es ist nicht einfach für so viele Systeme und Browser die optimale Code-Lösung zu finden
Verstehe ich vollkommen.Zitat von @Frank:
Es ist nicht einfach für so viele Systeme und Browser die optimale Code-Lösung zu finden
Es ist nicht einfach für so viele Systeme und Browser die optimale Code-Lösung zu finden
.Mach doch für den Codeblock einfach einen downloadlink, der den Teil im Codeblock direkt als txt herunterladen läßt. Sollen doch die "Kopierer" das direkt aus Notepad herauskipieren, wenn sie nur einen Teil brauchen.
So
Hi,
@Lochkartenstanzer
ich hatte ja schon geschrieben, in der neuen Version ist ein Popover mit "Alles kopieren" und "Drucken" dabei.
Das hier in die alte Version einzubauen, wäre zu aufwendig.
@colinardo
Laut Screenshot ist das aber immer noch nicht richtig. Die Codeblöcke werden überall gleich dargestellt. Es gibt keinen Unterschied zwischen der Detailseite und einer PN. Um den Codeblock sollte eine Farbe sein und die Scrollbalken sollte bei Code-Überlänge angezeigt werden. Ich melde mich per PN.
Gruß
Frank
@Lochkartenstanzer
ich hatte ja schon geschrieben, in der neuen Version ist ein Popover mit "Alles kopieren" und "Drucken" dabei.
Das hier in die alte Version einzubauen, wäre zu aufwendig.
@colinardo
Laut Screenshot ist das aber immer noch nicht richtig. Die Codeblöcke werden überall gleich dargestellt. Es gibt keinen Unterschied zwischen der Detailseite und einer PN. Um den Codeblock sollte eine Farbe sein und die Scrollbalken sollte bei Code-Überlänge angezeigt werden. Ich melde mich per PN.
Gruß
Frank
Mit kann man die Zeilennummern wieder komplett ausblenden.
Interessanterweise funktioniert das auch mit "type=plain" ! Bug or Feature ? Zitat von @aqui:
Mit kann man die Zeilennummern wieder komplett ausblenden.
Interessanterweise funktioniert das auch mit "type=plain" ! Bug or Feature ? Feature, da ich mich (und andere hier) manchmal verschreibe
Ihr solltet alle immer den Command: "type=" nehmen
Gruß
Frank
Ich auch...man driftet dann ins Englische und es kommt automatisch aus den Fingern.
Du solltest aber den Command: "typ=" nehmen (ohne e).
Denglisch? Parametername auf Deutsch Parameterwert auf Englisch oder wie jetzt ?Zitat von @Frank:
Feature, da ich mich (und andere hier) manchmal verschreibe
Du solltest aber den Command: "typ=" nehmen (ohne e).
Zitat von @aqui:
Mit kann man die Zeilennummern wieder komplett ausblenden.
Interessanterweise funktioniert das auch mit "type=plain" ! Bug or Feature ? Feature, da ich mich (und andere hier) manchmal verschreibe
Du solltest aber den Command: "typ=" nehmen (ohne e).
In den FAQs steht aber was anderes.
lks
Stimmt auch wieder ! Dann verhalten wir uns im Gegensatz zu dem was @Frank uns sagt mit type also genau Foren Regel konform ! 
Wenn das Euer einziges Problem ist
Stimmt, man sollte type= nehmen. Wir wollen ja nicht in die Denglish-Falle tappen. Ich korrigiere es gleich oben. Letztendlich egal, typ oder type - es wir immer beides funktionieren
Gruß
Frank
Stimmt, man sollte type= nehmen. Wir wollen ja nicht in die Denglish-Falle tappen. Ich korrigiere es gleich oben. Letztendlich egal, typ oder type - es wir immer beides funktionieren
Gruß
Frank
Hi Frank.
Du schreibst
Beispiel: Upgrade auf Windows 10 - Phase Safe OS - versuch da mal, das Logfile schnell zu kopieren um es ins lokale notepad++ einzufüfgen - das nervt ein wenig.
Du schreibst
Der Nachteil mit Zeilennummer war, dass man den Code oder Text nicht einfach per Copy&Paste direkt aus dem Beitrag kopieren konnte
Das konnte man mit einem weiteren Klick. Beispiel: Bitlocker-Verschlüsselung und -Monitoring ohne MBAM - da klicke ich auf "Quelltext" neben dem Codeblock und dann kann ich sowohl Zeilen selektieren, als auch CTRL-A nutzen - Letzteres geht jetzt nicht mehr - schade.Beispiel: Upgrade auf Windows 10 - Phase Safe OS - versuch da mal, das Logfile schnell zu kopieren um es ins lokale notepad++ einzufüfgen - das nervt ein wenig.
@DerWoWusste
Das hatte ich oben bereits mehrfach erwähnt, in der neuen Version (V6) gibt es ein Popover mit den Punkten "Alles kopieren" und "Drucken". Hier in die alter Version (V5.8) werde ich das nicht mehr integrieren. Außerdem kommt es eher vor, dass man Commands oder kurze Teile kopiert z.B. um eine Anleitung nachzuvollziehen, als das man ganze Logfiles kopiert. Aber wie gesagt, in der nächsten Generation von unserer Seite ist "Alles kopieren" wieder mit dabei. Die eine Idee mit dem Download als Text fand ich auch gut.
Gruß
Frank
Das konnte man mit einem weiteren Klick ...
Das hatte ich oben bereits mehrfach erwähnt, in der neuen Version (V6) gibt es ein Popover mit den Punkten "Alles kopieren" und "Drucken". Hier in die alter Version (V5.8) werde ich das nicht mehr integrieren. Außerdem kommt es eher vor, dass man Commands oder kurze Teile kopiert z.B. um eine Anleitung nachzuvollziehen, als das man ganze Logfiles kopiert. Aber wie gesagt, in der nächsten Generation von unserer Seite ist "Alles kopieren" wieder mit dabei. Die eine Idee mit dem Download als Text fand ich auch gut.
Gruß
Frank
Entschuldige, das hatte ich nicht begriffen 
Gar kein Problem! Evtl hatte ich es auch schlecht formuliert
Gruß
Frank
Gruß
Frank
Also was mir noch aufgefallen ist (nicht weiter schlimm, nur ein Hinweis), ist das einzeilige Codeblöcke komplett markiert werden wenn man sie nur ein einziges mal anklickt selektives Kopieren wie vorher ist dann nicht möglich.
Hi @142232,
das ist eher ein Feature bzw. ein Test. Meist sind Einzeiler Bash oder Commando Befehle die damit sofort markiert werden. Damit teste ich, ob in der neuen Version Einzeiler Code sofort markieren sollen, oder ob man, wie bei Mehrzeiler, selektiv auswählen kann (ist im CSS nur ein einziger Befehl, um das zu ändern). Was meint ihr?
Gruß
Frank
das ist eher ein Feature bzw. ein Test. Meist sind Einzeiler Bash oder Commando Befehle die damit sofort markiert werden. Damit teste ich, ob in der neuen Version Einzeiler Code sofort markieren sollen, oder ob man, wie bei Mehrzeiler, selektiv auswählen kann (ist im CSS nur ein einziger Befehl, um das zu ändern). Was meint ihr?
Gruß
Frank
Zitat von @Frank:
Hi @142232,
das ist eher ein Feature bzw. ein Test. Meist sind Einzeiler Bash oder Commando Befehle die damit sofort markiert werden. Damit teste ich, ob in der neuen Version Einzeiler Code sofort markieren sollen, oder ob man, wie bei Mehrzeiler, selektiv auswählen kann (ist im CSS nur ein einziger Befehl, um das zu ändern). Was meinst ihr?
Ach so, hmm also mich irritiert es eher, ich bin gewohnt wenn sich alles so verhält wie man es von überall gewohnt ist, da denkt man im ersten Augenblick, shit was ist jetzt wieder kaputt. Just my 2 cent.Hi @142232,
das ist eher ein Feature bzw. ein Test. Meist sind Einzeiler Bash oder Commando Befehle die damit sofort markiert werden. Damit teste ich, ob in der neuen Version Einzeiler Code sofort markieren sollen, oder ob man, wie bei Mehrzeiler, selektiv auswählen kann (ist im CSS nur ein einziger Befehl, um das zu ändern). Was meinst ihr?
