Support community for TTG plugins and products.
NOTICE
The Turning Gate's Community has moved to a new home, at https://discourse.theturninggate.net.
This forum is now closed, and exists here as a read-only archive.
You are not logged in.
Pages: 1
Hello all,
I found out that it is possible to manage different layouts for desktop (galleria slideshow) and mobile (fullscreen flip) by editing the first lines in the index.php and mobile php and using 2 different stage-templates.
All works fine (exept oft the integrated masthead identityplate-HOME-link - hope for CE4 Pages update v7.0.13 coming soon) if I open the mobile.php -> http://www.oliver-blum.com/mobile.php on my mobile.
If I now enter the website and click the HOME button in the menu I will be directed to http://www.oliver-blum.com/ which presents the Pages galleria slideshow.
How and where can I change the HOME button link to be directed to the mobile.php - but only on mobile or tablet???
Thanks in advance
best regards,
Oliver
Offline
You're already using PHPlugins on your menu, so add a class to your Home link:
<a class="home-link" href="/">HOME</a>Then use Javascript to update that link based on the same conditions we use elsewhere in CE4 to determine whether we're on mobile.
function ttg_canvas_bottom( $style, $path ) {
echo '<script>
if (screen.width < 768 || navigator.userAgent.match(/Android|Blackberry|SymbianOS|iPhone|iPod|iPad/i)){
$('a.home-link').on('click', function(){
return false;
window.location.replace('http://www.oliver-blum.com/mobile.php');
});
}
</script>';
}You may need to work on that a little; it's off the top of my head, and untested.
Offline
Thank you Matt, for your quick response.
I did the folowing:
<!-- EDIT ONLY BELOW THIS LINE : -->
<li><a class="home-link" href="/">HOME</a></li>
<li><a href="/portfolio/">PORTFOLIO</a>
<ul>
.......
and inserted your function ttg_canvas_bottom script as is in the phplugins.php.
results in a blank page :-/
What could I do???
Thanks again.
Best regards,
Oliver
Offline
you need to be managing your navigation with phplugins. Add the class to the home page link in the navigation section of the phplugins.php file
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Hello Rod,
thank you very much trying to help me with this problem.
I already added the class "home-link" to // SITE-WIDE "DROP-DOWN" NAVIGATION MENU
but I dont know where to exactly inserting Matts javascript:
function ttg_canvas_bottom( $style, $path ) {
echo '<script>
if (screen.width < 768 || navigator.userAgent.match(/Android|Blackberry|SymbianOS|iPhone|iPod|iPad/i)){
$('a.home-link').on('click', function(){
return false;
window.location.replace('http://www.oliver-blum.com/mobile.php');
});
}
</script>';
}
:-/
Offline
that code can go anywhere in the phplugins file (in the user code area). Just don't put it inside any other phplugins code you have going.
I think all the single quotes inside the echo statement will need to be changed to double quotes though
function ttg_canvas_bottom( $style, $path ) {
echo '<script>
if (screen.width < 768 || navigator.userAgent.match(/Android|Blackberry|SymbianOS|iPhone|iPod|iPad/i)){
$("a.home-link").on("click", function(){
return false;
window.location.replace("http://www.oliver-blum.com/mobile.php");
});
}
</script>';
}Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Thank you Rod!
That makes the site working but without the effect of being directed to mobile.php by clicking the HOME button in the menu on my smartphone - it's still linking to oliver-blum.com :-/
do you have any idea???
Thank you very much...
best regards,
Oliver
Offline
hmmm. maybe try changing this:
$("a.home-link").on("click", function(){to this:
$("a.home-link").on("tap", function(){this is just a guess based on looking at jQuery mobile touch events
http://www.w3schools.com/jquerymobile/j … _touch.asp
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Sorry. I warned you the code was untested and off the top of my head. The apostrophe's in the Javascript were killing the PHP, as the echo statement was also using apostrophes. This should be fine:
function ttg_canvas_bottom( $style, $path ) {
echo '<script>
if (screen.width < 768 || navigator.userAgent.match(/Android|Blackberry|SymbianOS|iPhone|iPod|iPad/i)){
$("a.home-link").on("click", function(){
return false;
window.location.replace("http://www.oliver-blum.com/mobile.php");
});
}
</script>';
}Offline
Thank you Rod and Matt!
the hint with the tap instead click works but it is not directing to the mobile.php :-/
any suggestions?
Best regards,
Oliver
Offline
try changing the url maybe?
If I copy one of the urls from your site and then paste it somewhere, it doesn't start with "www"
so try using "http://olliver-blum.com/mobile.php" in the code instead.
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Rod,
I tried changing the url in the script. For me it looks that the script has no effect :-/
Offline
well, Matt did say it might take some tweaking.
Just did a Google search on the screen width query. Maybe try this:
if ($(window).width() < 768 ||.....)Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Ok, I am confused now.
Reset:
I like to have the Home page the Galleria slideshow on desktop and the Fullscreen Flip on mobile/tablet.
I selected it in the Appearance pane, under "the Gallery".
Is it possible to "Allow Page Replacement by CE4 Publisher" for this configuration?
If NO what do I have to do to get it to work?
Best regards,
Oliver
Offline
when I go to your site on my iPhone and click on the Home link from, say, your portfolio page, I'm taken to the mobile.php page with the full-page flip gallery.
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
oh, ok. I see you switched it back to Pages control rather than Publisher control.
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Ok, I am confused now.
Reset:
I like to have the Home page the Galleria slideshow on desktop and the Fullscreen Flip on mobile/tablet.
I selected it in the Appearance pane, under "the Gallery".Is it possible to "Allow Page Replacement by CE4 Publisher" for this configuration?
If NO what do I have to do to get it to work?Best regards,
Oliver
Again, talking without testing ... the full-screen presentation is fairly self-contained. So setup CE4 Pages for publisher replacement. Then create your CE4 Stage gallery twice, once with Galleria and once with Full-screen. Use template_index.php from one, and template_mobile.php from the other. Edit the template_index.php as above so that it redirects to mobile.php.
May require some adjustment, but something like this should be possible with enough finagling.
Offline
Ok, I think I got it by using the mobile redirect script:
<script>
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
window.location.href="http://oliver-blum.com/mobile.php";
}
</script>
inserting in the scripts area of both template_index.php's at the bottom of the sites.
It would be nice if you please could confirm if this solution is working on your devices :-)
-> http://oliver-blum.com
Thanks again Matt and Rod for your help!
best regards,
Oliver
Offline
Works for me.
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Pages: 1