Códigos de imagen para foros, Markdown y HTML
Cuando ya tienes un enlace directo a la imagen, necesitas el código adecuado para mostrarla. Aquí tienes una chuleta.
BBCode (foros)
| Objetivo | Código |
|---|---|
| Mostrar una imagen | [img]https://…/photo.jpg[/img] |
| Imagen con enlace | [url=https://…/page][img]https://…/photo.jpg[/img][/url] |
| Fijar el ancho (en algunos foros) | [img width=400]https://…/photo.jpg[/img] |
La compatibilidad depende del software del foro (phpBB, vBulletin, XenForo, SMF), así que consulta la página de ayuda de tu foro.
Markdown
| Objetivo | Código |
|---|---|
| Mostrar una imagen |  |
| Imagen con enlace | [](https://…/page) |
Funciona en GitHub, GitLab y muchos sitios de documentación y apps de notas. El editor de Reddit y Discord tratan las imágenes de otra forma: en Discord, al pegar un enlace directo suele mostrarse una vista previa.
HTML
| Objetivo | Código |
|---|---|
| Mostrar una imagen | <img src="https://…/photo.jpg" alt="Texto alternativo"> |
| Fijar el tamaño | <img src="…" width="400" height="300" alt="…"> |
| Con enlace | <a href="https://…/page"><img src="…" alt="…"></a> |
Consejos
- Añade siempre texto alternativo por accesibilidad.
- Usa el enlace directo (que termina en
.jpg,.png,.gifo.webp), no el enlace de una página. - Convertir imagen a URL te da los tres códigos listos para copiar tras la subida.