Skip to content

Todo para WordPress, el desarrollo web — y mucho más

🖼 Cómo subir SVG a WordPress: 3 métodos seguros

🖼 Cómo subir SVG a WordPress: 3 métodos seguros

Usted subió un icono SVG a su sitio y WordPress se niega silenciosamente a aceptarlo. ¿Le suena familiar? Por defecto, el motor bloquea los archivos .svg por razones de seguridad, y al intentar subir un logotipo a la biblioteca de medios aparece el error «Lo sentimos, este tipo de archivo no está permitido».

Error de WordPress al intentar subir un archivo SVG a través de la biblioteca de medios

El problema no es una instalación defectuosa ni los permisos de archivos. WordPress excluye deliberadamente SVG de la lista blanca porque la estructura XML del archivo puede contener código malicioso. Pero no tiene que renunciar a los gráficos vectoriales: a continuación encontrará tres formas seguras de subir SVG sin poner en riesgo su sitio.

💡 Resumen rápido:

  • Conozca qué es SVG y por qué WordPress lo bloquea
  • Elija uno de los tres plugins seguros para subir archivos
  • Configure el plugin según sus necesidades en un par de minutos
  • Compare funcionalidades y obtenga una recomendación final

Qué es SVG y en qué se diferencia de JPEG y PNG

SVG (Scalable Vector Graphics) es un formato vectorial basado en XML. A diferencia de los formatos rasterizados JPEG y PNG, que se componen de píxeles, SVG describe las imágenes matemáticamente mediante líneas, curvas y formas. El resultado es una imagen que se mantiene nítida en una pantalla 4K o en un cartel publicitario del tamaño de una pared.

Para el propietario de un sitio, esto significa tres cosas. Primero, su logotipo e iconos se ven igual de definidos en cualquier dispositivo, desde un teléfono hasta un monitor de escritorio. Segundo, un archivo .svg pesa varias veces menos que su equivalente en PNG: un icono típico ocupa entre 1 y 3 KB en lugar de 15 a 30 KB. Tercero, SVG se puede animar mediante CSS y JavaScript sin necesidad de bibliotecas externas.

Pero hay una desventaja. El navegador lee la estructura XML como código, y un atacante puede incrustar un script en el archivo. Esta es precisamente la razón por la que WordPress no incluye SVG en la lista de formatos permitidos de fábrica. Cuando intenta subir uno, aparece ese mismo error de la captura de pantalla anterior.

Seguridad de SVG: lo que necesita saber antes de subir archivos

Un archivo .svg es un documento de texto con etiquetas como <svg>, <path> y <circle>. El navegador lo analiza casi como si fuera HTML. Si dentro del archivo se oculta una etiqueta <script> o un manejador onload, el navegador ejecutará ese código. Esto se denomina XSS almacenado: un script malicioso se guarda en el servidor y se ejecuta cada vez que un visitante abre la página.

En la práctica, no se han registrado ataques masivos a través de SVG en WordPress; la vulnerabilidad es conocida y los desarrolladores aprendieron hace tiempo a cerrarla. Los plugins modernos de SVG pasan el archivo subido por un sanitizador: una biblioteca que elimina todas las etiquetas y atributos peligrosos, dejando solo gráficos «limpios».

La regla es simple: nunca suba SVG de fuentes no confiables. Si el archivo fue creado por su diseñador o descargado de un sitio oficial de iconos, los riesgos son mínimos. Si el archivo provino de un cliente desconocido por correo electrónico, ábralo primero en un editor de texto y asegúrese de que no contenga etiquetas <script> ni atributos on*.

A continuación se presentan tres plugins que resuelven el problema de la subida de SVG con diferentes niveles de control y configuración.

Resultados de búsqueda de plugins SVG en el directorio de WordPress

Método 1: SVG Support, máximas capacidades

Página de ajustes del plugin SVG Support con opciones de seguridad y modo avanzado

SVG Support es el plugin más popular para subir gráficos vectoriales a WordPress. Más de 1 millón de instalaciones activas, una calificación de 4.5 en WordPress.org y actualizaciones constantes (la última en mayo de 2026) hablan por sí solos.

La instalación es estándar: Plugins → Añadir nuevo, escriba «SVG Support» en la barra de búsqueda, haga clic en Instalar ahora y luego en Activar. Tras la activación, vaya a Ajustes → SVG Support.

El ajuste principal que debe activar de inmediato es Restringir a administradores. Esto impide que cualquier persona que no sea administrador suba SVG. Si usted es el único que gestiona el sitio, esta casilla protege contra la subida accidental de un archivo peligroso por parte de un editor o especialista SEO.

