Blog WordPress

¿Cómo insertar imágenes en WordPress?

Cuando desarrollamos un sitio web, ya sea con WordPress o con cualquier CMS, las imágenes juegan un papel muy importante en el diseño. Un sitio web sin imágenes carece de personalidad y el contenido es difícil de digerir.

Por otro lado, el exceso de imágenes tampoco es bueno en el diseño de un sitio web. Una buena imagen puede ofrecer mucha información sobre el contenido de una página o entrada pero el exceso de imágenes puede hacer que el lector pierda el foco y significado del contenido.

Índice del contenido
    Add a header to begin generating the table of contents

    1. El tamaño correcto de una imagen

    Para comenzar a trabajar en una página o entrada, es necesario conocer el tamaño correcto que debe tener la imagen (o imágenes) que vamos a utilizar.

    Algunas veces, se suele usar imágenes irresponsablemente cuando se desarrolla un sitio web..

    Esto se traduce de la siguiente manera:

    • Si utilizas imágenes muy grandes, el sitio web carga más lento y esto hace que pierdas usuarios.
    • Si utilizas imágenes muy pequeñas, se rompe el diseño y tus usuarios no se sentirán a gusto.

    El espacio asignado para una imagen suele ser asignado por el tema que utilices. Mediante HTML y CSS se marcan los límites y tamaños de las imágenes para que se vean correctamente en el sitio web.

    Entonces, ¿cómo conocer el tamaño correcto de la imagen?

    Existe una extensión llamada Web Developer muy útil para trabajar con sitios web y se instala en los navegadores Chrome, Firefox y Opera. Puedes instalarla haciendo clic en el siguiente enlace: web developer.

    Una vez instales la extensión (o complemento), en la parte superior derecha de tu navegador aparecerá un icono de rueda dentada.

    Web Developer para Chrome, Firefox y Opera
    Web Developer para Chrome, Firefox y Opera

    Esta extensión cuenta con una serie de herramientas con las que podrás conocer cientos de parámetros de un sitio web.

    Para conocer el tamaño exacto de un elemento, sigue los siguientes pasos:

    1. Abre en el navegador la página o entrada donde quieras insertar una imagen.
    2. Haz clic en el icono de la extensión y selecciona la pestaña Information.
    3. Haz clic en Display Element Information. Verás como el cursor del ratón ha cambiado por una cruz y, en la parte inferior del navegador, se ha abierto otra ventana.
    Utilizando Web Developer en mi sitio web
    Utilizando Web Developer en mi sitio web

    Haciendo clic en cualquier elemento de la página, podrás conocer el tamaño exacto de ese elemento. El elemento que has seleccionado estará dentro de un rectángulo de borde rojo y en la ventana inferior aparecerá información relativa al elemento.

    La información que nos interesa conocer son las dimensiones (ancho y alto) del elemento que se encuentra en el recuadro Layout. Las dimensiones vienen dadas en pixeles (px).

    Midiendo las dimensiones de un elemento con Web Developer
    Midiendo las dimensiones de un elemento con Web Developer

    Como puedes observar en la imagen anterior, el ancho del elemento es width: 640px y el alto es height: 135px.

    Por ejemplo. Vamos a insertar una imagen entre el título principal y el primer bloque de texto.

    Conocemos las dimensiones del elemento que acabamos de medir: un bloque de texto. Por lo tanto, para insertar una imagen justo encima de este elemento, la imagen deberá tener 640px de ancho.

    La altura de la imagen puede ser cualquiera. Ten en cuenta que en un sitio web, por lo general, los límites son horizontales.

    Anuncio publicitario

    2. La extensión de una imagen

    Otra característica importante a tener en cuenta, antes de subir una imagen a un sitio web, es la extensión de la imagen.

    Dependiendo del uso que vaya a tener la imagen, podrá tener una extensión diferente de las demás.

    Las extensiones más comunes, usadas en un sitio web, son:

    • JPG: utilizadas para fotografías o gráficos web.
    • PNG: utilizadas para logos, gráficos, infografías y capturas de pantalla.
    • GIF: utilizadas para logos y animaciones.
    • SVG: es un formato vectorial y es utilizado para logos, iconos y casi cualquier tipo de imagen sin pérdida.

    El formato PNG permiten crear imágenes con fondo transparente (ideal para logos e iconos) y, utilizando unas buenas herramientas de optimización, pueden llegar a pesar muy poco sin perder calidad.

    3. ¿Dónde encontrar imágenes para mi sitio web?

    Ahora que ya sabes como conocer el tamaño exacto de una imagen y la extensión vamos a buscar una imagen para nuestro sitio web.

    Lo que suelen hacer algunas personas es invocar a Google y buscar en su banco de imágenes. Ten en cuenta que estas imágenes "no pertenecen a Google" sino a otros sitios web que Google ha indexado así que ve con cuidado cuando quieras utilizar una imagen que hayas encontrado en Google porque podría tener derechos de autor.

    Existen varias plataformas como Shutterstock donde se pueden comprar todo tipo de imágenes y vídeos libre de derechos de autor.

    También existen otros cientos de plataformas donde descargar imágenes gratis pero a cambio de una mención al autor mediante un enlace desde tu sitio web. Una de ellas es Freepik.

    Otra alternativa es hacer fotogarfías. Esta es la mejor opción si estás desarrollando un sitio web de un lugar físico como un gimnasio, restaurante o una clínica, por ejemplo.

    La entrada, dónde conseguir imágenes gratis, nos ofrece información relevante de varios sitios web donde descargar imágenes gratis además de una información muy completa sobre el tipo de licencias de autor (Copyright).

    4. ¿SEO para imágenes?

    Así es. Las imágenes influyen en un gran porcentaje en el SEO de un sitio web. Por esta razón es muy importante que respetes y cumplas ciertas directrices para que tu sitio web se posicione correctamente.

    Ten en cuenta que Google no solo posiciona un sitio web por el contenido textual. También lo hace por las imágenes y ofrece un valor añadido para que te encuentren en los resultados de las búsquedas.

    Existen varios factores que Google toma en cuenta para incluir un sitio web en los resultados de las búsquedas. A continuación te enumero los más importantes y lo que tienes que hacer para optimizar correctamente tus imágenes.

    4.1 Redimensionar o escalar una imagen (Velocidad de carga)

    La velocidad de carga de un sitio web es uno de los factores más importantes para el SEO.

    Afecta directamente a tus usuarios y es motivo para que el usuario se marche de tu sitio web si tiene que esperar mucho tiempo para ver la información que le ofreces.

    Para que entiendas mejor el concepto de redimensionar una imagen te pongo un ejemplo (algunos programas suelen usar el término escalar una imagen).

    Supongamos que tenemos una imagen de 200px de ancho y 100px de alto. Necesitamos que la imagen tenga 100px de ancho, lo que sería la mitad de la original.

    Al redimensionar una imagen, si se modifica una de sus dimensiones, la otra también lo hace proporcionalmente; es decir, si el ancho se reduce a la mitad, la altura también se reduce a la mitad. Una simple regla de tres.

    Por lo tanto la imagen redimensionada tendría 100px de ancho y 50px de alto. En ningún momento hemos recortado la imagen ya que nos interesa la imagen completa sin perder nada.

    Lo mismo pasaría si se modifica la altura. El ancho se reduce a la mitad.

    Continuando con el ejemplo inicial, vamos a buscar una imagen que tenga un ancho mayor o igual a 640px y sea de la temática de nuestro sitio web.

    La imagen que hemos descargado tiene 1920px de ancho1080px de alto y pesa 182KB. Ten en cuenta que al modificar las dimensiones, también cambia el peso de la imagen.

    Al redimensionar la imagen, el resultado es el siguiente:

    • Ancho: de 1920px a 640px
    • Alto: de 1080px a 360px
    • Peso: de 182KB a 46KB

    El peso se ha reducido 136KB. Pareciera no tener importancia pero, si multiplicas eso por 1000 imágenes que pudiera tener un blog, a largo plazo, 136MB (136.000 KB) es un peso que se podría evitar y mejoraría la velocidad de carga de tu sitio web.

    Pero, ¿con qué se redimensiona una imagen?

    Existen cientos de aplicaciones con las que puedes redimensionar imágenes. Una de mis aplicaciones favoritas es GIMP.

    Es un programa gratis que puedes descargar e instalar en tu ordenador (computadora) y, además de redimensionar imágenes, te permite hacer casi cualquier cosa ya que es muy similar a Photoshop.

    Para descargar el programa haz clic en GIMP. En este tutorial puedes aprender a redimensionar una imagen con GIMP.

    GIMP: software gratuito de edición de imágenes
    GIMP: software gratuito de edición de imágenes

    4.2 Recortar una imagen (Simetría)

    Imagínate que quieres subir 3 imágenes, una al lado de la otra, como si fuera una galería. Estas imágenes tienen diferentes dimensiones y, cuando las has redimensionado, la altura de las 3 es diferente.

    Lo recomendable es que recortes las 2 imágenes de mayor altura con la medida de la imagen de menor altura de manera que, cuando subas las imágenes a tu sitio web, estas tengan las mismas dimensiones.

    Esto es algo que, a nivel de diseño, ofrece una simetría que visualmente es más agradable para el usuario y da un toque más profesional a tu sitio web.

    En este tutorial puedes aprender a recortar una imagen con GIMP.

    4.3 Nombre de la imagen (Indexación)

    Para ayudar a Google a indexar las imágenes de tu sitio web, es necesario que las renombres correctamente teniendo en cuenta las siguientes reglas:

    • Que el título esté escrito todo en minúsculas. Intenta que coincida con el título de la página o entrada. Por ejemplo: gimnasio-training-fitness.jpg.
    • Que cada palabra esté separada por guiones (sin espacios).
    • Que ninguna palabra tenga tildes (acentos).
    • Que ninguna palabra tenga símbolos o caracteres especiales como la letra “ñ”. Si una palabra lleva “ñ”, puedes escribir la letra “n” en su lugar.

    4.4 Optimizar una imagen (Espacio en el servidor)

    Una imagen comprimida mejora, aún más, la velocidad de carga de un sitio web.

    Las imágenes suelen contener cierta información adicional que, para un sitio web, no interesa. Por esto es necesario quitar toda esa información para que el archivo pese menos y no ocupe más espacio de lo necesario en el servidor.

    Existe una herramienta online llamada TinyPNG que se encarga de eliminar toda esa información innecesaria sin alterar la imagen. Puedes acceder a esta herramienta desde TinyPNG.

    Selecciona la imagen (o imágenes) y arrástrala directamente al navegador. Inmediatamente el oso panda comenzará a hacer su trabajo. Una vez finalice, haz clic en download para descargar la imagen comprimida.

    TinyPNG: aplicación online para comprimir imágenes
    TinyPNG: aplicación online para comprimir imágenes

    Como puedes observar en la imagen, TinyPNG ha reducido el peso de la imagen en un 28%. Si abres la imagen original y la imagen comprimida, verás que no existe ninguna diferencia ni se ha alterado la imagen original.

    El resultado...

    La imagen comprimida tiene las siguientes características:

    • Formato: JPG
    • Nombre: gimnasio-training-fitness.jpg
    • Dimensiones: 640px de ancho y 360px de alto
    • Tamaño: 33KB

    La imagen se encuentra lista para subirla a nuestro sitio web.

    5. Subir una imagen a WordPress

    Inicia sesión en WordPress y dirígete a la página o entrada donde vayas a subir la imagen.

    La mayoría de entradas y lecciones de los cursos de este sitio web, están basados en el manejo del editor de contenidos: Elementor.

    Si aún no conoces Elementor, puedes echarle un vistazo a la lección instalación y configuración de Elementor, para que conozcas el funcionamiento de este editor de contenidos.

    Elementor Page Builder

    Uno de los mejores editores de contenido que puedes instalar para crear un proyecto profesional con WordPress, es Elementor. Ofrece una versión gratuita, que puedes instalar desde WordPress y, una de pago, con excelentes opciones de diseño.

    Es rápido, fiable y poderoso. Se adapta perfectamente a "casi" cualquier tema y posee una estructura perfecta para el desarrollo de sitios web profesionales.

    1. En la página (o entrada) haz clic en Editar con Elementor.
    2. Crea una sección, de 1 columna, y arrástrala justo debajo del título principal.
    Creando una sección en Elementor
    Creando una sección en Elementor
    1. En el panel de Elementor haz clic en el icono superior derecho  para acceder a los widgets.
    2. En la pestaña BÁSICO selecciona el widget Imagen y arrástralo a la sección que acabas de crear.
    Insertar una imagen en Elementor
    Insertar una imagen en Elementor
    1. Para insertar la imagen, en el panel de Elementor, haz clic en la imagen (Seleccionar imagen).
    Subiendo una imagen a WordPress
    Subiendo una imagen a WordPress

    Tienes dos opciones para subir una imagen:

    • La seleccionas desde tu PC y la arrastras hasta la pantalla Insertar medio.
    • En la pestaña, Subir archivos, haz clic en el botón Seleccionar archivos, la buscas en el PC y la subes.

    Antes de insertar la imagen, verás otros campos que tienes que tener en cuenta:

    • Título: por defecto te muestra el nombre que has dado a la imagen. Puedes cambiarlo por un título que sea acorde al contenido de la página o entrada.
    • Leyenda: sirve para añadir texto debajo de la imagen y explicar su contenido. Es opcional.
    • Texto alternativo: este campo es el más importante y se conoce como etiqueta ALT. Es un parámetro de las imágenes que hay que tener siempre en cuenta para el SEO.
    • Descripción: es una descripción más amplia de la imagen y ayudará a Google a saber de qué trata la imagen.

    Teniendo claros estos puntos, haz clic en el botón Insertar medio.

    Imagen subida a WordPress
    Imagen subida a WordPress

    En la pestaña Contenido del panel de Elementor se encuentran algunas opciones para configurar la imagen:

    • Puedes seleccionar el tamaño en el que quieres que se cargue la imagen. Vamos a seleccionar Completo para que se muestre en tamaño real (640px de ancho y 360px de alto).
    • Puedes indicar la alineación que tendrá la imagen: izquierda, centro o derecha.
    • Puedes indicar si quieres que se muestre la leyenda de la imagen.
    • Puedes asignar un enlace a la imagen.

    En la pestaña Estilo puedes encontrar otras opciones para configurar la imagen como: ancho, borde y sombra entre otros.

    Configuración de una imagen en Elementor
    Configuración de una imagen en Elementor
    1. Haz clic en ACTUALIZAR.
    2. Abre en el navegador la página o entrada para visualizar los cambios.

    Si medimos la imagen veremos lo siguiente:

    Midiendo una imagen en un sitio web
    Midiendo una imagen en un sitio web

    La imagen tiene 620px de ancho y 349px de alto. ¿Qué ha pasado?

    Por defecto, algunos editores de contenido como Elementor, añaden un espacio de relleno (padding) a los widgets. Para que la imagen se adapte al tamaño completo del contenido, hay que modificar el relleno.

    En la entrada, HTML y CSS para WordPress, puedes encontrar una completa información para que conozcas y comprendas en uso de los márgenes y rellenos.

    1. Regresa a la edición de la página o entrada con Elementor.
    2. En la parte superior izquierda de la imagen verás el ícono de la columna. Haz clic en este ícono.
    3. En el panel de Elementor aparecerán las opciones de la columna. Haz clic en la pestaña Avanzado.
    4. Escribe "0" (cero) en Relleno (padding).
    5. Haz clic en ACTUALIZAR.
    Quitando el relleno en la imagen con Elementor
    Quitando el relleno en la imagen con Elementor

    De esta forma, hemos quitado el relleno que añade Elementor, por defecto, a los widgets y la imagen se adapta perfectamente al contenido del sitio web.

    Imagen subida a un sitio web
    Imagen subida a un sitio web

    6. Optimizar imágenes en WordPress

    Como vimos en el punto 4.4, con TinyPNG podemos optimizar una imagen reduciendo su peso para no afectar la velocidad de carga de nuestro sitio web. Esta reducción se realiza externamente en la imagen antes de subirla.

    Sin embargo, existen plugins de compresión de imágenes que realizan este mismo trabajo internamente con WordPress.

    En ediciones anteriores, había creado esta entrada con el plugin Smush – Compress, Optimize and Lazy Load Images.

    A partir de esta edición he decidido utilizar el plugin Imagify – Optimize Images & Convert WebP por las siguientes razones:

    • Aunque Smush no tiene límite de imágenes, Imagify permite comprimir hasta 25MB al mes (aproximadamente 250 imágenes). Si no subimos muchas imágenes al mes, Imagify es una buena opción también.
    • Smush puede comprimir imágenes de hasta 5MB mientras que Imagify hasta 2MB en sus versiones gratuitas. Otra ventaja para Smush pero, no tiene sentido subir imágenes tan grandes a WordPress cuando contamos con herramientas para redimensionarlas y comprimirlas.
    • Aunque los 2 plugins son FREEMIUM, la opción de pago de la versión PRO de Imagify es más económica que Smush. Con Imagify, si no quieres pagar una suscripción mensual, se puede comprar un paquete de imágenes una sola vez.
    • Por último y la característica que me hizo decidir este cambio, es que Imagify puede convertir las imágenes a formato WebP, totalmente gratis, mientras que Smush solo lo hace con una suscripción PREMIUM.

    El formato de imágenes WebP, comprime las imágenes mucho más sin perder calidad y mejora la velocidad de carga del sitio web. Este formato ha sido creado por Google y se tiene muy en cuenta en los test de Google PageSpeed Insights.

    https://es.wordpress.org/plugins/imagify/

    Para instalar el plugin:

    1. Dirígete al apartado Plugins >> Añadir nuevo.
    2. En el campo de búsqueda escribe Imagify.
    3. Haz clic en Instalar ahora y seguidamente en Activar.

    Una vez activo el plugin, veremos un aviso donde tenemos que realizar las siguientes acciones:

    Opciones de registro y configuración de Imagify
    Opciones de registro y configuración de Imagify
    Comenzar a crear una cuenta en Imagify
    Comenzar a crear una cuenta en Imagify
    Introducir la clave API en Imagify
    Introducir la clave API en Imagify

    6.1 Configurar

    A continuación, el plugin nos redirigirá a esta página donde podemos comenzar a configurar el plugin.

    También podemos acceder a este apartado desde Ajustes >> Imagify.

    I. Ajustes generales

    En esta primera opción podemos indicar el nivel de optimización de nuestras imágenes: Normal, Agresivo o Ultra. Haz clic en el enlace ¿Más información? para conocer las diferencias entre los niveles.

    Ajustes generales en Imagify
    Ajustes generales en Imagify

    Es muy recomendable marcar la opción Backup de las imágenes originales para restaurarlas por si algo sale mal. De esta forma podemos restaurar las imágenes originales si el plugin no hace bien su trabajo.

    La pequeña desventaja que presenta esta característica es que consumirá más espacio en el disco de nuestro servidor. Tampoco es algo para alarmarse si tenemos un sitio web pequeño pero lo más importante es tener la seguridad de que podremos recuperar las imágenes.

    Las imágenes originales se guardarán en la ruta wp-content/uploads/backup/.

    II. ¿Eres nuevo en Imagify?

    Si hacemos clic en ¿QUÉ PLAN NECESITO?, el plugin calculará cuántos MB usamos en función de las imágenes alojadas en nuestro sitio web y el tiempo que tenga el plugin instalado.

    Nos recomendará si es necesario contratar un plan de pago o seguir con la opción gratuita.

    Análisis de imágenes en Imagify
    Análisis de imágenes en Imagify

    III. Optimización

    En esta opción podemos configurar las imágenes WebP, redimensión de las imágenes grandes y los diferentes tamaños de imágenes creados por WordPress.

    Adicionalmente podemos elegir si queremos optimizar las imágenes de el(los) tema(s) que tenemos instalado(s).

    Optimización en Imagify
    Optimización en Imagify

    IV. Opciones de visualización

    Marcando la casilla, el plugin añadirá un menú de acceso rápido en la barra de administración de WordPress.

    Menú de acceso rápido en Imagify
    Menú de acceso rápido en Imagify

    6.2 Optimización Masiva

    Dirígete al apartado Medios >> Optimización Masiva y haz clic en IMAGIFICALO TODO para comenzar con la optimización de las imágenes en el sitio web.

    Optimización masiva en Imagify
    Optimización masiva en Imagify

    Cuando el plugin haya finalizado de optimizar las imágenes, mostrará un resumen del total optimizado y el crédito disponible para optimizar más imágenes en lo que resta del mes.

    Resumen de la optimización en Imagify
    Resumen de la optimización en Imagify

    7. Gestionar imágenes en WordPress

    Todas las imágenes que se suben a WordPress se suelen guardar en el servidor en un directorio llamado uploads que se encuentra en la ruta: wp-content/uploads/.

    Además, si has configurado los ajustes de medios en el apartado Ajustes >> Medios para que se guarden en carpetas basadas en el mes y año, las imágenes se guardarán en la ruta wp-content/uploads/(año)/(mes)/.

    Si necesitas saber más sobre los ajustes en WordPress, en la lección del curso de WordPress, qué hacer después de instalar WordPress, puedes encontrar una información más detallada sobre este apartado.

    En los Ajustes de medios marcamos la casilla Organizar mis archivos subidos en carpetas basadas en mes y año.

    Ajustes de medios en WordPress
    Ajustes de medios en WordPress

    Para entender mejor como funciona este ajuste, te pongo un ejemplo:

    El día 8 de enero de 2019 has publicado un artículo que habla sobre peces dorados y subes una imagen con el nombre peces-dorados.png.

    Esta imagen se ha alojado en el servidor con la ruta wp-content/uploads/2019/01/peces-dorados.png (2019 el año y 01 el mes).

    Luego el día 10 de febrero de 2019 publicas otra entrada que también habla de peces dorados y subes otra imagen con el nombre peces-dorados.png.

    Esta imagen se ha alojado en el servidor con la ruta wp-content/uploads/2019/02/peces-dorados.png.

    Lo normal es que no existan 2 imágenes con el mismo nombre en la misma ruta ya que no es lógico pero, al tener esta casilla activada, WordPress la alojará en diferentes directorios por lo que no habrá conflictos con los nombres de las imágenes.

    Igualmente, si subes dos imágenes con el mismo nombre, el mismo mes y el mismo año, WordPress te permitirá subirla pero modificando el nombre de la última imagen: wp-content/uploads/2019/01/peces-dorados.png (primera imagen) y wp-content/uploads/2019/01/peces-dorados-1.png (segunda imagen).

    En WordPress, en el apartado Medios, puedes ver en formato lista o cuadrícula, todas las imágenes que componen tu sitio web. Desde este apartado puedes editar y borrar las imágenes que ya no utilices.

    Gestión de imágenes en WordPress desde el apartado Medios
    Gestión de imágenes en WordPress desde el apartado Medios

    Muy importante...

    Intenta siempre borrar las imágenes desde WordPress, ya sea desde el apartado Medios o desde cualquier página o entrada.

    Nunca borres las imágenes desde el servidor ya que las imágenes también se guardan en la base de datos y, si las borras desde el servidor, la base de datos no sabrá que ya no existen y se convertirán en errores 404 muy penalizados por Google.

    Anuncio publicitario

    8. Conclusión

    Con este sencillo tutorial podrás comenzar a trabajar con tus imágenes en WordPress correctamente. Recuerda que las imágenes cumplen un papel fundamental en el SEO de tu sitio web. Pueden ser tan útiles como llegar a convertirse en un dolor de cabeza si no las gestionas y optimizas adecuadamente.

    ¿Te ha gustado?

    Te estaría muy agradecido si pudieras valorar esta entrada y compartirla en tus redes sociales. De esta manera me animas a continuar trabajando en este proyecto y ayudas a otras personas que desean aprender.

    (14 votos, promedio: 4.9 de 5)

    Facebook
    Twitter
    WhatsApp
    Telegram
    Email

    ¿Me invitas un café?

    Todo el contenido que puedes encontrar en este sitio web es gratis y siempre lo será pero, mantenerlo, requiere de muchos cafés y muuuuchas horas . Si te gusta mi trabajo y te está ayudando, considera invitarme un café para apoyarme y apoyar este proyecto. ¡Te invito un café!.

    Suscríbete y aprende WordPress desde cero

    No me gusta el SPAM y se que a ti tampoco. Sólo recibirás información útil sobre WordPress.

    Al enviar, confirmas que has leído y aceptas la política de privacidad. Conoce nuestro compromiso con tu privacidad.

    Comparte tu experiencia

    Deja un comentario si tienes alguna duda o cuéntanos cómo ha sido tu experiencia.

    Suscríbete!
    Avísame sobre

    5 Comentarios
    Inline Feedbacks
    Ver todos los comentarios

    Gracias Gian solucione el problema con el logo muy explicito

    Hola Eduardo, me alegra que lo hayas solucionado. Gracias a ti por escribir. Saludos!

    Hola Gian muy buena entrada, tengo un problema con el tamaño de mi logo no se si me podrás ayudar. Estoy usando el tema Hestia y cuando subo el logo se ve muy chico pero no se porque. He visitado páginas que usan el mismo tema y su logo es mucho más grande. Probe con tamaños de imagen de 2000px hasta 400px pero sigue igual. Desde ya muchas gracias

    Hola Facundo, no conozco mucho el tema Hestia pero lo he instalado y he hecho una prueba con un logo de 275x75 pixeles y se ve bastante bien. Lamentablemente Hestia no ofrece la opción de variar el ancho del logo (o al menos no la he encontrado) como el tema Astra que es el que uso en el curso de WordPress. Es muy raro que tu logo no se vea bien. En tal caso, si usas Elementor PRO para el diseño, puedes crear una cabecera personalizada con Elementor y pasar de las opciones de cabecera de Hestia. He comenzado un curso de Elementor donde veremos todo lo que se puede hacer con este editor de contenidos. Lo puedes comenzar aquí: curso de Elementor o desde mi canal de YouTube donde comenzaré en unos días. Recuerda suscribirte al blog y al canal para mantenerte informado. Un saludo!

    Okay gracias Gian, ahora voy a ver probando con el tamaño de 275x75 y si no bueno me tendre que hacer con elementor Pro y modificar la cabecera desde ahí. Muchas gracias saludos!

    Entradas relacionadas

    5
    0
    ¿Dejas un comentario? Gracias!x

    Tratamiento de datos personales

    • Responsable: MARIA ANTONIETA BEAUTY CONCEPT, S.L.
    • Finalidad: Suscribirte a la lista de correos electrónicos.
    • Derechos: Podrás ejercer tus derechos de acceso, rectificación, limitación y suprimir los datos en legal@cursowordpress.com, así como el derecho a presentar una reclamación ante una autoridad de control.
    • Destinatarios: Los datos no se cederán a terceros salvo en los casos en que exista una obligación legal.
    • Información adicional: En mi política de privacidad encontrarás información adicional sobre la recopilación y el uso de su información personal incluida información sobre acceso, conservación, rectificación, eliminación, seguridad y otros temas.

    Tratamiento de datos personales

    • Responsable: MARIA ANTONIETA BEAUTY CONCEPT, S.L.
    • Finalidad: Moderar y responder comentarios de usuarios.
    • Derechos: Podrás ejercer tus derechos de acceso, rectificación, limitación y suprimir los datos en legal@cursowordpress.com, así como el derecho a presentar una reclamación ante una autoridad de control.
    • Destinatarios: Los datos no se cederán a terceros salvo en los casos en que exista una obligación legal.
    • Información adicional: En mi política de privacidad encontrarás información adicional sobre la recopilación y el uso de su información personal incluida información sobre acceso, conservación, rectificación, eliminación, seguridad y otros temas.