Modificar mi tema para que se muestren bien las imágenes de la home en el ordenador  

Hola Stefano,

Felices Fiestas!!!! para ti también de parte de todo el equipo de webempresa, estamos encantados de tenerte por aquí :cheer:

Sobre lo que nos comentas, esto es lo que yo veo:

Lo que no entiendo y discúlpame :blush: , es lo que comentas que se desborda.
Si nos adjuntas alguna captura con lo que quieres indicarnos nos seria de ayuda para poder localizarlo y orientarte en la mejor solución.

Un saludo

Hola Pepe! Felices fiestas a ti también!!!

Te adjunto la imagen que aparece en la web (adjunto 1) y la imagen original (adjunto 2). Como ves la distancia entre la cabeza de Iván Ferreiro y el top margin es mucho más pequeño en la web que en la foto original. De por sí esto es normal porque para adaptar la imagen al tamaño de la pantalla, CSS hace un resize de la imagen.

Lo que busco es que el resize no implique un desbordamiento del top margin, es decir, que si hace falta extender la imágen en sentido vertical, esto se haga solo extendiendo la foto por el bottom-margin.

Si no estoy confundido el CSS que rige la fullscreen gallery de la home es el que he copiado en mi primera entrada. Esto lo he determinado por el siguiente archivo gallery-fullscreen-cover.php:

ID);
$current_page_id = '';

if(isset($page->ID))
{
$current_page_id = $page->ID;
}

//Check if gallery template
$grandphotography_page_gallery_id = grandphotography_get_page_gallery_id();
if(!empty($grandphotography_page_gallery_id))
{
$current_page_id = $grandphotography_page_gallery_id;
}

//Check if password protected
get_template_part("/templates/template-password");

$grandphotography_homepage_style = grandphotography_get_homepage_style();

$tg_full_menu_transparent = kirki_get_option('tg_full_menu_transparent');

if(THEMEDEMO && isset($_GET['nocrop']) && !empty($_GET['nocrop']))
{
$tg_full_menu_transparent = '';
}

if(empty($tg_full_menu_transparent))
{
$grandphotography_homepage_style = 'fullscreen_white';
}
else
{
$grandphotography_homepage_style = 'fullscreen';
}
grandphotography_set_homepage_style($grandphotography_homepage_style);

get_header();

$nocrop_query = '';
if(THEMEDEMO && isset($_GET['nocrop']))
{
$nocrop_query.= '&nocrop=1';
}

//Run gallery script data
wp_enqueue_style("supersized", get_template_directory_uri()."/css/supersized.css", false, THEMEVERSION, "all");

wp_enqueue_script("supersized", get_template_directory_uri()."/js/supersized.3.2.7.min.js", false, THEMEVERSION, true);
wp_enqueue_script("supersized-shutter", get_template_directory_uri()."/js/supersized.shutter.min.js", false, THEMEVERSION, true);
wp_enqueue_script("touchwipe", get_template_directory_uri()."/js/jquery.touchwipe.1.1.1.js", false, THEMEVERSION, true);
wp_enqueue_script("grandphotography-supersized-gallery", admin_url('admin-ajax.php')."?action=grandphotography_script_supersized_gallery&gallery_id=".$current_page_id.$nocrop_query, false, THEMEVERSION, true);
?>

Hola Stefano.

Puede ser que estés utilizando Revslider para la galería de imágenes?

Si estas utilizando ese plugin, la alineación de la imagen la puedes realizar desde las opciones de las imágenes o desde el apartado Background si las imágenes son de Background del slider:

Un saludo

Hola Pepe... no, no estoy utilizando el RevSlider. Incluso lo acabo de desactivar y como puedes ver esto no afecta al funcionamiento de mi web. La solución tiene que estar en otro lado... ¿No crees que habría que trastear el supersize.css que he cortado/pegado antes?

Hola Stefano

Veo que hay un top con un margen negativo en la imagen, prueba con el siguiente código CSS:

#supersized li.prevslide img, #supersized li.activeslide img#supersized li.prevslide img, #supersized li.activeslide img{
	top:0!important;
}

Puedes agregar este código al final de algún archivo CSS, como:
/wp-content/themes/grandphotography/css/jqueryui/custom.css

Felices Fiestas!!

Saludos.

Gracias gracias gracias.
Llevaba semanas con este asunto... Qué alegría :silly:

Una pregunta, ¿sería posible limitar la siguiente función solo para el desktop (excluyendo móviles y tabletas)? ¿O por lo menos limitándola a un determinado tamaño de la pantalla?

#supersized li.prevslide img, #supersized li.activeslide img#supersized li.prevslide img, #supersized li.activeslide img{
top:0!important;
}

Hola

Si es posible, puedes usar un media query, por ejemplo para tamaños de pantalla mayores a 980px

@media (min-width:980px){
	#supersized li.prevslide img, #supersized li.activeslide img#supersized li.prevslide img, #supersized li.activeslide img{
	top:0!important;
	} 
}

Saludos.