Cómo añadir imágenes SVG a WordPress con Divi

añadir imagenes svg a wordpress con divi

Contenido Restringido 🖐
Accede a este y otros contenidos siendo premium. ¿Aún no eres premium? Adquiere una membresía aquí ⭐

En este videotutorial prémium aprenderás a añadir imágenes SVG a WordPress con Divi. Los Gráficos Vectoriales Escalables, o Scalable Vector Graphics (SVG) son un formato de gráficos vectoriales bidimensionales. Pueden presentarte tanto de forma estática como animada, en formato XML. Y su especificación es un estándar abierto desarrollado por el W3C desde el año 1999.

Como bien sabes, WordPress soporta múltiples formatos de imágenes, incluyendo JPEG, GIF, o PNG. Sin embargo, seguro que has intentado subir uno de los formatos más de moda en la web, y no has podido hacerlo. O al menos de una forma sencilla. Por supuesto, estamos hablando de archivos de imagen en formato SVG.

Únete a nuestra comunidad y comienza a diseñar el futuro hoy. Aprende, innova y crece junto a nosotros. Accede a todo nuestro contenido desde $12/mes*
Transforma tu carrera con UXDIVI
Únete a nuestra comunidad y comienza a diseñar el futuro hoy. Aprende, innova y crece junto a nosotros

Accede a todo nuestro contenido desde US $12/mes*
Transforma tu carrera con UXDIVI

Los SVG los podemos usar para iconos o ilustraciones que queramos en nuestra web. Al usar imágenes SVG en tu sitio web obtienes dos beneficios principales: el primero es que el peso de las imágenes es increíblemente bajo, tal cual como lo veremos en la siguiente imagen:

comparativa añadir imagenes svg a wordpress con divi

El segundo es que además de que nos permite alojar una imagen con muy poco peso, esta se carga en formato vector, lo que quiere decir es que sin importar cuanto ampliemos está imagen en nuestra pantalla no generara el efecto cierra o de pixelado en el borde de la imagen.

Lo lograremos con un plugin gratuito y muy fácil de usar.

Finalmente, si lo que estás buscando es optimar imágenes para tu sitio web, recuerda que tenemos una lección del curso de optimización de velocidad en Divi donde te enseñamos diferentes herramientas con las que puedes optimizar las imágenes para ti sitio web.

Si te ha gustado este contenido no olvides compartirlo con tus amigos y conocidos, además recuerda que puedes compartirnos el enlace de tu creación en los comentarios de este contenido, así todos veamos los resultados maravillosos que conseguiste con este contenido prémium.

Descarga los recursos mencionados en este tutorial acá abajo 👇 siendo premium ⭐

Recursos adicionales:

Plugin de SVG gratuito para WordPress:

Añadir manualmente la compatibilidad SVG de WordPress

Este método implica editar el archivo functions.php de tu sitio web de WordPress. Por lo tanto, te recomendamos que sigas estos pasos cuidadosamente si estás familiarizado con PHP y entiendes perfectamente el tema de la seguridad de los SVG.

¡Importante! Asegúrate de hacer una copia de seguridad de tu sitio web de WordPress antes de realizar cualquier cambio para evitar cualquier pérdida de datos en caso de una mala configuración.

Los siguientes pasos explicarán cómo habilitar SVG en WordPress manualmente a través del Administrador de Archivos de WordPress que encontrarás en tu hosting.

1. Accede a cPanel de tu hosting y ve a Archivos → Administrador de Archivos.

2. Dirígete a public_html → wp-includes. Desplázate hacia abajo hasta que encuentres functions.php.

El archivo functions.php en el gestor de archivos Hostinger

3. Haz doble clic en el archivo para abrirlo y pega el siguiente fragmento de código:

function add_file_types_to_uploads($file_types){
$new_filetypes = array();
$new_filetypes['svg'] = 'image/svg+xml';
$file_types = array_merge($file_types, $new_filetypes );
return $file_types;
}
add_filter('upload_mimes', 'add_file_types_to_uploads');

4. Guarda los cambios e intenta subir un archivo de tipo SVG. Si el proceso es exitoso, tu biblioteca de medios debería aceptar la carga del archivo.

Artículos relacionados

Comentarios

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

¡Registrate en nuestro próximo Live!
24 de noviembre de 2023 9:30 hrs (CDMX)
En este evento exclusivo, abordaremos las preguntas más frecuentes que los usuarios hacen sobre Divi, además de responder a cualquier otra pregunta que nuestros suscriptores de la academia tengan en mente.
10
días
10
horas
10
minutos
10
segundos
¡Registrate en nuestro próximo Live!
24 de noviembre de 2023 9:30 hrs (CDMX)
10
días
10
hrs
10
min
10
seg
25% OFF BLACK FRIDAY SALE!
Del 24 al 30 de noviembre 2023 descuentos por:
¿Aún no eres miembro Premium ⭐ de UXDivi? ¡Esta es tu oportunidad de oro! Únete a nuestra comunidad de expertos en Divi y disfruta de recursos exclusivos, tutoriales avanzados, y una red de profesionales al alcance de tu mano.
10
días
10
horas
10
minutos
10
segundos
25% OFF BLACK FRIDAY SALE!
10
días
10
hrs
10
min
10
seg
Aprovecha un DESCUENTO DEL 25% en tu suscripción Premium. ¡Solo durante Black Friday!
10
días
10
hrs
10
min
10
seg
Aprovecha un DESCUENTO DEL 25% ¡Solo durante Black Friday!