Skip to main content

Inicio rápido para escribir en GitHub

Obtén información sobre las características de formato avanzadas creando LÉAME README para el perfil de GitHub.

Introducción

Markdown es un lenguaje fácil de leer y escribir para aplicar formato al texto sin formato. Puedes usar la sintaxis de Markdown, junto con algunas etiquetas HTML adicionales, para aplicar formato a la escritura en GitHub, en lugares como los archivos LÉAME del repositorio y los comentarios en las solicitudes de incorporación de cambios y los problemas. En esta guía, descubrirás algunas características de formato avanzadas creando o editando un archivo LÉAME para GitHub el perfil.

Si no estás familiarizado con Markdown, es posible que quieras empezar con "Escritura básica y sintaxis de formato" o el curso Comunicación con Markdown GitHub Skills.

Si ya tienes un archivo LÉAME de perfil, puedes seguir esta guía agregando algunas características al archivo LÉAME existente o creando un gist con un archivo Markdown llamado algo así como about-me.md. Para obtener más información, consulta "Creación de gists".

Creación o edición del archivo LÉAME de perfil

El archivo LÉAME de perfil permite compartir información sobre ti mismo con la comunidad en your GitHub Enterprise Server instance. El archivo LÉAME se muestra en la parte superior de la página del perfil.

