Community @ The Turning Gate

What if I had a single image the same width as the window, that scaled but stayed in landscape mode. Could it have 3 link hotspots in it?
Is that doable?

I understand that's working properly, but I don't like it:

In Portrait view, the text and images are just too big. I would prefer if they scaled down so that they maintain the row and not change into columns.
Yes, the code is designed to do that, so I need to replace it so that a row is always there.

Edit:
In portrait mode, the drawback of this would indeed be, too small to read on some screens.
It would force/persuade them to turn the phone sideways, which is really the best orientation to view the photos.

These are just 'fluff' items anyway, since the menus will have these links.

Just setting it up...

I had a backup, so it's back to normal and added the 25% style

FWIW, Google analytics doesn't show IP's for privacy reasons, but Statcounter does.

For us, this is the most useful info, as it gives us an idea of who is looking, and how often, fairly easily.

If someone is on a private gallery, then we know that, that IP belongs to a certain person.
When a potential customer contacts us, we can tag their IP with their name and then we can see if they do repeat visits.

In the long run, is there any benefit to us? Maybe not, but it's fun to see who's looking at what!

I am starting the day making a full backup locally... should have done that a couple of days ago...
Then I am going to copy the 'file set' back into an online test dir. and work with that  so I don't screw up the original

My final code for the home page turned out perfect for the pc, but when viewed on a mobile, it just doesn't scale very well and so I will have to find a better way of doing it.
http://www.marlajenkinsphotography.com/
In portrait orientation especially,  those heart images distract from the main slideshow.

yeah yeah...

So to clarify, this is bad:

function ttg_scripts( $style, $path ) {   
echo'

<script type="text/javascript">
var sc_project=7247521;
var sc_invisible=1;
var sc_security="8a4441b8";
var scJsHost = (("https:" == document.location.protocol) ?
"https://secure." : "http://www.");
document.write("<sc"+"ript type='text/javascript' src='" +
scJsHost+
"statcounter.com/counter/counter.js'></"+"script>");
</script>
<noscript><div class="statcounter"><a title="hit counter"
href="http://statcounter.com/" target="_blank"><img
class="statcounter"
src="//c.statcounter.com/7247521/0/8a4441b8/1/" alt="hit
counter"></a></div></noscript>
';
    }    //END

and this is good:

<?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 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.
    }

