Como exibir blocos de código no meio

E como escrever código embutido e incorporar código para destaque de sintaxe

Médio torna mais fácil adicionar blocos de código e embutir

O meio tem um atalho oculto que transforma o texto em texto simples ...

if (desenvolvedor === verdadeiro) {

seguir (this.mediumPublication);

}

… Em um bloco de código formatado:

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

Para fazer isso, selecione o texto e pressione:

  • Windows : Control + Alt + 6
  • Mac : Command + Option + 6
  • Linux : Control + Alt + 6

Atualização de 19 de outubro de 2016: o Medium agora também suporta a convenção comum de iniciar um bloco de código com triplos back-ticks. Se você digitar `` `em uma nova linha, o Médio mudará agora para o modo de entrada de código. Um grande obrigado a Luke Esterkyn e ao resto da equipe do Medium por implementar isso!

Você também pode destacar o código embutido selecionando-o e clicando na tecla crase (`). Por exemplo, você pode formatar texto como código freeCodeCamp()bem no meio de uma frase.

Você também pode incorporar gists GitHub colando seu URL em uma linha em branco e pressionando Enter:

Como incorporar aplicativos da web

Como um bônus, você pode incorporar aplicativos executáveis ​​diretamente no Medium. Apenas no caso de eles não renderizarem corretamente nos aplicativos móveis do Medium, eu recomendo incluir links abaixo de cada uma das incorporações como um fallback.

Cole um URL CodePen.io no Meio e pressione Enter:

Veja meu CodePen aqui.

Você também pode fazer isso com JSFiddle.net:

Veja meu JSFiddle aqui.

Mas não use imagens de código.

Mesmo que pareça conveniente fazer capturas de tela do seu código e colá-las no Medium, não faça isso.

O Medium ainda não tem uma opção de texto alternativo, então isso tornará seu código completamente inacessível para desenvolvedores com deficiência visual. E sim, eles estão lá fora.

Você também não pode alterar o tamanho da fonte de uma imagem estática, o que dificulta a leitura em um telefone celular (que é onde a maioria das pessoas lê no Médio).

Finalmente, isso torna impossível para os leitores copiar e colar seu código.

Eu sei, eu sei - você não deve copiar e colar código de qualquer maneira.

Mas vamos enfrentá-lo - as pessoas fazem. E a maioria das pessoas abandonará rapidamente seu tutorial se enfrentar a perspectiva de digitar muitos códigos manualmente.

Então, para recapitular:

  • usar blocos de código nativo do Medium
  • ou incorporar gists GitHub
  • use exemplos de trabalho de CodePen e JSFiddle sempre que possível
  • mas não cole imagens de código

Feliz programação e escrita sobre programação!

Eu só escrevo sobre programação e tecnologia. Se você me seguir no Twitter, não vou perder seu tempo. ?