Overview

ACME saves event template images in multiple sizes to render appropriately in the appropriate location. For example, our system automatically saves a thumbnail size to show below the image on the Event Details page if you have multiple images.


We recommend uploading a high enough resolution image for it to render without pixelation when you open the lightbox from Event Details. (Recommend at least 640px wide.)


Configuring the Aspect Ratio

The aspect ratio of your images is configurable in the Theme for Website and Email. While the size can vary, we recommend keeping to the same aspect ratio for all for consistency throughout the checkout flow.

  • CSS Variables - for Event List Page and Cart page:
    • "@event-image-height""150px",
    • "@event-image-width""150px",
  • CSS Variables - for Event Details Page:
    • "@event-meta-details-event-img-height""200px",
    • "@event-meta-details-event-img-width""200px",
  • CSS Variables - for  Checkout
    • "@checkout-process-order-tickets-image-height""150px",
    • "@checkout-process-order-tickets-image-width""150px",
  • Email Variables
    • "email-item-img-width""150px",
    • "email-item-img-height""150px",

Note:  If your image sizes vary, consider setting the height to "auto" instead of something like "200px":

  • "@event-meta-details-event-img-height""auto",