El Modo avanzado habilita la animación CSS y el renderizado en línea de SVG. Lo necesita si planea animar iconos o cambiar su color mediante los estilos del tema. Sin esta casilla, el plugin elimina automáticamente los atributos potencialmente peligrosos y la animación podría dejar de funcionar.

SVG Support también sabe cómo envolver los archivos subidos en una etiqueta <img> con las dimensiones correctas; esto es importante para las Core Web Vitals porque el navegador reserva espacio para la imagen antes de que cargue y la página no «salta».

  • Ventajas: control de acceso detallado, modo avanzado para animaciones, dimensionado automático de imágenes, actualizaciones periódicas
  • Desventajas: ajustes disponibles solo en una pestaña separada (sin integración con la biblioteca de medios)
  • Precio: gratuito
  • Descarga: 🔗 SVG Support en WordPress.org

Método 2: Safe SVG, minimalismo del equipo de 10up

Página de instalación del plugin Safe SVG desde el panel de WordPress

Safe SVG está desarrollado por la agencia 10up; son el equipo en el que confían Microsoft, Adobe y la Casa Blanca. Y esa es la mejor recomendación que puede tener un plugin de seguridad.

A diferencia de SVG Support, Safe SVG no requiere configuración. Instale, active y listo; ya puede empezar a subir SVG. El plugin utiliza la misma biblioteca de sanitización que el núcleo de WordPress (enshrined/svg-sanitize) y pasa cada archivo por ella en el momento de la subida. Sin interfaces adicionales, sin ajustes; simplemente funciona.

Safe SVG permite la subida de SVG a todos los usuarios que tengan la capacidad upload_files. Si su sitio tiene varios autores, debería restringir adicionalmente el grupo, por ejemplo mediante un plugin de gestión de roles. Pero para un administrador único, este es el camino más simple y seguro.

El plugin lleva años en el mercado, tiene más de 1 millón de instalaciones activas y una calificación de 4.4. Se actualiza con menos frecuencia que SVG Support (la última en abril de 2026), pero eso es en realidad una señal de estabilidad: no hay nada que romper.

  • Ventajas: no requiere configuración, funciona nada más instalarlo, sanitización a nivel del núcleo de WordPress, desarrollador con una reputación impecable
  • Desventajas: sin ajustes de control de acceso, sin modo avanzado para animaciones, sin renderizado en línea
  • Precio: gratuito
  • Descarga: 🔗 Safe SVG en WordPress.org

Método 3: WP SVG Images, sanitización con control de roles

Banner del plugin WP SVG Images para subir archivos SVG seguros en WordPress

WP SVG Images está desarrollado por el equipo de ShortPixel, conocidos por sus herramientas de optimización de imágenes. El plugin ocupa un punto intermedio entre SVG Support y Safe SVG: tiene ajustes de roles, pero no incluye pantallas innecesarias.

Tras la activación, el plugin permite inmediatamente la subida de SVG a todos los administradores y editores. En Ajustes → WP SVG Images, puede ajustar con precisión qué roles tienen permiso para subir y activar la sanitización individualmente para cada rol. Por ejemplo: los administradores suben sin verificación, los editores suben con sanitización obligatoria, los autores no pueden subir en absoluto.

Una ventaja adicional es la vista previa de SVG directamente en la biblioteca de medios. El WordPress estándar muestra un icono de marcador de posición en lugar del archivo vectorial. WP SVG Images genera una miniatura, para que vea exactamente lo que subió sin necesidad de abrir el archivo en una pestaña nueva.

El plugin también proporciona filtros para desarrolladores: WPSVG_setAllowedTags y WPSVG_setAllowedAttrs permiten añadir etiquetas y atributos personalizados a la lista blanca del sanitizador.

  • Ventajas: vista previa de SVG en la biblioteca de medios, ajustes flexibles de sanitización por rol, filtros para desarrolladores, soporte activo
  • Desventajas: sin modo avanzado de animación, requiere PHP 5.6.40+
  • Precio: gratuito
  • Descarga: 🔗 WP SVG Images en WordPress.org

Tabla comparativa: qué plugin elegir

Plugin

Instalaciones activas

Calificación

Ajustes de roles

Vista previa en biblioteca

Animaciones SVG

SVG Support

1M+

4.5 ★

✅ (admin / todos)

✅ (Modo Avanzado)

Safe SVG

1M+

4.4 ★

❌ (solo upload_files)

WP SVG Images

