Cómo agregar GIFs de Giphy en WordPress (2 métodos sencillos)

Agregar un GIF animado es una excelente manera de aportar humor y personalidad a tus publicaciones de blog. Los usamos en WPBeginner para hacer que nuestro contenido sea más atractivo y relatable para nuestros lectores.

Pero podrías preocuparte de que los archivos GIF grandes ralenticen tu sitio web. Esta es una preocupación válida, ya que las páginas de carga lenta pueden afectar negativamente la experiencia del usuario y tus clasificaciones SEO.

Afortunadamente, incrustar GIFs directamente desde Giphy resuelve este problema por completo. Este método ahorra el ancho de banda de tu servidor y mantiene tu sitio funcionando rápido.

Te mostraremos dos formas sencillas de agregar GIFs de Giphy a tu sitio de WordPress, tanto con como sin usar un plugin.

Pros y contras de usar imágenes GIF animadas en WordPress

Usar GIFs animados (Graphics Interchange Format) puede ser una forma divertida y atractiva de mejorar tu contenido.

Son perfectos para agregar reacciones animadas, memes y referencias de la cultura pop a tu sitio de WordPress. Esto puede ayudar a aumentar las visitas a la página y reducir la tasa de rebote de tu blog.

Sin embargo, hay algunas desventajas. Los archivos GIF son grandes. Pueden ocupar mucho espacio en la biblioteca de medios de WordPress, ralentizar tu sitio web y consumir tu ancho de banda. Esto son malas noticias para la experiencia del usuario y también puede afectar tus clasificaciones en motores de búsqueda y tráfico.

Ahí es donde Giphy entra en juego. Servir tus imágenes GIF animadas a través de Giphy te ahorrará el ancho de banda de tu plan de alojamiento web. También tendrá un menor impacto en el tiempo de carga y el rendimiento de tu WordPress.

Es más, Giphy tiene una gran colección de GIFs divertidos y con los que te puedes identificar, lo que lo hace genial para añadir un toque de humor y personalidad a tu contenido.

Dicho esto, veamos 2 formas sencillas para principiantes de usar GIFs de Giphy en WordPress. Simplemente haz clic en los enlaces de abajo para saltar al método que prefieras:

1. Cómo añadir GIFs de Giphy usando un código de inserción (sin plugin)
2. Cómo añadir GIFs de Giphy usando EmbedPress
3. Preguntas frecuentes sobre el uso de GIFs en WordPress

Método 1: Cómo añadir GIFs de Giphy usando un código de inserción (sin plugin)

Una opción es añadir el GIF a una página o publicación usando su código de inserción de Giphy. 

Dado que usas un código de inserción, no necesitas ningún plugin especial de WordPress. Sin embargo, obtener el código de inserción requiere unos pasos adicionales. 

Si solo quieres añadir un pequeño número de GIFs a tu sitio web, estos pasos adicionales podrían no ser un problema. Sin embargo, si planeas usar muchos GIFs, podría valer la pena instalar un plugin que facilite este proceso. 

Para añadir un GIF usando su código de inserción, dirígete al sitio web de Giphy.com. Luego, busca el GIF que quieres usar.

Ahora puedes hacer clic en el botón 'Embed'.

Giphy ahora mostrará el código de inserción para este GIF.

En este punto, puedes elegir entre 'Responsive Off' y 'Responsive On'.

El contenido adaptable cambia para adaptarse mejor al dispositivo del visitante. Esto es importante para asegurar que tu sitio se vea tan bien en smartphones y tablets como en computadoras de escritorio.

Por ejemplo, los temas responsivos de WordPress se ajustan automáticamente al tamaño de la pantalla del usuario. 

Teniendo esto en cuenta, es una buena idea elegir 'Responsive On'.

Después de tomar tu decisión, copia el código de incrustación haciendo clic en el botón 'Copiar código'.

Ahora es el momento de cambiar al área de administración de WordPress. Aquí, simplemente abre el editor de Gutenberg para la página o publicación donde deseas incrustar tu GIF.

Tu siguiente tarea es crear un nuevo bloque de HTML personalizado. Para empezar, haz clic en el ícono de ‘+’. 

Luego, en la ventana emergente que aparece, escribe ‘HTML personalizado’ para encontrar el bloque correcto. Una vez que hagas clic en el bloque de HTML personalizado, WordPress agregará este bloque a tu página.

Ahora, simplemente puedes pegar el código de incrustación de tu GIF en el bloque de HTML personalizado. 

Debería verse así.

Antes de publicar este GIF, es posible que desees verificar cómo se verá para tus visitantes. Para hacer esto, simplemente haz clic en el botón ‘Vista previa’ en la parte superior de la pantalla. WordPress ahora mostrará tu página en una nueva pestaña.

