Main event page in photo view in iPAD

[Pau]

Dear TECPRO,

This page http://79.170.44.126/ref-spainculturescience.co.uk/events/ looks great on my desktop, but when viewed in iPad the 3 columns become 2 columns (both landscape and portrait mode) and creates big empty spaces in between the views now and then within each column (does not do the masonry effect), looking quite weird

see attached image

do you have any suggestions to fix this issue?

thanks in advance

[Geoff]

Hey Pau,

Shoot, I’m having trouble seeing the same thing on my iPad. Here’s a screenshot of what I’m seeing and all looks good.

Are you seeing the same thing, or were perhaps able to resolve the issue on your own? If not, let me know which iPad and iOS versions you are using and I can test on that instead.

Thanks!
Geoff

[Pau]

hi Geoff, thanks again!

we may be using old iPad versions (Im not a specialist). Surely my iPad is old!

🙂

so, we have here two possible situations: old iPads are not working well, or there’s a problem with the padding

would you suggest all is ok?

[Pau]

Still, it would be good to find a fix to please the client and iPaD users.

Can you confirm you actually tried on a real iPad? Because on my computer ‘tablet mode’ I see it right too, but not on the real iPad.

Thanks for the patience

• This reply was modified 7 years, 10 months ago by Pau.

[Geoff]

Hey Pau,

I did indeed try on a real iPad. However, if you are able to confirm which iPad model and iOS version you’re using, I can recreate that using a tool like Browserstack to test from there and see if I can spot any issues.

Thanks!
Geoff

[Pau]

Hi Geoff, you are very kind

My client has an iPad Air, and I have iPad 2 WI-FI 16GB White MC979B/A

would that help?
thanks again

🙂

[Geoff]

Awesome thanks! And what version of iOS is running on each of those?

[Pau]

me ios 8.4.1 (yes , i know!), client I dont know right now (will let you know ASAP)
x
p

[Geoff]

Hey Pau,

Thanks for your patience while I tested this out a little further!

I was able to see the issue in Browserstack when using an iPad 2 with iOS 8. I then switched to iPad 2 with iOS 9.3 (the latest) and still see the issue there as well.

The weird thing is that I am unable to see the issue when I switch to my test site using the same devices and iOS versions. That gives me a hunch that there is something in the styling of the theme that might be conflicting and causing those gaps to show up.

Would you be willing to switch to the default WordPress Twenty Sixteen theme and test again for me? I’d be curious to see whether the issue goes away in that scenario.

If it’s a theme styling issue, then I can try my best to help pinpoint where it is with you, though the theme author might be better suited to know where to look. And, if we ‘re still able to see the issue in Twenty Sixteen, then we know we have to keep looking at the plugin side of things.

Thanks!
Geoff

[Pau]

This reply is private.

[Geoff]

This reply is private.

[Pau]

Hi Geoff, ok (with a trembling hand( I did switched to Twenty Sixteen on the iPad, and the problem still there (sorry!)

So, I’m surprised this never happened before with a TECPRO user before.

Is there anything you think it can be done?

I really appreciate your help, thanks!

[Geoff]

Hey Pau,

Thanks a ton for hanging with me as we look into this together — it’s been a tough one!

I tested two more times on an iPad 2, one time using iOS 8 and the other time using iOS 9.3.

Here’s the result, which looks good when the site is using the default Twenty Sixteen theme:

One last thing I can think of here is to try heading to Events > Settings > Display and switching the Event Template option. I think you were already using the default event template (looking at your settings) but double check whether that is the template being used. If it already is, try switching to another template and see if that that makes any difference.

I do know that Photo View’s masonry layout will sometimes have gaps in there, just depending on the length of the event post excerpts — so while, the layout will always try to re-generate itself proportionally based on the width of the browser, there may be instances where some gaps come into play vertically, depending on how tall each event post is and how many events there are. I’m not sure if this is one of those cases, but I’m starting to have a hunch that it is.

So sorry I’ve been unable to replicate the same issue on my end! If you’d be willing to give it a try, I’d be happy to try setting up a fresh test site with you and testing from there. Let me know and we can go from there.

Thanks!
Geoff

[Geoff]

Oh, and one more thing! Will you please try updating to the latest versions of the plugins? We recently released version 4.2.3 for both The Events Calendar and Events Calendar PRO. Let’s see if updating makes any difference as well. 🙂

Geoff

[Pau]

Hi Geoff, many thanks for your perseverance

I was using ‘Full styles’, switched to Tribe Events Styles but no difference, tried Skeleton and events didn’t show at all in iPad (photo view)

Note I did edit some php files to show the title / date / venue / city

Note the photo view was doing this before I edited the php file

I have also added some custom CSS in my theme (but then, the gaps were there when tried Twenty Sixteen)

I have all my plugins and WP to the latest version

I agree with the excerpts text, but they are all quite similar

http://79.170.44.126/ref-spainculturescience.co.uk/events/

Then I realised my client may (and indeed they did) put BIG images not edited for the web, but I went and rezised all, still showing gaps…

Im very happy to assist, but you may have to explain me better this creating a new test site thing…

BTW: http://217.199.187.196/chatspalace.com/ this is another site we are building using TECPRO and does equally show gaps…

[Author]

Posts