30K+

5.0 ★

✅ (individual por rol)

Los tres plugins son gratuitos y utilizan bibliotecas de sanitización probadas. SVG Support es la opción para quienes necesitan animación y el máximo control. Safe SVG es para quienes valoran la simplicidad y no quieren tocar ajustes. WP SVG Images es un término medio con una vista previa conveniente y una distribución flexible de permisos.

Cómo instalar un plugin SVG y subir un archivo: paso a paso

Independientemente del plugin que elija, el proceso de instalación es el mismo:

Paso 1. En el panel de administración de WordPress, abra Plugins → Añadir nuevo.

Paso 2. En la barra de búsqueda, introduzca el nombre del plugin: SVG Support, Safe SVG o WP SVG Images.

Paso 3. Haga clic en Instalar ahora en la tarjeta del plugin deseado y luego en Activar.

Paso 4. Si el plugin tiene ajustes (SVG Support o WP SVG Images), vaya a la pestaña correspondiente y active las restricciones de roles. Para Safe SVG, este paso no es necesario.

Paso 5. Abra el editor de entradas o páginas. En el bloque de Imagen, haga clic en «Subir»; el formato .svg ahora está en la lista blanca.

Antes de subir un archivo SVG, asegúrese de confiar en su origen. Lo ideal es usar archivos creados por su diseñador en Illustrator, Figma o Inkscape. Si recibió un SVG de un contratista externo, ábralo en el Bloc de notas y examínelo rápidamente: no debe contener <script> ni onload=.

En la práctica, una comprobación manual de tres segundos más el sanitizador del plugin proporcionan un margen de seguridad doble. En años de trabajo con WordPress, no hemos encontrado un solo incidente real con SVG subido a través de cualquiera de los tres plugins descritos.

Si prefiere el formato de video, el clip anterior muestra todo el proceso, desde la instalación del plugin hasta la inserción de SVG en una página.

⁉️🤔 Preguntas frecuentes

¿Puedo subir SVG sin un plugin?

Añada un fragmento de código con el filtro upload_mimes que registre el tipo MIME image/svg+xml. Sin embargo, no recomendamos este enfoque: sin un sanitizador, expone su sitio a XSS almacenado. Un plugin resuelve el problema de seguridad automáticamente; un par de clics frente a un posible agujero en sus defensas.

¿Por qué el plugin Enable SVG ya no está disponible?

Motivo: «Solicitud del autor». El plugin no se actualizó durante 4 años y ha sido eliminado permanentemente de WordPress.org. Si lo tiene instalado, sustitúyalo por uno de los tres plugins anteriores. Tienen mantenimiento activo y son compatibles con WordPress 7.0.

¿Cómo verifico que un SVG subido es seguro?

Un SVG seguro se compone de primitivas gráficas como svg, g y path en su interior. En un archivo limpio no aparecen script, foreignObject ni atributos onload u onclick. Los tres plugins de este artículo eliminan automáticamente los elementos peligrosos durante la subida.

¿Qué formato es mejor para un logotipo, SVG o PNG?

SVG es la opción correcta para la mayoría de los sitios. Un logotipo vectorial ocupa solo unos pocos kilobytes, no se ve borroso en pantallas retina y puede cambiar de color mediante CSS. PNG solo es necesario si el logotipo contiene una fotografía o un degradado complejo que se renderiza mal en vector.

WP SVG Images o Safe SVG: ¿cuál es más fiable?

La diferencia está en la comodidad. Safe SVG es «instalar y olvidar» de una agencia de élite. WP SVG Images le ofrece vistas previas en la biblioteca de medios y ajustes de roles individuales. En términos de seguridad, son equivalentes.

Conclusión: qué instalar en 2026

Los tres plugins resuelven la tarea de subir SVG de forma segura; la elección se reduce a su caso de uso.

¿Necesita animación de iconos vectoriales y renderizado en línea? Opte por SVG Support; es el único plugin con modo avanzado.

¿Solo quiere subir un logotipo y olvidarse del problema? Safe SVG es su opción. Instale, active y listo.

¿Necesita vistas previas en la biblioteca de medios y un control de acceso detallado para su equipo? Elija WP SVG Images; ShortPixel creó una herramienta conveniente con la mejor calificación entre los plugins SVG.

En resumen: instale Safe SVG para minimalismo o SVG Support para un control total. Ambas opciones son gratuitas y están probadas en millones de sitios. Y lo más importante, tras instalar cualquiera de los tres plugins, el error «tipo de archivo no permitido» desaparece para siempre.