Scedule on Mobile – Stays as

Sorry for the delayed reply. I suggest checking to see if you have any software enabled for page speed optimization, like Autoptimize, and exclude the javascript from being optimized. It’s most likely a conflict in that respect. But I’ll have Tony Hayes take a look at your URL and see if he can ascertain what the issue is in mobile. However, I have seen when page speed optimization plugins interfere with JavasScript on mobile devices. Please report back with your findings. Also, deactivate your theme and check a standard WordPress theme, as well. It could be a conflict with the theme you’re using.

Hi Tony,

Thanks for coming back, I had to wait till Thursday to repeat the process (as Monday, Tuesday and Wednesday) show up normally.

So I went to https://demo.radiostation.pro/master-schedule/tabbed-view/
And if you either visit this on your phone or make your browser window smaller, you’ll see the problem is there too.

It doesn’t automatically hop to the right day with the tabs, the content below is correct. But a user visiting might get a bit confused without pressing the blue > arrorw to the day.

Is there anyway to fix this?

@rhmon The views have been designed from a fully responsive design perspective. That is they don’t adjust via media queries or on a per-device bases, but rather the widths of the tabs and the number to display etc. are calculated based on the screen width.

I can’t seem to reproduce the issue as you are describing, the day tab headings seem to be working as intended even on very narrow screens. I am testing in the responsive mode of Chrome developer tools however. So if there are specific mobile device(s) that you are testing with, let us know what they are and I’ll take another look with the correct dimensions or mobile browser emulator to see if there is something in need of tweaking.

Optionally you could record a video of what is happening for you (again though, we’d need to know screen width and browser at minimum to reproduce this.)

Thanks for coming back, I’ve attached a screenshot, I dropped the browser down smaller, similar to a mobile.

View post on imgur.com

So you’ll see it says Friday, but in the top tab, a user must press the right arrow until they get to that day.
My thought is they’ll get a bit confused that one if they don’t see the arrow & 2 that they might think it’s a Monday, Tuesday or Wednesday shows

My hope was, that it would snap to the tab so they could see from the top it’s Friday (in this example)

• This reply was modified 2 years, 7 months ago by rhmon.

@rhmon The “Viewing: Friday” text was added to reduce this kind of confusion.

To prevent this occurring you can probably just make the schedule display start on the current day by adding start_day="today" attribute to the master schedule shortcode.

I can look at tweaking the display to try to avoid this possible display mismatch. i’m not sure how Friday got selected if that tab wasn’t in view and clicked? Just to check in this case, the current day is Friday but you have Monday set as start of the week? If you give me some more specifics on your settings I’ll try to reproduce the behaviour.

Hi @majick Thank you for your reply,

That shortcode does then fix the issue as the user now gets that day first.

So Friday was selected due to the day I took the screenshot (so it was correct) Monday is my start of the week.

If you test it from Thursday – Sunday on a mobile device it will show you the page ” Viewing: Friday” which is correct, just the tab at the top it’ll be nice if it was navigated to the same day. instead of a user seeing the first 3 days of the week then pressing the right arrow to see other days.

So, it would look like – if it was Friday today, the tabs would show, Friday, Saturday and Sunday. or if it was Sunday, would be Sunday, Monday Tuesday shown to a user.

if it’s not possible I’ll take Start_Day tab as that kind of fixes it.

Thanks for your time

Closing this ticket.