Cómo usar archivos SVG en WordPress de manera más segura

Como ya sabrás porque lo expliqué aquí mismo, los archivos SVG son potencialmente inseguros, básicamente porque no son imágenes sino código, susceptible de que alguien inyecte «más» código en ellos. De hecho, por defecto WordPress no permite subir archivos SVG.

Ahora bien, por otro lado son innegables también las ventajas de usar archivos SVG en tu web, especialmente para logotipos que quieras que se muestren siempre a gran calidad con archivos que al mismo tiempo sean de pequeño tamaño.

Cómo subir archivos SVG a WordPress fácilmente

Hay varias maneras de subir y utilizar archivos en formato SVG a WordPress, mediante código y plugins.

Para poder subir archivos .svg a WordPress mediante código añadido a tu plugin de funcionalidades, este:

/* Permitir subir archivos .svg */
function add_svg_to_upload_mimes( $upload_mimes ) {
$upload_mimes['svg'] = 'image/svg+xml';
$upload_mimes['svgz'] = 'image/svg+xml';
return $upload_mimes;
}
add_filter( 'upload_mimes', 'add_svg_to_upload_mimes', 10, 1 );

También puedes usar un plugin como Easy SVG Support, sin opciones ni ajustes, que no solo te permite subir archivos .svg sino que además se mostrarán en la biblioteca de medios y es compatible con el editor de bloques Gutenberg.

Ahora bien, el problema de usar los métodos anteriores es que no son seguros, porque permiten que cualquier usuario con la capacidad de subir archivos suba archivos .svg.

¿Entonces cómo puedo activar la compatibilidad con archivos SVG de manera más segura?

Un modo mucho más seguro de subir archivos SVG es mediante el plugin  SVG Support.

Además de permitir subir archivos SVG a tu web WordPress, también incluye las siguientes características:

  • Permite la subida de archivos .svg solo a usuarios con perfil de administrador.
  • Puedes cargar el script en el pie de página, para una mejor optimización.
  • Permite cargar el script sin minimizar, para minimizarlo con tu plugin favorito de optimización.
  • Puedes cargar el CSS necesario en portada si tu tema no muestra correctamente los archivos SVG.
  • Puede insertar automáticamente una clase CSS si el tema no muestra correctamente los archivos .svg.
  • Puedes añadir una clase CSS personalizada a la que aplicar los estilos de los archivos .svg.
  • Puedes forzar que los archivos SVG se procesen integrados (inline), especialmente útil con maquetadores que no admitan insertar automáticamente la clase CSS del plugin.

Solo con activar la casilla de restringir la subida a administradores mejoras con mucho la seguridad, dejando en sus manos la tarea de subir este tipo de archivos potencialmente peligrosos.

Archivos SVG y el tema/constructor Divi

Si utilizas Divi debes saber que no se lleva bien con los archivos SVG, necesita algo de ayuda, y este plugin es genial en este aspecto también.

Habrá ocasiones en que, a pesar de dejarte subir los archivos SVG tras instalar el plugin, e incluso mostrarse en el maquetador, luego no se verán en la web.

Esto lo solucionas fácilmente en el 99% de los casos activando el ajuste de «¿Cargar el CSS de la portada?».

Si no se arregla con este ajuste entonces marca la casilla para activar el modo avanzado, guarda los cambios, y cuando se muestren los ajustes avanzados, activa la casilla «¿Forzar SVG integrados?»


Como habrás visto, es un plugin realmente útil y práctico, que hará que el uso de archivos en formato SVG en WordPress sea más seguro y óptimo.

¿De cuánta utilidad te ha parecido este contenido?

¡Haz clic en los emoticonos para valorarlo!

Promedio de puntuación 5 / 5. Total de votos: 4

Hasta ahora ¡no hay votos!. Sé el primero en valorar este contenido.

Ya que has encontrado útil este contenido...

¡Sígueme en los medios sociales!

¡Siento que este contenido no te haya sido útil!

¡Ayúdame a mejorar este contenido!

Por favor, dime, ¿cómo puedo mejorarlo?

¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!

Sobre el autor

Deja un comentario

Tu dirección de correo electrónico no será publicada.

Información base sobre privacidad:
  • Responsable: Fernando Tellado ([email protected])
  • Fin del tratamiento: Moderación de comentarios para evitar spam
  • Legitimación: Tu consentimiento
  • Comunicación de los datos: No se comunicarán los datos a terceros salvo por obligación legal
  • Derechos: Acceso, rectificación, portabilidad, olvido

 

Ir arriba
Ir al contenido