Cómo añadir SVG en WordPress (con 2 soluciones simples)

¿Desea añadir archivos SVG a su sitio WordPress? Por defecto, WordPress te permite cargar todos los formatos de archivos de imagen, audio y vídeo más populares, pero SVG no está entre ellos. En este artículo, le mostraremos cómo agregar fácilmente SVG en WordPress.

Añadir fácilmente archivos SVG en WordPress

¿Qué es SVG?

SVG o Scalable Vector Graphics es un formato de archivo que define los gráficos vectoriales utilizando el lenguaje de marcado XML. El principal beneficio de SVG es que le permite ampliar las imágenes sin perder calidad ni tener ninguna pixelación.

¿Cómo funciona SVG?

Scalable Vector Graphics (SVG) es una tecnología que muestra dibujos bidimensionales utilizando XML. Son diferentes a los formatos de imagen comúnmente utilizados como PNG, GIF o JPEG.

Si toma un archivo de imagen png / jpeg y hace zoom, entonces notará que la imagen comenzará a desdibujarse y a pixelarse.

Los gráficos vectoriales no utilizan píxeles. En su lugar, utilizan un mapa bidimensional que define el gráfico que se está visualizando. A medida que se acerca el zoom, la imagen no se pixela.

Esto le permite ampliar los gráficos vectoriales sin perder calidad . Lo más importante es que las imágenes SVG pueden ser mucho más pequeñas en tamaño de archivo que las JPEG o PNG.

Los gráficos vectoriales se utilizan comúnmente para iconos, fuentes de iconos, logotipos de sitios web e imágenes de marca. Es posible que desee agregar archivos SVG en WordPress para el logotipo de su empresa, iconos u otros gráficos.

A pesar de lo guay que suenan, los archivos SVG siguen siendo un poco inseguros. Es por eso que WordPress no soporta las subidas de archivos SVG por defecto.

Si sube una imagen SVG en WordPress, verá el siguiente mensaje de error:

Lo sentimos, este tipo de archivo no está permitido por razones de seguridad.

SVG security error in WordPress

Problemas de seguridad relacionados con SVG en WordPress

Los archivos SVG contienen código en el lenguaje de marcado XML que es similar al HTML. Su navegador o software de edición SVG analiza el lenguaje de marcado XML para mostrar la salida en la pantalla.

Sin embargo, esto abre su sitio web a posibles vulnerabilidades XML. Puede utilizarse para obtener acceso no autorizado a los datos del usuario, disparar brute force attacks , o ataques de scripting a través del sitio.

Los métodos que compartiremos en este artículo intentarán desinfectar archivos SVG para mejorar su seguridad. Sin embargo, estos plugins no pueden prevent malicious code from being uploaded or injected.

La mejor solución es utilizar únicamente archivos SVG creados por fuentes fiables y restringir las cargas SVG sólo a usuarios de confianza.

Para obtener más información sobre la seguridad, consulte nuestra guía de seguridad completa WordPress security guide para principiantes.

Dicho esto, echemos un vistazo a cómo usar los archivos SVG en WordPress de forma fácil y segura.

Método 1. Subir archivos SVG en WordPress usando el soporte SVG

Este método ofrece soporte completo para agregar archivos SVG en WordPress. También le permite mostrar SVG en línea en los posts y páginas de WordPress.

Primero, debe instalar y activar el plugin SVG Support . Para más detalles, vea nuestra guía paso a paso en cómo instalar un plugin de WordPress .

Tras la activación, debe visitar la página Settings » SVG Support para configurar la configuración del plugin.

SVG support settings

En la página de configuración, debe marcar la casilla situada junto a la opción «Restringir a los administradores». Esto sólo permitirá que el administrador del sitio cargue los archivos SVG en WordPress con un site administrator .

La siguiente opción es activar el modo avanzado. Sólo necesitas marcar esta opción si quieres usar características avanzadas como animaciones CSS y renderizado SVG en línea.

No olvide hacer clic en el botón Guardar cambios para guardar su configuración.

Ahora puede crear un nuevo mensaje o editar uno ya existente. En el editor de mensajes, usted cargará su archivo SVG como lo haría con cualquier otro archivo de imagen. Simplemente agregue un bloque de imagen al editor y luego cargue el archivo SVG.

Ahora podrá cargar e incrustar archivos SVG en WordPress.

SVG file embed in WordPress post

Método 2. Subir archivos SVG en WordPress usando SVG seguro

Este método también utiliza un plugin y le permite realizar la desinfección de los archivos SVG subidos a WordPress.

Lo primero que debe hacer es instalar y activar el plugin Safe SVG . Para más detalles, vea nuestra guía paso a paso en cómo instalar un plugin de WordPress .

El plugin funciona desde el primer momento, y no hay ajustes que puedas configurar. Usted puede simplemente seguir adelante y comenzar a subir archivos SVG.

La desventaja es que este plugin permite subir archivos SVG a todos los usuarios que pueden escribir mensajes en su sitio de WordPress.

Para poder controlar quién puede subir los archivos, tendrá que comprar la versión premium del plugin.

Rate this post

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *