Move Content to Right of Thumbnail in List View

[Dragan]

I would like to move the title and date that is on top of the thumbnail in list view to the right of the thumbnail.

Thank you,

[Cliff]

Hi Dragan. It sounds like you already have a customized List View. We do not typically provide such customizations, per our Scope of Support / Terms, but if you provide a link to your site’s List View, I may be able to provide a quick help.

[Dragan]

Hi Cliff,

I don’t have a customized list view but just wanted to move the title and date from above the thumbnail to the right with the excerpt. When viewing it on mobile as well the excerpt wraps underneath the thumbnail and I’m not a fan of that.

I’m working on my site but it’s not live. I can give you access to it.

[Cliff]

Yes, please do provide a link to it.

[Dragan]

This reply is private.

[Dragan]

Someone created a post on the forum about this and said they solved it but couldn’t see how they did it.

[Cliff]

I’m guessing something like this is the closest we can get using just CSS: https://cl.ly/2r322X2K271L

.tribe-events-loop .hentry > div,
.tribe-events-loop .hentry > h2{
float: right;
}
.tribe-events-loop .hentry > div.tribe-events-event-image {
float: left;
margin-top: -40px;
}

This probably doesn’t work well on mobile-sized screens, though.

I think it’d be best to reference our Themer’s Guide to make a customized List View with divs/columns/proper ordering of your desired output.

[Dragan]

This didn’t work on the desktop view either, everything is misaligned.
You can see in the image that I attached how it looks in list view with that CSS

[Cliff]

Yes, your screenshot looks like mine did.

As I said, this is likely the best (or close to it) for a CSS-only solution.

You should refer to our Themer’s Guide, as stated in my previous reply. If you need some coding help, you may want to ask your developer or reference our documentation and list of known customizers.

[Support Droid]

Hey there! This thread has been pretty quiet for the last three weeks, so we’re going to go ahead and close it to avoid confusion with other topics. If you’re still looking for help with this, please do open a new thread, reference this one and we’d be more than happy to continue the conversation over there.

Thanks so much!
The Events Calendar Support Team

[Author]

Posts