Si estás satisfecho con tu GIF, entonces puedes publicar esta entrada o página de WordPress. Simplemente haz clic en el botón ‘Actualizar’ o ‘Publicar’ en el editor de bloques.

El GIF ahora aparecerá en tu blog de WordPress.

Método 2: Cómo agregar GIFs de Giphy usando EmbedPress

Si planeas agregar muchos GIFs a tu sitio web, los códigos de incrustación pueden consumir demasiado tiempo.

Otra opción es usar el plugin EmbedPress. Este plugin freemium te permite incrustar GIFs usando solo sus URLs de Giphy.

EmbedPress también te permite incrustar contenido de más de 100 sitios web. Estos incluyen incrustar videos de YouTube, PDFs, archivos de audio, y más.

Primero, necesitarás instalar y activar el plugin EmbedPress. Usaremos la versión gratuita ya que tiene lo que necesitamos para este tutorial.

Si necesitas ayuda, consulta nuestra guía sobre cómo instalar un plugin de WordPress.

Tras la activación, ve a la página o publicación donde quieres agregar tu GIF. Luego puedes hacer clic en el ícono '+'.

En la ventana emergente que aparece, escribe 'EmbedPress' para encontrar el bloque correcto. 

Simplemente haz clic en este bloque y WordPress agregará un bloque de EmbedPress a tu página.

En una nueva pestaña, dirígete al sitio web de Giphy. Luego puedes encontrar el GIF que quieres usar. 

Luego, simplemente copia la URL de este GIF. 

Ahora es momento de volver a tu panel de WordPress. 

Aquí simplemente pega la URL del GIF en el cuadro de EmbedPress. Finalmente, haz clic en 'Incrustar'.

Ahora, si miras tu sitio web, verás tu nuevo GIF.

Si no estás contento con tu GIF, EmbedPress tiene algunas configuraciones que quizás quieras explorar. Estas incluyen cambiar la altura y el ancho de todos los GIFs que agregas a través de EmbedPress.

Para ver estas configuraciones, haz clic en 'EmbedPress' en la barra lateral de WordPress.

Si no está seleccionado, haz clic en la pestaña 'General'. Ahora puedes usar estas configuraciones para personalizar tus incrustaciones de EmbedPress. 

Solo recuerda que cualquier cambio que hagas en este menú afectará todo tu contenido de EmbedPress.

Preguntas frecuentes sobre el uso de GIFs en WordPress

Aquí están las respuestas a algunas de las preguntas más comunes que recibimos sobre cómo agregar GIFs a un sitio web de WordPress.

¿Insertar GIFs de Giphy ralentizará mi sitio web?

No, insertar GIFs de Giphy es el método recomendado para evitar que tu sitio se ralentice. Dado que el archivo está alojado en los potentes servidores de Giphy, no utiliza tus propios recursos de alojamiento ni ancho de banda. Esto tiene un impacto mínimo en los tiempos de carga de tu página.

¿Puedo crear mis propios GIFs y subirlos a WordPress?

Sí, absolutamente puedes subir tus propios GIFs a la biblioteca de medios de WordPress. Solo ten en cuenta que los archivos GIF suelen ser grandes y pueden consumir espacio de almacenamiento y ralentizar tu sitio si no se optimizan. Cubrimos la mejor manera de hacerlo en nuestra guía sobre cómo agregar GIFs animados en WordPress.

¿Es mejor usar un plugin para insertar GIFs o hacerlo manualmente?

Esto depende de tu flujo de trabajo. El método de código de inserción manual es perfecto si solo planeas agregar un GIF ocasionalmente, ya que no requiere plugins adicionales. Sin embargo, si usas GIFs con frecuencia en tu contenido, un plugin dedicado como EmbedPress ahorra tiempo al permitirte insertarlos con una simple URL.

¿Cuáles son las mejores prácticas para usar GIFs en un sitio web?

Para obtener los mejores resultados, usa GIFs que sean relevantes para tu contenido y que aporten valor, ya sea a través del humor o la ilustración. Intenta no abusar de ellos, ya que uno o dos GIFs bien colocados son más efectivos que una página abarrotada. Finalmente, elige siempre la opción de incrustar adaptable para asegurarte de que tus GIFs se vean bien en todos los dispositivos.

Esperamos que este artículo te haya ayudado a aprender cómo agregar GIFs de Giphy en WordPress. También te puede interesar consultar nuestra selección experta de los mejores plugins de carga de archivos para WordPress y nuestra guía sobre cómo agregar fácilmente imágenes interactivas de 360 grados en WordPress.

Si te gustó este artículo, suscríbete a nuestro canal de YouTube para obtener tutoriales en video de WordPress. También puedes encontrarnos en Twitter y Facebook.