Sizing photos for team showcase page + pixelated images

Ask the Community Customization
1

  • Issue description: Updating headshots on our “meet the team” page and the top of the photo is cut off. Is there a standard size I can use to resize the images before uploading? Also, the images look pixelated after uploading. Headshots I’m referring to: Jason Mickenheim, Michael Moreau, Nikki McDowell. (I haven’t edited any others yet as I assume the same issues with arise). Any help is appreciated. thanks!

  • Link to the page with the widget in question: Meet the Team — Cypress Title

3

Hi there, @user36812 and welcome to the Community :waving_hand:

These issues occur because the intrinsic (original) size of the image is much larger than the rendered size:

image


Currently, you can fix both issues using the code below in the Custom CSS field on the Style tab of your widget’s settings, but we recommend you significantly reduce the original image size:

.eapp-team-showcase-member-card-photo-photo {
  width: 100%;
  height: auto;
}

.global-styles,
.eapp-team-showcase-popup-item-container .eapp-team-showcase-member-card-photo-photo {
  width: auto;
  height: 100%;
}

.global-styles,
.eapp-team-showcase-member-card-photo-photoContainer {
  background-color: #fff;
}

Please check it out and let me know if it helped :slightly_smiling_face:

4

that worked. thank you!

5

It’s my pleasure :wink:

In the meantime, we’d like to invite you to join our Giveaway, where you could win 4 FREE Months for your subscription.

Check the details and join in: May Giveaway: Celebrate Community Anniversary & Win 4 FREE MONTHS! :wrapped_gift: