Now that the heavy lifting has been done, I am entering the testing and fine tuning of Pideja.ca/lucnadeau.
Thanks to Rod and everyone how contributed to this project.
I hope to launch on May 1st.
Just curious, but why horizontal navigation for the home page and vertical for the rest?
Well, in the original site it made sens because it was used as sort of a portal where one could select either the French or English version. It was two sites in parallel. lucnadeau.ca
So, upgrading to a single site, with the language switch, I naturally built upon the previous HOME page and added all the navigation in the same style as previously. pideja.ca/lucnadeau
But you are right: from a design standpoint, it’s strange to go from that page with horizontal navigation to the reste of the pages with the vertical. And yet, I feel that placing that pallet on the first page makes it “overdesigned” and busy.
I’m talking with Luc about getting rid of that page altogether…it’s a tough decision because he likes that page with his caribou logo.
“After further review” as they say, it has been decided that we will scrap the first page…
Should I delete that HOME page template? I already removed the link to it in the menu set.
If the page itself still exists, then a visitor may find it. But deleting the page template isn’t necessary
I would add following to your custom css to avoid the window size switching between pages that have a scroll bar and others that don’t:
.page__body {
min-height: calc( 100vh + 1px );
}
One more thing: I like keyboard navigation, specially on photo gallery pages. It is easy to add: Adding keyboard support to single image pages – lab.danielleu.com
Hello Daniel,
I added the CSS code and the php as well, but nothing works.
Hi Rod, I deleted the page, the template and the menu set link to that HOME page. I set the ABOUT page as the index page. All is well. Thanks.
It looks like the css is doing what it’s supposed to.
I’m not seeing Daniel’s script in the source code of a single image page. Double check that the page template you’re using for that album template is using the proper phplugins file.
I don’t see the css and script code on https://pideja.ca/lucnadeau/galleries/02bestiaire/Lundi,-on-mange-les-restants-single.php. Where did you add it?
The CSS line you suggested has been added to the CSS file currently in use on these pages. And, it does work!
As for the php code, I added it to the current php file in use throughout the pages.
Here is the transcript:
<?php
function single_bottom(){
// support for left/right arrow key and esc key navigation
$photo = $this->photo;
$album = $this->album;
echo' <script>
function checkKey(e) {
switch(e.which) {
case 37: ';
if ($album->getPreviousPhoto($photo)) {
echo 'location.href=$("li.single_image_prev a").attr("href");';
}
echo 'break;
case 39:';
if ($album->getNextPhoto($photo)) {
echo 'location.href=$("li.single_image_next a").attr("href");';
}
echo 'break;
case 27:';
echo 'location.href=$("li.single_image_back a").attr("href");';
echo 'break;
default: return;
}
e.preventDefault();
}
document.onkeydown = checkKey;
</script>';
}
function ttg_user_load( $style, $path ) {
$g_tsvrl = explode( ' ', $style ); // Extract gallery type
define ( 'G_STYLE', strtoupper($g_tsvrl[1]) ); // and set global for later
$g_path = str_ireplace('\\','/',$path); // change \ to /
$chunks = explode('/',$g_path); // and put into array
define ( 'G_PATH', strtoupper($chunks[count($chunks)-2]) ); // gallery folder name is second to last
//define ( 'TTG_SITE', ''); // set new site root for navigation, resources, etc.
}
// END
function ttg_head( $style, $path ) {
echo '
<link rel="stylesheet" href="http://pideja.ca/lucnadeau/backlight/custom/css/lucnad_2023.css" />
';
}
?>
it looks like you’re using the wrong phplugins file. You need to be using the one for pangolin (start with the phplugins-pangolin-sample.php file)
and you’ve placed the code too soon in the file. It needs to go in the user area with the other functions
You’re using several page templates throughout the site. Make sure you’ve activated the phplugins file in the correct one. Looks like it’s template 16 with an id name of luc-oeuvres
template-id-16 template-identifier-luc-oeuvres
This seems to work…
<?php
/*
* TTG Core Elements "PHPlugins" User Hooks v1.2 - initialization mainline
*
* developed by john bishop images (http://johnbishopimages.com)
* for Matthew Campagna of The Turning Gate (http://theturninggate.net)
*
*/
function user_load($style, $path) {
$g_tsvrl = explode(' ', $style);
// Extract gallery type
define ('G_STYLE', strtoupper($g_tsvrl[1]));
// and set global for later
$g_path = str_ireplace('\\','/',$path);
// change \ to /
$chunks = explode('/',$g_path);
// and put into array
define ('G_PATH', strtoupper($chunks[count($chunks)-2]));
// gallery folder name is second to last
//define ( 'TTG_SITE', ''); // set new site root for navigation, resources, etc.
}
if (defined('BACKLIGHT_HOOK')) {
require_once(realpath(BACKLIGHT_HOOK).'/modules/module-designer/application/helpers/APHPlugins.php');
}
class PHPlugins extends APHPlugins
{
// SET USER FUNCTIONS BELOW
// Some example functions are included below. Feel free to delete or modify unwanted functions.
// ****************************************************************************************************
function single_bottom(){
// support for left/right arrow key and esc key navigation
$photo = $this->photo;
$album = $this->album;
echo' <script>
function checkKey(e) {
switch(e.which) {
case 37: ';
if ($album->getPreviousPhoto($photo)) {
echo 'location.href=$("li.single_image_prev a").attr("href");';
}
echo 'break;
case 39:';
if ($album->getNextPhoto($photo)) {
echo 'location.href=$("li.single_image_next a").attr("href");';
}
echo 'break;
case 27:';
echo 'location.href=$("li.single_image_back a").attr("href");';
echo 'break;
default: return;
}
e.preventDefault();
}
document.onkeydown = checkKey;
</script>';
}
} ?>
Thank you again Rod and Daniel!
1 Like
Pierre, I was looking at the language selector and started to wonder… I didn’t like the empty entry for the current language. So I tinkered a bit with CSS:
Using the debugger this works, so you might want give it a try on your site.
html[lang="en"] #language-selector li:nth-child(2) {
display:none;
}
html[lang="fr"] #language-selector li:first-child {
display:none;
}
Thanks, Daniel, quite a nifty trick!