';

Information

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut rhoncus risus mauris, et commodo lectus hendrerit ac. Nam consectetur velit et erat fermentum aliquet. In laoreet, sem sit amet faucibus pulvinar, purus tellus tincidunt ex, vel blandit nibh dui sit amet justo.

Menú

Subir imágenes SVG a WordPress

WordPress soporta multitud de formatos de archivos para poder subir a la biblioteca de ‘Medios‘, como puede ser JPEG, PNG o GIF. Seguramente has tenido la necesidad de subir algún archivo de imagen en formato SVG y te ha saltado un error que dice que por motivos de seguridad no está permitido subir este tipo de archivos.

En este artículo te mostraré, a través de un código, cómo subir imágenes SVG a WordPress. También te aconsejaré algunos plugins, por si no quieres poner código, pero cuanto menos plugins innecesarios utilices en tu sitio web mucho mejor.

¿Por qué utilizar imágenes en formato SVG?

Cabe resaltar por qué WordPress no permite subir este tipo de archivos. Los SVG son ficheros de texto que pueden guardar y ejecutar Javascript, es decir, es fácil insertar un código malicioso en un archivo SVG. Por eso debemos controlar desde qué web estamos descargando el archivo, que sea fiable.

Por lo demás, utilizar este tipo de archivos tiene numerosas ventajas: los archivos SVG son mucho menos pesados que otros formatos por lo que mejoran la velocidad de la web, no pixelan a ciertas resoluciones, son indexables por Google, son editables, etc.

Una recomendación, cuando subáis archivos en JPEG o PNG, es muy importante optimizar la imagen antes de subirla a WordPress porque he visto muchos sitios web muy lentos por culpa de subir imágenes muy pesadas y con resoluciones que no se necesitan. Para optimizar imágenes de forma online os recomiendo TinyPNG y Compressor.

Sólo por destacar, alguna día hablaré de los archivos WebP, un nuevo formato de imagen desarrollado por Google que ofrece un ratio de compresión un 25% mayor que un PNG y entre 25%-34% que el JPEG. Pero hoy el caso es otro, los SVG.

Cómo subir imágenes SVG sin utilizar un plugin

Para poder activar SVG en WordPress vamos a insertar un pequeño código. Para ello tendremos que abrir nuestro archivo functions.php de nuestro Child Theme, para no perder los cambios en futuras actualizaciones, y copiar y pegar el siguiente código.

//Subir SVG
add_filter('upload_mimes', 'my_upload_mimes');

function my_upload_mimes($mimes = array()) {
    $mimes['svg'] = 'image/svg+xml';
    return $mimes;
}

Como ves, es bastante sencillo de aplicar y sin tener que utilizar ningún plugin. Si pruebas ahora el subir un archivo SVG a la biblioteca de ‘Medios‘ verás que no tienes ningún problema.

¿Qué plugin utilizar para poder subir archivos SVG a WordPress?

Si eres de los que prefiere utilizar un plugin porque no sabes poner código en la plantilla o cualquier otra razón, te recomiendo instalar alguno de los siguientes plugins, existen unos cuantos en el repositorio oficial de WordPress pero los más conocidos son los que te muestro a continuación.

  • SVG Support

svg support - iborra web design

La ventaja de utilizar este plugin es que analizará el código de los archivos SVG que subamos, comprobando que no contengan ningún tipo de código malicioso. Es uno de los plugins más conocidos y usados. Una vez instalado y activado veremos varias cosas que se pueden hacer, como enlazar nuestro SVG con CSS, en el caso que vayamos a animarlos; restringir la subida de archivos SVG a WordPress solo para los administradores del sitio web, etc.

Ir al sitio oficial del plugin

  • Safe SVG

safe svg - iborra web design

Este es otro plugin que podrás encontrar en el repositorio de WordPress. Tan solo hay que instalarlo y activarlo para poder permitir la subida de ficheros SVG. Al igual que el otro, el plugin se encarga de analizar y neutralizar cualquier amenaza que pueda tener el archivo SVG.

Ir al sitio oficial del plugin

Con esto ya no tendrás ningún problema en subir archivos SVG a WordPress. Solo depende de ti si quieres utilizar un plugin o no para poder realizarlo.

!Si te gustó este artículo, no dejes de visitar el blog o suscribirte a la newsletter! | Iborra Web Design

Comments
Compartir
Paco (Iborra Web Design)

Artículos destacados

Leave a reply