/*
*   
*    *************************************************************************************
*    *                                                                                   *
*    * Warning! When using echo or print special care must be qiven to using quotes.     *
*    *                                                                                   *
*    * Strings inside single quotes must contain only double quotes                      *
*    * or all single quotes must be escaped (ie \') or vice-versa                        *
*    *                                                                                   *
*    *************************************************************************************
*   
*    Fourteen user exits are defined in all web engines - all are optional
*        (i.e. ttg_user_load.php may be the only processing)
*       
*    Some web engines will have additional exits defined, specific to that gallery type
*       
*    Each is called with the same parameters:
*        %1    -    TTG gallery-style gallery-release
*                3 blank delimited values
*                - %1.1    -    'TTG'
*                - %1.2    -    string describing gallery type; no embedded blanks
*                - %1.3    -    a series of two to three period delimited integers
*                            describing gallery release level; x.y or x.y.z
*        %2    -    server filesystem file name and path of calling file
*       
*
*    Defined exits:
*
*        ttg_user_load           
*      - return value ignored
*      - called immediately after this file returns
*      - called before any output is produced
*      - all header and response variables are accessible
*      - cookie and session processing can be initialized
*      - globals to be used by later hook calls can be defined
*
*    ttg_head
*      - return value ignored
*      - called immediately before </head>
*      - encompasses nothing; use to insert content into the <head>
*
*    ttg_header_top
*      - if return=false, the contents of the normal Backlight header are skipped
*      - called immediately within the header section
*      - encompasses the full contents of the header section; can be used to replace those contents
*
*    ttg_header_bottom
*      - return value ignored
*      - called last in the header section
*      - encompasses nothing; use to insert content at the end of the header section
*
*    ttg_masthead_primary_top
*      - if return=false, normal Backlight masthead is skipped
*      - called immediately before the masthead element
*      - fully encompasses the masthead; can be used to replace it
*
*    ttg_masthead_primary_bottom
*      - return value ignored
*      - called immediately after the masthead
*      - encompasses nothing; use to insert content after the masthead
*
*    ttg_masthead_secondary_top
*      - if return=false, normal Backlight masthead is skipped
*      - called immediately before the masthead element
*      - fully encompasses the masthead; can be used to replace it
*
*    ttg_masthead_secondary_bottom
*      - return value ignored
*      - called immediately after the masthead
*      - encompasses nothing; use to insert content after the masthead
*
*    ttg_navigation
*      - if return=false, normal Backlight navigation is skipped
*      - navigation is separate from the header section, so not affected by the above ttg_header... hooks.
*      - encompasses the navigation <ul> element; can be used to replace it
*
*    ttg_main_top
*      - return value ignored
*      - called immediately within the main content column
*      - encompasses nothing; use to insert content at the very top of the main content column
*      - located outside the password protected area
*
*    ttg_main_bottom
*      - return value ignored
*      - called immediately before closing the main content column
*      - encompasses nothing; use to insert content at the very bottom of the main content column
*      - located outside the password protected area
*
*    ttg_footer_top
*      - if return=false, the contents of the normal Backlight footer are skipped
*      - called immediately within the footer section
*      - encompasses the full contents of the footer section; can be used to replace those contents
*
*    ttg_footer_bottom
*      - return value ignored
*      - called last in the footer section
*      - encompasses nothing; use to insert content at the end of the footer section
*
*    ttg_pallet_top_title
*      - if return=false, the encompassed code is skipped
*      - wraps the site title in the top pallet
*      - use to replace the site title
*
*    ttg_toggle_T1
*      - if return=false, the encompassed code is skipped
*      - wraps the label element for "page__toggle__T1"
*      - use to replace the toggle button with one of your own making
*
*    ttg_toggle_T2
*      - if return=false, the encompassed code is skipped
*      - wraps the label element for "page__toggle__T2"
*      - use to replace the toggle button with one of your own making
*
*    ttg_social_top
*      - if return=false, normal content is skipped
*      - called immediately before social media icons in the top pallet
*      - encompasses the social media icons; can be used to replace them
*
*    ttg_social_bottom
*      - return value ignored
*      - called immediately after social media icons in the top pallet
*      - encompasses nothing; use to insert content following the social media icons
*
*    ttg_scripts
*      - return value ignored
*      - called immediately before </body>
*      - encompasses nothing; use to insert content at the very bottom of the page
*
*    ttg_copy_top
*      - if return=false, normal copy is skipped
*      - called immediately within the page copy area
*      - encompasses the page copy; can be used to replace it
*
*    ttg_copy_bottom
*      - return value ignored
*      - called immediately before closing the page copy area
*      - encompasses nothing; use to insert content following the page copy
*
*    ttg_pallet01_top
*      - if return=false, pallet content is skipped
*      - called within pallet01, after masthead and navigation
*      - encompasses the pallet01 content area
*
*    ttg_pallet01_bottom
*      - return value ignored
*      - called after the pallet01 content
*      - encompasses nothing; use to insert content at the end of pallet01
*
*    ttg_pallet02_top
*      - if return=false, pallet content is skipped
*      - called within pallet02, after masthead and navigation
*      - encompasses the pallet02 content area
*
*    ttg_pallet02_bottom
*      - return value ignored
*      - called after the pallet02 content
*      - encompasses nothing; use to insert content at the end of pallet02
*
*    ttg_albumset_top
*      - if return=false, normal copy is skipped
*      - called immediately within the media area
*      - encompasses the gallery grid / slideshow; can be used to replace it
*
*    ttg_albumset_bottom
*      - return value ignored
*      - called immediately before closing the media area
*      - encompasses nothing; use to insert content following the gallery grid / slideshow
*
*    ttg_album_top
*      - if return=false, the album content is skipped
*      - called immediately within the media area
*      - encompasses the album grid / slideshow; can be used to replace it
*
*    ttg_album_bottom
*      - return value ignored
*      - called immediately before closing the media area
*      - encompasses nothing; use to insert content following the album grid / slideshow
*
*    ttg_single_top
*      - if return=false, single image and content are skipped
*      - called immediately above the single image display
*      - encompasses the single image and related metadata; can be used to replace it
*      - available only on single-image HTML pages for applicable album templates
*
*    ttg_single_bottom
*      - return value ignored
*      - called after the single image display
*      - encompasses nothing; use to insert content following the single image display
*      - available only on single-image HTML pages for applicable album templates
*
*/

// SET USER FUNCTIONS BELOW
// Some example functions are included below. Feel free to delete or modify unwanted functions.
// ****************************************************************************************************

function ttg_scripts( $style, $path ) {   
echo'

<script type="text/javascript">
var sc_project=7247521;
var sc_invisible=1;
var sc_security="8a4441b8";
var scJsHost = (("https:" == document.location.protocol) ?
"https://secure." : "http://www.");
document.write("<sc"+"ript type='text/javascript' src='" +
scJsHost+
"statcounter.com/counter/counter.js'></"+"script>");
</script>
<noscript><div class="statcounter"><a title="hit counter"
href="http://statcounter.com/" target="_blank"><img
class="statcounter"
src="//c.statcounter.com/7247521/0/8a4441b8/1/" alt="hit
counter"></a></div></noscript>
';
    }    //END

