Events apearing slightly out of order

[josephmak]

I am trying to diagnose an issue with some events appearing out of order in my photo view. I have customized some templates, but I can confirm that the issue persists when I rename the tribe-events folder and disable the customizations. I have also run through the steps of disabling all plugins and deactivating the theme to see if there were conflicts.

I have provided the url for the staging site where we can test.

On the event listing, the Big Rock event which is on the 26th comes before the Beer Revolution event that starts on the 25th. The beer revolution event is a series, I don’t know if this affects anything. Other events that appear out of order are the Village Brewmaster’s Dinner and Calgary Oktoberfest. I have tried modifying the post date on the events to see if that would be a workaround, but that didn’t seem to work either.

The site has gone live, but we want to clear this issue up for the client asap. I can provide login creds for the staging site if need be to diagnose.

Any insight is greatly appreciated!

Thanks

[Josh]

Hey,

Thanks for reaching out to us!

I took a look at the site and it appears when looking at the markup, the events are actually being output in the right order. It looks like the javascript that allows for each event to show up in the proper location based on it’s size is causing some of the events to be moved since they are a better fit for that stacked type of layout.

I created an internal ticket for tracking this issue. You’ll be notified here as we make progress on this one.

I apologize for any inconvenience.

Thanks!

[josephmak]

Any progress on this?

I am also trying to get the events to line up horizontally on the listing page as opposed to fit in nice and tiled the way it is now. I have tried a few different things (putting three events into a row etc…) with no luck. I think my lack of success on this endeavour is related to the javascript you mentioned above. Is there a good way to achieve the events showing in a nice aligned row with the height of the highest event?

Thanks so much!

[Josh]

Hey Joseph,

Thanks for following up with us!

You can accomplish this by creating a standard height for all the photo blocks within that view. You can start by following the Themer’s Guide to copy the single-event.php template for the photo view (PRO src > views > pro > photo >single-event.php). The first step would be to replace the “tribe_event_featured_image” size value with a new image size that has absolute width and height settings. This will ensure that your images will be the same size.

The next step would be to use CSS to set an exact height on the content for the events using “.tribe-events-event-details”. This should force all of the photos and content to be the same height. This would prevent the javascript from taking action to move items around based on the height and would allow you to have the layout the way you’re wanting.

Let me know if this helps.

Thanks!

[josephmak]

Hi Josh,

Perfect! This worked exactly as you said it would I ended up using the event wrapper .tribe-events-photo-event-wrapper instead of the details div you suggested. All I had to be mindful of was how high the highest description was. I ended up using a height of 500px and adjusting some of the excerpts so that they would fit into this defined height. If the combination of the title, price and excerpt was higher than the explicitly set height, it would break the styling for all events after the offending event. Just a bit of a finicky process, but I got it all working.

This solutions seems to have fixed the other issue of events not showing up in the right order as well! Now the only thing I need to figure out is why some events guid (permalink) is set to the site url as opposed to the event link.

Thanks again for all your help, you guys are great!

[Josh]

Hey Joseph,

Awesome! I’m glad you were able to get this all set up the way you would like.

I’ll go ahead and close this thread for now. Go ahead and open another thread for the guid issue and we’d be happy to help you out there.

Thanks!

[Author]

Posts