[David]

I am trying to use the Featured Slider with all existing images at 1920px x 720px. But, this section expands the images to fill the screen vertically which cuts off the right side of the image and leaves the remaining zoomed-in image rather blurry (my screen is 1920×1200). How do I force the images to stay at 1920×720 and respond accordingly without trying to fill the screen? On the homepage, I want to see the next section without having to scroll below the Featured Slider.

Thank you!

[Skandha]

@davewatershape-com: Hello there,
Can you please post in your site URL so that I can look into the issue?

Kind Regards,
Skandha

[David]

https://31a.ef2.myftpupload.com/

The image of the pool reaching out to the trees should really be shorter height and the pool will be centered on the screen.

Right below it is a copy of the same image shrunk down a bit. That second smaller image is a different image slider (Transition Slider) plugin that I was playing with. Is there a way to replace the Photofocus Pro theme’s slider with this other plugin? It would give me more options for the layout. If not, at a minimum I want to be able to add a transparent overlay to the original slider (notice that the Transition Slider is a little darker which helps with the menus and logo if it was at the top of the page and full width).

Thanks,
Dave

[Skandha]

@davewatershape-com: Hello Dave,
It is not possible to shrink the image like you suggested as their is logo and text over the slider image.

To have an overlay over the slider image
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

#feature-slider-section .post-thumbnail:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,0.6);
}

You can change the value 0.6 to change the opacity.
Let me know if this works out!
Kind Regards,
Skandha

[David]

Thank you for the overlay – that works great.

I changed the Featured Slider to use Slider Type = Custom instead of a Post. I added the same image and now it is centered (was offset when I used Post as the source of the slider images). I can add Title and Content without anything changing. But, the 1920×720 image is expanded to fill the 1920×1200 screen, cropping off both sides and making everything else a little blurry. How do I simply keep the image to 720px height maximum?

[Skandha]

@davewatershape-com: Hello Dave,
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

#feature-slider-section .hentry-inner {
	min-height: 720px;
}

Let me know if this works out!
Kind Regards,
Skandha

[Author]

Posts