This help doc explains where to add event graphics and how different image options affect how your event displays.
Important Note
If you update an image and see it on the back end of VBO but not on your website, clear your browser cache or view the page in an incognito window. Images are cached by your browser.
Where to Add Event Graphics
- Go to EVENTS > MANAGE EVENTS
- Find your event in Open Events
- From Select Action, choose Event Graphics
Event Graphic Options
Medium Event Poster
- Main event image
- Displays on the event list/grid, and event page.
Can display:
- Full width with description below, or
- Floating next to the description
Large Event Poster (Optional)
- Changes the top of the Read More page if used and displays as a background-style image at the top
- Enabling “show large poster on event page” will display two posters. Disable this option if you only want one.
Image Sizes & Display
Image Sizes:
Images are dynamic and fluctuate depending on what device and screen size the user is on (tablet, mobile, desktop or laptop), and what your website container width is (where the plugin is embedded).
When uploading images, the width is the most important since the image height can be longer or shorter depending on which view you want to use (list view or grid view), and if you want more of a tall poster look or a short/rectangular look.
If you would like consistency with all your events, upload the same size posters (width and height) for all your events.
List View - will automatically crop the height of the poster in order to maintain a fixed height. Images in this set up should be more of a rectangular shape for this view. (Optimal size: 630px wide. No wider than 1000px.).
If you want the full height of your poster, set your plugin to grid view. How to set the default plugin view.
If you want the full height of your poster, set your plugin to grid view. How to set the default plugin view.
Grid View - Images in this view will display the entire height of the image. If all images are different heights, it will display in more of a masonry display.
Grid View with different image heights:
