[Support request] How do I get the photo to focus on the exact area I want?

Hi Heath,

Instead ofcenter center, try using values,eg. 50% 50%.

The 2 values are presenting the position of X direction and Y direction.

If you want to move the image down, try a higher value for the 2nd value, eg. 50% 70%.

Hi Heath,

Ok. And then is there a way to make the whole image a clickable link?

Making the whole image clickable w/ the current card layout of your site will require you to set a Dynamic link to the Container block w/ the background image.

I’m lost on the whole image and box size. I am trying to create something to the same effect of the homepage in the private info box. What size images are listed under the category tab?

For this one, the site is taking a different approach to what your site currently has.

This reference site basically has:

Container Element
>> Image element

The container element holding the image is set to this CSS:

position: relative;
width: 100%;
height: auto;
overflow: hidden;
padding-bottom: 41.6667%;

While the image it contains is set to have this CSS:

left: 0px;
    top: -20.4965px;
    width: 363px;
    height: 191.993px;
    position: absolute;

For you to be able to replicate this, you first will need to copy how it’s laid out.

In your case, you can place a dynamic image element inside a Container block and let us have a look at it for further custom CSS styling. 😀

What are the steps for a dynamic image again?

For a dynamic image as a block, you can use the dynamic image block and set it to featured image as shown here –
https://share.getcloudapp.com/d5uN6xBp

The arrangement for the image would be something like this –
https://share.getcloudapp.com/kpu46EBo

Add the CSS class featured-image-wrapper to the container block’s additonal CSS field so we can use it for styling the container specifically for the featured image. 😀