Bloques de código Markdown: cercas, resaltado y exportación
Escribe cercas Markdown correctas, elige el lenguaje, resuelve líneas largas y exporta una imagen legible sin perder la fuente copiable.
Una imagen de código resulta útil en una diapositiva o un anuncio cuando el lector necesita ver un ejemplo breve de inmediato. Acompáñala de una fuente que se pueda copiar. Abre Código a imagen para un fragmento independiente o conserva los bloques cercados dentro del documento Markdown si importa la explicación que los rodea.
Un bloque cercado conserva el código como tal, sin interpretar su puntuación como Markdown normal. Coloca la cerca de apertura en su propia línea, añade un identificador como javascript y ciérrala tras la última línea de código. Para un identificador breve dentro de una frase usa acentos graves en línea; para varias líneas, un bloque.
Esta fuente Markdown muestra la propia cerca. La exterior tiene cuatro acentos graves para que la interior, de tres, siga siendo visible.
```javascript
console.log("Ready");
```
La etiqueta de lenguaje orienta el resaltado si el renderizador la admite. No ejecuta el código, instala dependencias ni demuestra que funcione. Si los colores parecen incorrectos, revisa la etiqueta y el tema antes de cambiar el programa.
Copia el siguiente JavaScript en Código a imagen, selecciona JavaScript y revisa la vista previa. El ejemplo guarda tres nombres de colores y construye una cadena de estado. Es código de demostración, no una prueba de rendimiento del producto.
const palette = ["cyan", "amber", "coral"];
function renderStatus(format) {
return `${format}: ${palette.length} colors`;
}
console.log(renderStatus("PNG"));
Usa el resultado en un adelanto de tutorial o una diapositiva que explique cómo se usa la longitud del array. Mantén el título o el pie fuera del programa para distinguir la explicación del código ejecutable.
Una URL larga, una expresión muy anidada o un objeto ancho pueden volver ilegible la imagen. Pregúntate primero si hace falta el ejemplo entero. Elimina preparación ajena al tema solo si el fragmento sigue teniendo sentido e indica cuándo has abreviado el código.
Después, amplía el lienzo o reformatea la fuente en puntos seguros para la sintaxis. No introduzcas saltos dentro de una cadena solo para encajarla en la tarjeta. Tampoco dependas del desplazamiento horizontal: una imagen fija no muestra lo que quedó fuera de la captura. Revisa la línea más larga y la llave final en el archivo descargado.
Elige un tema donde comentarios, cadenas y signos se lean al tamaño final. El color debe apoyar la explicación, no ser su único vehículo. Elimina tokens, direcciones privadas y datos personales antes de exportar; recortarlos después deja una fuente arriesgada.
Publica el código como texto seleccionable o enlaza el ejemplo completo. El texto alternativo puede explicar qué demuestra; una transcripción larga debe ir en el texto cercano. En documentos paginados comprueba también los saltos de página: un buen diseño de imagen no garantiza un buen PDF.
Crea una imagen de código. Para documentos, consulta cómo conservar el resaltado en PDF; para el texto y las listas del entorno, usa la guía práctica de Markdown.