Event's Featured Images showing different sizes
-
When I use the #_EVENTIMAGE placeholder, even though my images are all 120×120, they’re displaying as different sizes on the Event List page. Here’s a screenshot to illustrate: https://i61.tinypic.com/2yxoe4h.png; the live page is https://carolinashowski.org/see/events/
Here’s the code I have in the “Default event list format” box in the event that’s the cause:
<tr> <td style="vertical-align: middle;"> #_EVENTDATES<br/> #_EVENTTIMES </td> <td> {has_image}<div style="float:left; padding: 10px 20px 5px 0px; vertical-align: middle;"> <a href=#_EVENTURL alt="Carolina Show Ski Team #_EVENTNAME">#_EVENTIMAGE{120,0}</a> </div><div style="vertical-align: middle;">{/has_image} {no_image}<div style="position: relative; left: 140px; vertical-align: middle;">{/no_image} #_EVENTLINK {has_location}<br/><i>#_LOCATIONNAME, #_LOCATIONTOWN #_LOCATIONSTATE</i>{/has_location} </div> </td> </tr>
As an aside, I added the {has_image} and {no_image} code lines since the events without images were aligned left and it looked goofy. An unintended consequence of that code is that the mobile view of the page aligns the event titles and location off the screen viewing area since it’s making room for the lack of image, whereas the events with an image are aligned so that it’s all visible because the responsive view realigns everything properly. I tried to upload a featured image of a transparent 120×120 block, but it made the page so much longer for the image-less photos, I didn’t like that look either. I’d also be interested in hearing how others handled events with and without images.
- The topic ‘Event's Featured Images showing different sizes’ is closed to new replies.