Insertar imágenes en un campo de texto
En esta página
Insertar una imagen
Dentro de un campo de texto, podés insertar una imagen de dos modos:
- si es nueva, subila a la plataforma e insertala en el cuerpo de texto:
- subí la imagen de tamaño, resolución y formato adecuados (no más de 800 píxeles de ancho, resolución 72 dpi y formato jpg para fotografías o png para ilustraciones con fondo transparente) en el apartado Insertar imagen body que aparece dentro del tipo página, página de libro o noticia en la que estás trabajando.
- completá los campos que aparecen debajo de la miniatura de la imagen:
- Texto alternativo: describí la imagen, paso obligatorio por accesibilidad web.
- Título: escribí el epígrafe de la imagen (no obligatorio).
- posicioná el cursor en el campo de texto donde quieras que vaya la imagen (siempre entre dos párrafos y con una línea de espacio libre arriba y abajo) y hacé clic en el botón Insertar para que te escriba solo el código markdown.
- si la subiste anteriormente:
- buscá la ruta de la imagen y copiala (con www, nunca con back);
- posicioná el cursor en el campo de texto donde quieras que vaya la imagen (siempre entre dos párrafos y con una línea de espacio libre arriba y abajo) y escribí el código con el siguiente formato:
![Texto alternativo que describe la imagen](www.argentina.gob.ar/ruta-de-la-imagen.jpg "Texto epígrafe de la imagen")
Si no vas a escribir epígrafe, podés eliminar ese texto y las comillas que lo encierran. A continuación tenés un código de ejemplo y cómo se ve cuando lo publicás.
![Paisaje Jujuy](https://www.argentina.gob.ar/sites/default/files/paisaje_jujuy.jpg "Este es el epígrafe")
Insertar una galería de imágenes
Para la galería podés usar imágenes que subas por Insertar imagen body o imágenes que ya subiste anteriormente. Deben ser de hasta 800 píxeles de ancho, resolución 72 dpi y formato jpg. La relación de aspecto ideal es 16:9, el espacio vacío arriba o abajo se verá gris oscuro, como podés ver en el ejemplo de más abajo.
- Subí las imágenes o copia sus rutas como explicamos en el apartado anterior.
-
Donde quieras que se vea la galería de imágenes (siempre entre dos párrafos y con una línea de espacio libre arriba y abajo) escribí el siguiente código:
[[galeriaFotoMarkdown
{![Texto alternativo 1](https://www.argentina.gob.ar/imagen-1.jpg "Texto epígrafe 1")}
{![Texto alternativo 2](https://www.argentina.gob.ar/imagen-2.jpg "Texto epígrafe 2")}
{![Texto alternativo 3](https://www.argentina.gob.ar/imagen-3.jpg "Texto epígrafe 3")}
{![Texto alternativo 4](https://www.argentina.gob.ar/imagen-4.jpg "Texto epígrafe 4")}
]]
Si bien en este caso publicamos cuatro fotos (están en las líneas 2 a 5 del código y encerradas entre llaves), puede llevar tantas como quieras, pero, a mayor cantidad de imágenes, más pesada va a ser la navegación para el usuario.A continuación tenés un código de ejemplo y cómo se ve cuando lo publicás. También probá la navegación en un celular.
[[galeriaFotoMarkdown
{![Casco](https://www.argentina.gob.ar/sites/default/files/imagenAtajo/nosotras-construimos-atajo-inscripcion.jpg "Epígrafe de la imagen 1")}
{![Ciencia](https://www.argentina.gob.ar/sites/default/files/imagenAtajo/ces-cienciaxmetas-atajo-ciencia.png "Epígrafe de la imagen 2")}
{![Construcción](https://www.argentina.gob.ar/sites/default/files/imagenAtajo/integrar-construccion-atajo-mapa.jpg "Epígrafe de la imagen 3")}
{![Herramientas](https://www.argentina.gob.ar/sites/default/files/imagenAtajo/nosotras-construimos-atajo-mapa.jpg "Epígrafe de la imagen 4")}
]]