Las entradas en el blog se ven de forma descuadrada, ¿como hacer que todas las imágenes se vean del mismo tamaño y los textos cuadrados? gracias
www.fincasparabodas.es/ en la sección blog.
URL del sitio: Contenido solo visible a usuarios registrados
Hola Israel,
He mirado el blog de Bodas en la url: http://www.fincasparabodas.es/fincas-para-bodas-en-madrid/ y veo que colocas imágenes muy grandes respecto al texto que se muestra.
Te recomiendo que leas este artículo de Berto:
http://www.ciudadano2cero.com/fotos-imagenes-paginas-web/
Si quieres probar algo rápido mientras piensas todo lo que comenta Berto, lo primero que te tendrías que plantear sería si quieres colocar una imagen a la izquierda o derecha de cada entrada o una imagen que ocupe todo el ancho y debajo el texto.
Fíjate en nuestro blog, revisa las primeras páginas y ves avanzando para que veas como lo hacemos ahora y como lo hacíamos en la página 5, 6, 7.
https://www.webempresa.com/blog.html
Si colocas las imágenes a izquierda o derecha de cada artículo tendrás que buscar un tamaño que te guste por ejemplo 200x200 o 250x200, etc y luego tendrás que mostrar texto para que como mínimo ocupe el mismo tamaño que la imagen.
Si revisas varios blogs que te gusten fíjate como lo hacen ellos y que tamaño de imagen usan y cuanto texto colocan.
Saludos
Hola
Adicionalmente a lo que te comentó Alejo, creo que debes tener en cuenta que tus imágenes no tienen la misma proporción, por lo tanto no se verá de manera adecuada incluso si fuerzas las dimensiones por CSS.
Una solución sería que evalues tener todas tus imágenes de la misma proporción, evidentemente habrán imágenes más altas que anchas, en este caso puedes usar un programa gráfico para rellenar espacio con algún fondo.
Otra solución sería usar CSS pero para acomodar lo que tienes actualmente, centrando la imagen, pasando el texto a la parte inferior y poniendo un fondo. Tendrías que agrear un código CSS como el siguiente :
.img-intro-left{ width:100%; text-align:center; background:gray; }
Este código se puede agregar en un CSS personalizado, revisa :
https://www.webempresa.com/blog/agregar-archivo-css-personalizado-para-plantillas-gantry.html
Saludos.
hola, en primer lugar gracias por vuestras respuestas, estoy realizando pruebas.
¿en que ruta debo meter el codigo que me hablas?
Gracias.
ok, ya he visto que era en editar css. resuelto, Muchas gracias a los 2.
Hola Israel.
Primero tienes que crear un archivo personalizado de estilos para que no se pierdan las modificaciones que realices cada vez que actualices la plantilla.
Revisa esta entra del blog que explica como crear el archivo:
Agregar archivo CSS personalizado para plantillas Gantry
Una vez creado el archivo tienes que editarlo y añadir el código que te adjunto Jhon:
.img-intro-left{ width:100%; text-align:center; background:gray; }
Un saludo
Hola Israel,
Encantados de haberte ayudado, gracias a ti.
Aun así estoy revisando tu blog y creo que puedes mejorar la forma en la que muestras las imágenes, por lo que veo te será más fácil utilizar imágenes de 200x250 y el texto a la izquierda o derecha, tendrías que usar siempre una plantilla de imagen vacía con ese tamaño de 200x250 y pegar encima la foto que quieres colocar adaptada ya a 200 de ancho o 250 de alto y luego centrar la foto para que se te adapte a ese tamaño de 200x250.
Si cuando estás haciendo pruebas ves que prefieres otra tamaño en vez de 200x250 prueba tú mismo con el tamaño que más te guste.
Si todas las imágenes tienen el mismo tamaño te quedará mejor.
Saludos