¿Es posible colocar una captura de pantalla en el archivo README en un repositorio de GitHub? ¿Cuál es la sintaxis?

Si usa Markdown (README.md):

Siempre que tenga la imagen en su repositorio, puede usar una URL relativa:

![Alt text](/relative/path/to/img.jpg?raw=true "Optional Title")

Si necesita incrustar una imagen alojada en otro lugar, puede usar una URL completa

![Alt text](http://full/path/to/img.jpg "Optional title")

GitHub recomienda que utilice enlaces relativos con el ?raw=trueparámetro para garantizar que los repositorios se bifurquen correctamente.

El raw=trueparámetro está allí para garantizar que la imagen a la que se vincula se muestre tal cual. Eso significa que solo se vinculará la imagen, no toda la interfaz de GitHub para ese archivo respectivo. Vea este comentario para más detalles.

Vea un ejemplo: https://raw.github.com/altercation/solarized/master/README.md

Si utiliza IVS entonces usted tendrá que establecer el atributo esterilice a trueasí: ?raw=true&sanitize=true. (Gracias @EliSherer)

Además, la documentación sobre enlaces relativos en archivos README: https://help.github.com/articles/relative-links-in-readmes

Y, por supuesto, los documentos de rebajas: http://daringfireball.net/projects/markdown/syntax

Además, si crea una nueva rama screenshotspara almacenar las imágenes, puede evitar que estén en el masterárbol de trabajo

Luego puede incrustarlos usando:

![Alt text](/../<branch name>/path/to/image.png?raw=true "Optional Title")

Aunque ya hay una respuesta aceptada, me gustaría agregar otra forma de cargar imágenes para leerme en GitHub.

• Debes crear un problema en tu repositorio
• Arrastra y suelta en el área de comentarios tu imagen
• Después de generar el enlace para la imagen, insértelo en el archivo Léame

Más detalles puedes encontrar aquí

Descubrí que la ruta a la imagen en mi repositorio no era suficiente, tenía que vincular a la imagen en el raw.github.comsubdominio.

Formato de URL https://raw.github.com/{USERNAME}/{REPOSITORY}/{BRANCH}/{PATH}

Ejemplo de descuento ![Settings Window](https://raw.github.com/ryanmaxwell/iArrived/master/Screenshots/Settings.png)

1. Sube tu imagen a postimage.org
2. Obtener URL de Markdown de Github
3. Insertar en su archivo Léame

Una línea a continuación debe ser lo que buscas

si su archivo está en el repositorio

![ScreenShot](https://raw.github.com/{username}/{repository}/{branch}/{path})

si su archivo está en otra url externa

![ScreenShot](https://{url})

La sintaxis de reducción para mostrar imágenes es:

![image](https://{url})

PERO: ¿Cómo proporcionar el url?

• Probablemente no desee saturar su repositorio con capturas de pantalla, no tienen nada que ver con el código
• es posible que no desee lidiar con la molestia de hacer que su imagen esté disponible en la web ... (cárguela en un servidor ...).

Entonces ... puedes usar este increíble truco para hacer que github aloje tu archivo de imagen. TDLR:

1. crear un problema en la lista de problemas de su repositorio
2. arrastre y suelte su captura de pantalla sobre este problema
3. copie el código de descuento que github acaba de crear para que pueda mostrar su imagen
4. pégalo en tu archivo Léame (o donde quieras)

http://solutionoptimist.com/2013/12/28/awesome-github-tricks/

Mucho más simple que agregar URL Simplemente cargue una imagen en el mismo repositorio, como:

![Screenshot](screenshot.png)

agregue esto a README

<div align="center">
    <img src="/screenshots/screen1.jpg" width="400px"</img> 
</div>

Reducción: ![Screenshot](http://url/to/img.png)

• Crea un problema relacionado con la adición de imágenes
• Agregue la imagen arrastrando y soltando o seleccionando un archivo

• Luego copie la fuente de la imagen

• Ahora agregue ![Screenshot](http://url/to/img.png)a su archivo README.md

¡Hecho!

Alternativamente, puede usar algún sitio de alojamiento de imágenes como imgury obtener su url y agregarlo en su archivo README.md o también puede usar algún alojamiento de archivo estático.

Problema de muestra

Método 1-> Modo de reducción

![Alt Text](https://raw.github.com/{USERNAME}/{REPOSITORY}/{BRANCH}/{PATH})

Método 2-> forma HTML

<img src="https://link(format same as above)" width="100" height="100"/>

o

<img src="https://link" style=" width:100px ; height:100px " />

Nota -> Si no quieres darle estilo a tu imagen, es decir, cambiar el tamaño, elimina la parte de estilo

Primero, cree un directorio (carpeta) en la raíz de su repositorio local que contendrá el screenshotsque desea agregar. Llamemos al nombre de este directorio screenshots. Coloque las imágenes (JPEG, PNG, GIF, `etc.) que desea agregar a este directorio.

Captura de pantalla de Android Studio Workspace

En segundo lugar, debe agregar un enlace a cada imagen en su archivo README. Entonces, si tengo imágenes nombradas 1_ArtistsActivity.pngy 2_AlbumsActivity.pngen mi directorio de capturas de pantalla, agregaré sus enlaces de esta manera:

 <img src="screenshots/1_ArtistsActivity.png" height="400" alt="Screenshot"/> <img src=“screenshots/2_AlbumsActivity.png" height="400" alt="Screenshot"/>

Si desea cada captura de pantalla en una línea separada, escriba sus enlaces en líneas separadas. Sin embargo, es mejor si escribe todos los enlaces en una línea, separados solo por espacio. Puede que en realidad no se vea muy bien, pero al hacerlo, GitHub los organiza automáticamente para usted.

Finalmente, confirma tus cambios y empújalo.

Busqué en Google algunas preguntas similares y no vi ninguna respuesta con mi problema y es una solución bastante simple / fácil.

Google Cloud Storage: un enfoque ligeramente diferente de las imágenes en README

Aquí va: al igual que el OP, quería una imagen en mi README de Github y, conociendo la sintaxis de Markdown para hacerlo, la escribí:

![My Image](https://storage.cloud.google.com/${MY_BUCKET}/${MY_IMAGE}

Debe completar las sustituciones reales anteriores (por ejemplo, MY_IMAGE = image.jpg) para que esto funcione.

Pero, espera ... fracaso: ¡no hay una foto renderizada real! ¡Y el enlace es exactamente como lo proporciona Google Storage!

Github camo- Imágenes anónimas

Github aloja tus imágenes de forma anónima , ¡sí! Sin embargo, esto presenta un problema para los activos de almacenamiento de Google. Debe obtener la URL generada de su Google Cloud Console.

Estoy seguro de que hay una manera más fluida, sin embargo, simplemente visite el punto final de su URL y copie la URL larga. Detalles:

Instrucciones

1. Visite su consola de almacenamiento: https://console.cloud.google.com/storage/browser/ $ {MY_BUCKET}? Project = $ {MY_PROJECT}
2. Haga clic en la imagen que desea mostrar en Github (aparece la página "Detalles del objeto")
3. Copie la pasta de esa URL (la que comienza con httpsno gs) en una nueva pestaña / ventana del navegador
4. Copie la nueva URL generada, debería ser más larga, desde la nueva pestaña / ventana del navegador en su archivo README de Github

Esperemos que esto ayude a acelerar y aclarar este problema para cualquier otra persona.

Para mí, la mejor manera es ...

1. Cree un nuevo problema con ese repositorio en github y luego cargue el archivo en formato gif. Para convertir archivos de video a formato gif, puede usar este sitio web http://www.online-convert.com/
2. Envíe el problema recién creado.
3. Copie la dirección del archivo cargado
4. Finalmente en su archivo README poner! [Demo] (DIRECCIÓN COPIADA)

Espero que esto ayude.

Agregue la imagen en el repositorio desde la opción de cargar el archivo y luego en el archivo README

![Alt text]("enter image url of repositoryhere") 

Con las imágenes ubicadas en el /screen-shotsdirectorio. El exterior <div>permite posicionar las imágenes. El relleno se logra usando <img width="desired-padding" height="0">.

<div align="center">
        <img width="45%" src="screen-shots/about.PNG" alt="About screen" title="About screen"</img>
        <img height="0" width="8px">
        <img width="45%" src="screen-shots/list.PNG" alt="List screen" title="List screen"></img>
</div>