Get/Echo another Template depending ond Viewport/Device

[ForgottenCat]

Hi there,

I am new to processwire, but (after hating the new) i begun to love it after some hours of reding, missunderstanding leading to realizing the beauty and simplicity of the CMS.

For my Project, i want to implement a left-Tabbed Navigation for some Items, but the Navigation Items will be bigger than normal. For that reason, i cannot simply make the left-tabbed nav a top-tabbed nav on mobile devices. I came up with the Idea to make it a accordion-like listing of the Items, where you would be clicking one item, then below it, the content of that item expands and so on.

The HTML and CSS for that purpose is not the problem; the problem is: How can i define a "hook" to two different templates depending on the viewport of the current user?

I am thinking of something like 

if viewport>720px {include('./workshops_desktop.php')};
else {include('./workshops_mobile.php')};

Since i am new, i could have missed one or more posts in this amazing board, if so please forgive me but give me the link to the thread helping me. 

Also excuse my language since i am no native speaker.

Looking foreward for help in any way,

Fox [ForgottenCat]

PS: Because im new to PW, i use the newest version provided (did not have the time to let any version get old)

[Marty Walker]

Hi,

You could use something like http://mobiledetect.net/

[fbg13]

You can do that with css only.

Here is an example http://codepen.io/nik-savchenko/pen/vdksm

[ForgottenCat]

9 hours ago, Marty Walker said:

You could use something like http://mobiledetect.net/

Perfect! i will try this asap and share the result.

8 hours ago, fbg13 said:

You can do that with css only.

Here is an example http://codepen.io/nik-savchenko/pen/vdksm

Thank you for the advice, but sadly i need to create tabs without limitation to the number of tabs. Thats why horizontal Tabs are no option imhoo, plus the tabs size will be +- 1/4 or 1/5 of the site.... php is more a try and error thing for me than real understanding as css is. Since i work with  bootstrap, i wanted to keep it simple and let the responsive part up to bootstrap itself since i had bad experiences with putting someone elses or even my code inbetween -> php is the best option for me.

anyways: thank you both for the quick replys  (seems like the community is as awesome as PW itself )