/* DELETE THIS LINE
function _HOOK_( $style, $path ) {
    echo '

    ';
    return false;
} // END /**/

/* DELETE THIS LINE
function ttg_main_top( $style, $path ) {
    echo '<ul style="background-color:#FFF9C4;color:#000;margin:1.5rem 0;padding:24px 36px;">';
        if (PASSWORD_ENABLED) {
            echo '<li><strong>This gallery is private</strong>.</li>';
            if (LOGGED_IN) {
                echo '<li><small>The user is logged in</small>.</li>';
            } else {
                echo '<li><small>The user is logged out</small>.</li>';
            }
        } else {
            echo '<li><strong>This gallery is public</strong>.</li>';
        }
    echo '</ul>';
    return false;
} // END /**/

/* DELETE THIS LINE
function ttg_toggle_T1( $style, $path ) {
    // Below, the bare minimum markup required for functioning toggles;
    // fill in the LI element as you wish. Custom CSS may be necessary.
    echo '

    <label for="page__toggle__T1">
        <ul><li></li></ul>
    </label>

    ';
    return false;
} // END /**/

/* DELETE THIS LINE
function ttg_pallet_top_title( $style, $path ) {
    // Below, the default markup for the title. The LI wrapping element is mandatory;
    // replace the inner HTML as you see fit. Retain the "masthead_pallet_top" class and styling,
    // or assign a new class, with styling defined in custom CSS.
    // Take note, the top pallet height is a 48px fixed value.
    echo '

    <li class="masthead_pallet_top">
        <h1><a href="/">Your Site Title</a></h1>
    </li>

    ';
    return false;
} // END /**/

/* DELETE THIS LINE
function ttg_navigation( $style, $path ) {
    echo '
    <ul class="primary-menu menu mouseable">
        <li class="menu-item"><a href="/">Home</a></li>
        <li class="menu-item menu-item-has-children"><a href="/galleries">Galleries</a>
            <ul class="sub-menu">
                <li class="menu-item"><a href="">Sub-item 1</a></li>
                <li class="menu-item"><a href="">Sub-item 2</a></li>
                <li class="menu-item"><a href="">Sub-item 3</a></li>
                <li class="menu-item"><a href="">Sub-item 4</a></li>
                <li class="menu-item"><a href="">Sub-item 5</a></li>
                <li class="menu-item"><a href="">Sub-item 6</a></li>
                <li class="menu-item"><a href="">Sub-item 7</a></li>
                <li class="menu-item"><a href="">Sub-item 8</a></li>
            </ul>
        </li>
        <li class="menu-item"><a href="/blog">Blog</a></li>
        <li class="menu-item"><a href="/about">About</a></li>
        <li class="menu-item"><a href="/contact">Contact</a></li>
    </ul>
    ';
    return false;
} // END /**/

/* DELETE THIS LINE
// Adding new social media icons before ...
function ttg_social_top( $style, $path ) {
    echo '

    <li><a target="_blank" href="" class="social_media fa fa-google-plus"></a></li>

    ';
    return true;
} // END

// ... and after.
function ttg_social_bottom( $style, $path ) {
    echo '

    <li><a target="_blank" href="" class="social_media fa fa-pinterest"></a></li>
    <li><a target="_blank" href="" class="social_media fa fa-instagram"></a></li>

    ';
} // END /**/

/* DELETE THIS LINE
// Highlight menu item for current page
function ttg_scripts( $style, $path ) {
echo <<<SCRIPT
    <script>
    $("ul.menu a[href='" + window.location.pathname + "']")
        .parentsUntil('.menu', 'li')
        .addClass("current_page_item")
        ;
    </script>
SCRIPT;
    return false;
} // END /**/

// ****************************************************************************************************
// END USER FUNCTIONS

?>

Yes the script was updated, so I edited the phpfile and now all albums use the 'tracking' template.
FYI, this is the new file content:

function ttg_scripts( $style, $path ) {   
echo'

function ttg_scripts( $style, $path ) {   
echo'

<script type="text/javascript">
var sc_project=7247521;
var sc_invisible=1;
var sc_security="8a4441b8";
var scJsHost = (("https:" == document.location.protocol) ?
"https://secure." : "http://www.");
document.write("<sc"+"ript type='text/javascript' src='" +
scJsHost+
"statcounter.com/counter/counter.js'></"+"script>");
</script>
<noscript><div class="statcounter"><a title="hit counter"
href="http://statcounter.com/" target="_blank"><img
class="statcounter"
src="//c.statcounter.com/7247521/0/8a4441b8/1/" alt="hit
counter"></a></div></noscript>
';
    }    //END

Thanks again.

I just assigned one of the private galleries to the new template, so that's the only page that's affected

Just on the road right now. The code is on regular pages and works fine. Today I decided to look in to adding it via hooks to albums. I followed the info on using with albums as above. Will investigate later...