Options

How to implement custom navigation so each gallery has a "next" and "previous" nav link?

jfriendjfriend Registered Users Posts: 8,097 Major grins
edited December 10, 2019 in SmugMug Customization

I'm trying to implement some custom navigation in each gallery page that let's the viewer go to the "next" gallery or the "previous" gallery without backing up the hierarchy to the parent folder and manually selecting the next gallery.

Here's some background.

I have a very large set of galleries that cover 15 years of family history. They are organized by year:

2004
.........Gallery A
.........Gallery B
.........Gallery C
2005
.........Gallery X
.........Gallery Y
.........Gallery Z

And, so on. There are ~500 galleries across 15 years. One thing some viewers would like to be able to do is to basically just browse sequentially through all the galleries. Open Gallery A, see what's there, go to Gallery B, see what's there, go to Gallery C, see what's there and go to Gallery X (which starts the next year) and so on...

Right now, the viewer has to go back up to the parent folder, find where they were last viewing and select the next gallery in order. It's fairly time consuming to just browse through the galleries this way.

So, I'd like the viewer to be able to just go directly to the "next" or "previous" gallery right from any gallery in this hierarchy via a couple links at the top of the gallery. I know that I could manually insert custom HTML at the top of every one of these galleries and manually construct a link to the next and previous galleries. But, with ~500 galleries, I do not relish the time consuming tasks of manually inserting the HTML into every page and continuing to do this as I add more galleries every year of goodness if I ever decided to reorganize my site and had to manually edit every one of them.

Is there any automated way to surface "next gallery" and "previous gallery" links?

If I was coding my own site, I could drop a master list of galleries into some Javascript (included by all galleries in this hierarchy) and use some custom Javascript to fill in the appropriate links into an HTML nav template in each page and I could write that in about 5 minutes. To add a new gallery to this site, I'd just drop it's relative link into the JS list and I'd be done. But, this isn't my own site and last I checked, custom Javascript was banned here (yes I'm still smarting from that change awhile ago as it gave me so much freedom to customize quickly and easily).

Any idea what my options are to implement this that does not involve manually creating next and prev links in every single gallery page?

--John
Homepage • Popular
JFriend's javascript customizations • Secrets for getting fast answers on Dgrin
 Always include a link to your site when posting a question
Tagged:

Comments

  • Options
    AllenAllen Registered Users Posts: 10,011 Major grins
    edited December 10, 2019

    Have next/previous in all my bird galleries all the way back to 2005.
    https://www.photosbyat.com/Birds/2019-Birding/Birding-2019-October/2019-10-19-Riverlands-Migratory-Bird-Sanctuary/

    I think the only way will be a manual add.

    Al - Just a volunteer here having fun
    My Website index | My Blog
  • Options
    jfriendjfriend Registered Users Posts: 8,097 Major grins

    @Allen said:
    Have next/previous in all my bird galleries all the way back to 2005.
    https://www.photosbyat.com/Birds/2019-Birding/Birding-2019-October/2019-10-19-Riverlands-Migratory-Bird-Sanctuary/

    I think the only way will be a manual add.

    Yep, that's what I'm looking to do. So, did you paste that custom HTML into the gallery description (are we still allowed to do that)? Or, insert an HTML block into the design of the page?

    Unfortunately, I don't think I can stomach the manual labor to do that individually for ~500 galleries. I'm overwhelmed with the task of just curating the content for all those galleries.

    If the Navigation/Menu widget just had an option for "Link to next Gallery in Folder" and "Link to previous Gallery in Folder" and it would make those links automatically, I'd be golden. But no such feature shows in the Menu options.

    --John
    Homepage • Popular
    JFriend's javascript customizations • Secrets for getting fast answers on Dgrin
     Always include a link to your site when posting a question
  • Options
    AllenAllen Registered Users Posts: 10,011 Major grins
    edited December 11, 2019

    Unfortunately I have to paste it in every new gallery description as I create them.
    That box spanned across the top is the gallery description.
    When I first came up with it I went back and did all the previous ones.

        <span style="font-size: 8pt; color:yellow">&lt; <a href="/Birds/2019-Birding/Birding-2019-September/
    2019-09-24-Riverlands-Migratory-Bird-Sanctuary">Previous</a> | gallery | <a href="/Birds/2019-Birding/
    Birding-2019-September/2019-09-29-St-Charles-County">Next</a> &gt;
    </span>
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • Options
    Hikin' MikeHikin' Mike Registered Users Posts: 5,450 Major grins
    edited December 11, 2019

    @Allen said:
    Unfortunately I have to paste it in every new gallery description as I create them.
    That box spanned across the top is the gallery description.
    When I first came up with it I went back and did all the previous ones.

    <span style="font-size: 8pt; color:yellow">&lt; <a href="/Birds/2019-Birding/Birding-2019-September/ 2019-09-24-Riverlands-Migratory-Bird-Sanctuary">Previous</a> | gallery | <a href="/Birds/2019-Birding/ Birding-2019-September/2019-09-29-St-Charles-County">Next</a> &gt; </span>

    The bad thing about using inline styles is that IF you decided to change colors or font sizes, your going to have to edit all of those descriptions. I would have added the CSS to your theme.

    - Mike
    Images in the Backcountry

    My SmugMug Customizations | Adding CSS to Your Site | SEO for the Photographer | Locate Your Page/Widget Number | SmugMug Help Desk
Sign In or Register to comment.