Si aún no tienes un archivo LÉAME de perfil, puedes agregar uno.

  1. Crea un repositorio con el mismo nombre que el nombre de usuario de GitHub, inicializando el repositorio con un archivo README.md. Para más información, vea "Administración del archivo Léame del perfil".
  2. Edita el archivo README.md y elimina el texto de la plantilla (empezando por ### Hi there) que se agrega automáticamente al crear el archivo.

Si ya tienes un archivo LÉAME de perfil, puedes editarlo desde la página del perfil.

  1. En la esquina superior derecha de cualquier página de GitHub Enterprise Server, haga clic en la fotografía de perfil y luego en Your profile.

  2. Haz clic en el junto al archivo LÉAME de perfil.

    Captura de pantalla de una página de perfil, con el icono de lápiz resaltado junto al archivo LÉAME de perfil

Incorporación de una imagen para adaptarse a los visitantes

Puedes incluir imágenes en la comunicación en GitHub. Aquí, agregarás una imagen con capacidad de respuesta, como un banner, en la parte superior de tu archivo LÉAME de perfil.

Si usas el elemento HTML <picture> con la característica de elementos multimedia prefers-color-scheme, puedes agregar una imagen que cambie en función de si un visitante usa el modo claro o oscuro. Para más información, vea "Administración de la configuración de temas".

  1. Copia y pega el marcado siguiente en el archivo README.md.

    HTML
    <picture>
     <source media="(prefers-color-scheme: dark)" srcset="YOUR-DARKMODE-IMAGE">
     <source media="(prefers-color-scheme: light)" srcset="YOUR-LIGHTMODE-IMAGE">
     <img alt="YOUR-ALT-TEXT" src="YOUR-DEFAULT-IMAGE">
    </picture>
  2. Reemplaza los marcadores de posición del marcado por las direcciones URL de las imágenes elegidas. Como alternativa, para probar primero la característica, puedes copiar las direcciones URL de nuestro ejemplo siguiente.

    • Reemplaza YOUR-DARKMODE-IMAGE por la dirección URL de una imagen que se va a mostrar para los visitantes con el modo oscuro.
    • Reemplaza YOUR-LIGHTMODE-IMAGE por la dirección URL de una imagen que se va a mostrar para los visitantes con el modo claro.
    • Reemplaza YOUR-DEFAULT-IMAGE por la dirección URL de una imagen que se va a mostrar en caso de que ninguna de las otras imágenes pueda coincidir, por ejemplo, si el visitante usa un explorador que no admite la característica prefers-color-scheme.
  3. A fin de que la imagen sea accesible para los visitantes que usan un lector de pantalla, reemplaza YOUR-ALT-TEXT por una descripción de la imagen.

  4. Para comprobar que la imagen se ha representado correctamente, haz clic en la pestaña Vista previa.

Para obtener más información sobre el uso de imágenes en Markdown, consulta "Sintaxis de escritura y formato básicos".

Ejemplo

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="https://user-images.githubusercontent.com/25423296/163456776-7f95b81a-f1ed-45f7-b7ab-8fa810d529fa.png">
  <source media="(prefers-color-scheme: light)" srcset="https://user-images.githubusercontent.com/25423296/163456779-a8556205-d0a5-45e2-ac17-42d089e3c3f8.png">
  <img alt="Shows an illustrated sun in light mode and a moon with stars in dark mode." src="https://user-images.githubusercontent.com/25423296/163456779-a8556205-d0a5-45e2-ac17-42d089e3c3f8.png">
</picture>

Cómo se ve

Captura de pantalla de la pestaña Vista previa en modo claro, en la que se muestra una imagen de un sol sonriente

Incorporación de una tabla

Puedes usar tablas de Markdown para organizar la información. Aquí, usarás una tabla para presentarte clasificando algo, como los lenguajes de programación o los marcos que más usas, las cosas a las que dedicas el tiempo aprendiendo o tus aficiones favoritas. Cuando una columna de tabla contiene números, resulta útil alinear la columna a la derecha mediante la sintaxis --: situada debajo de la fila de encabezado.

  1. Vuelve a la pestaña Editar archivo.

  2. Para presentarte, dos líneas debajo de la etiqueta </picture>, agrega un encabezado ## About me y un párrafo corto sobre ti mismo, como el siguiente.

    ## About me
    
    Hi, I'm Mona. You might recognize me as GitHub's mascot.
    
  3. Dos líneas debajo de este párrafo, inserta una tabla copiando y pegando el marcado siguiente.

    Markdown
    | Rank | THING-TO-RANK |
    |-----:|---------------|
    |     1|               |
    |     2|               |
    |     3|               |
  4. En la columna de la derecha, reemplaza THING-TO-RANK por "Lenguajes", "Aficiones" o cualquier otra cosa, y rellena la columna con tu lista de cosas.

  5. Para comprobar que la tabla se ha representado correctamente, haz clic en la pestaña Vista previa.

Para obtener más información, consulta "Organización de la información con tablas".

Ejemplo

## About me

Hi, I'm Mona. You might recognize me as GitHub's mascot.

| Rank | Languages |
|-----:|-----------|
|     1| Javascript|
|     2| Python    |
|     3| SQL       |

Cómo se ve

Captura de pantalla de la pestaña Vista previa, en la que se muestra un encabezado "Acerca de mí" y una tabla representada con una lista de lenguajes

Incorporación de una sección contraída

Para mantener ordenado el contenido, puedes usar la etiqueta <details> a fin de crear una sección contraída expandible.

  1. A fin de crear una sección contraída para la tabla que has creado, encapsula la tabla en etiquetas <details>, como en el ejemplo siguiente.

    HTML
    <details>
    <summary>My top THINGS-TO-RANK</summary>
    
    YOUR TABLE
    
    </details>
  2. Entre las etiquetas <summary>, reemplaza THINGS-TO-RANK por lo que hayas clasificado en la tabla.

  3. Opcionalmente, para que la sección se muestre como abierta de manera predeterminada, agrega el atributo open a la etiqueta <details>.

    <details open>
    
  4. Para comprobar que la sección contraída se ha representado correctamente, haz clic en la pestaña Vista previa.

Ejemplo

<details>
<summary>My top languages</summary>

| Rank | Languages |
|-----:|-----------|
|     1| Javascript|
|     2| Python    |
|     3| SQL       |
  
</details>

Cómo se ve

Captura de pantalla de la pestaña Vista previa, con una sección contraída denominada "Mis lenguajes favoritos" marcada por una flecha desplegable

Incorporación de una cita

Markdown tiene muchas otras opciones para aplicar formato al contenido. Aquí, agregarás una regla horizontal para dividir la página y un blockquote para aplicar formato a tu cita favorita.

  1. En la parte inferior del archivo, dos líneas debajo de la etiqueta </details>, agrega una regla horizontal escribiendo tres o más guiones.

    ---
    
  2. Debajo de la línea ---, agrega una cita escribiendo marcado como el siguiente.

    > QUOTE
    

    Reemplaza QUOTE por la cita que prefiera. Como alternativa, copia la cita de nuestro ejemplo siguiente.

  3. Para comprobar que todo se ha representado correctamente, haz clic en la pestaña Vista previa.

Ejemplo

---
> If we pull together and commit ourselves, then we can push through anything.

— Mona the Octocat

Cómo se ve

Captura de pantalla de la pestaña Vista previa, con una cita con sangría debajo de una línea horizontal gruesa

Incorporación de un comentario

Puedes usar la sintaxis de comentario HTML para agregar un comentario que se ocultará en la salida. Aquí, agregarás un comentario para recordarte que tienes que actualizar tu archivo LÉAME más adelante.

  1. Dos líneas debajo del encabezado ## About me, inserta un comentario mediante el marcado siguiente.

    <!-- COMMENT -->
    

    Reemplaza COMMENT por un elemento de "tareas pendientes" que te recuerde hacer algo más adelante (por ejemplo, agregar más elementos a la tabla).

  2. Para comprobar que el comentario está oculto en la salida, haz clic en la pestaña Vista previa.

Ejemplo

## About me

<!-- TO DO: add more details about me later -->

Guardar el trabajo

Cuando hayas acabado con los cambios, guarda tuarchivo LÉAME de perfil haciendo clic en Confirmar cambios.

Confirmar directamente en la rama main hará que los cambios sean visibles para cualquier visitante de tu perfil. Si quieres guardar el trabajo, pero no estás a punto para que sea visible en el perfil, puedes seleccionar Crear una nueva rama para esta confirmación e iniciar una solicitud de incorporación de cambios.

Captura de pantalla de la sección "Confirmar cambios"

Pasos siguientes

  • Continúa para obtener información sobre las características de formato avanzadas. Por ejemplo, consulta "Creación y resaltado de bloques de código".
  • Usa tus nuevas aptitudes a medida que te comuniques en GitHub, en problemas, solicitudes de incorporación de cambios y discusiones. Para obtener más información, consulta "Comunicación en GitHub".