So zeigen Sie Codeblöcke in Medium an

Und wie man Inline-Code schreibt und Code für die Syntaxhervorhebung einbettet

Mittel erleichtert das Hinzufügen von Codeblöcken und Inline

Medium hat eine versteckte Verknüpfung, mit der Text in einfachen Text umgewandelt wird.

if (Entwickler === true) {

folgen (this.mediumPublication);

}}

… In einen formatierten Codeblock:

if (developer === true) {
 follow(this.mediumPublication);
}

Wählen Sie dazu den Text aus und drücken Sie:

  • Windows : Strg + Alt + 6
  • Mac : Befehl + Option + 6
  • Linux : Strg + Alt + 6

Update 19. Oktober 2016: Medium unterstützt jetzt auch die übliche Konvention, einen Codeblock mit dreifachen Back-Ticks zu starten. Wenn Sie in einer neuen Zeile `` `eingeben, wechselt Medium jetzt in den Code-Eingabemodus. Ein großes Dankeschön an Luke Esterkyn und den Rest des Medium-Teams für die Umsetzung!

Sie können Code auch inline markieren, indem Sie ihn auswählen und dann auf die Backtick-Taste (`) klicken. Sie können beispielsweise Text freeCodeCamp()mitten in einem Satz als Code formatieren .

Sie können GitHub-Gists auch einbetten, indem Sie ihre URL in eine leere Zeile einfügen und dann die Eingabetaste drücken:

Einbetten von Web-Apps

Als Bonus können Sie ausführbare Apps direkt in Medium einbetten. Nur für den Fall, dass diese in den mobilen Apps von Medium nicht richtig gerendert werden, empfehle ich, Links unter die einzelnen Einbettungen als Fallback einzufügen.

Fügen Sie eine CodePen.io-URL in Medium ein und drücken Sie die Eingabetaste:

Sehen Sie sich hier meinen CodePen an.

Sie können dies auch mit JSFiddle.net tun:

Sehen Sie sich hier meine JSFiddle an.

Verwenden Sie jedoch keine Codebilder.

Auch wenn es praktisch erscheint, Screenshots Ihres Codes zu erstellen und in Medium einzufügen, tun Sie dies nicht.

Medium verfügt noch nicht über eine Alt-Text-Option. Daher ist Ihr Code für Entwickler mit Sehbehinderung völlig unzugänglich. Und ja, sie sind da draußen.

Sie können auch die Schriftgröße von statischen Bildern nicht ändern, was das Lesen auf einem Mobiltelefon (wo die meisten Leute Medium lesen) schwierig macht.

Dies macht es den Lesern schließlich unmöglich, Ihren Code zu kopieren und einzufügen.

Ich weiß, ich weiß - Sie sollten sowieso keinen Code kopieren und einfügen.

Aber seien wir ehrlich - die Leute tun es. Und die meisten Leute werden Ihr Tutorial schnell verlassen, wenn sie die Aussicht haben, viel Code manuell einzugeben.

Um es noch einmal zusammenzufassen:

  • Verwenden Sie die nativen Codeblöcke von Medium
  • oder GitHub-Gists einbetten
  • Verwenden Sie nach Möglichkeit Arbeitsbeispiele von CodePen und JSFiddle
  • Fügen Sie jedoch keine Codebilder ein

Viel Spaß beim Codieren und Schreiben über das Codieren!

Ich schreibe nur über Programmierung und Technologie. Wenn Sie mir auf Twitter folgen, werde ich Ihre Zeit nicht verschwenden. ?