Recently I purchased the Iceland theme by Jochen Abitz, to use to create an online gallery of oil paintings for a local artist. Like the artist when she saw Iceland, I was captivated by the smooth ‘rising curtain’-like effect when scrolling down through images in the Iceland theme, a process of which is made possible through the use of the Sections Pro/Section Background (Legacy) stack from Big White Duck (BWD).
At this early stage of development, my task is to attach a unique link to an image of each painting in the gallery, which leads to a dedicated page that provides close-up photos and specifications relating to the image in the gallery. But for some baffling reason, the links I create fail to connect to the dedicated page. I strongly suspect the Sections Pro/Section Background (Legacy) stack is blocking the link:
Using RW 8.0.3, these are the stacks I am working with:
Foundation
Link (Joe Workman)
Sections Pro/Section Background (Legacy)
It’s worth noting that if I not use the Sections Pro/Section Background (Legacy) stack, but instead embed a (YourHead) Image stack within the Link stack as shown below, the link connects normally:
But with the Image stack, the image fails to fill the screen the way Sections Pro does, and it moves up the screen when scrolling down–thus defeating the purpose of using Iceland in the first place: to achieve the smooth ‘rising curtain’-like effect of scrolling images.
I’m open to ideas, such as using:
a different stack that achieves the rising-curtain effect while being linkable
a different linking stack to connect to another page
…?
I’d like to ask for suggestions how to overcome this problem.
Your image when added according to the picture using SP is a background, not a regular image as such, therefore it can’t be turned into a link in the regular way or most likely at all.
My solution for this is to place a SectionBox stack into a SectionPro stack and set the position mode of the SectionBox stack to “Floating (Caption Mode)”. This way the SectionBox stack has the same width and height of the SectionPro. You can now add a link in the SectionBox stack.
SectionsPro is a container stack (similar to a column) and its images are background images. This gives the ability for them to scale as you like but comes with some caveats. Background images are classified as “decorative” and as such do not have HTML markup, nor do they have alt tags, nor can they have a link attached directly as they are only CSS, they do not exist in the HTML markup of the page.
@jochenabitz’s solution of simply using a floating SectionsBox with its link enabled is one solution. @joeworkman’s link stack will also work just fine in most cases but I am unaware of the setup in that project template and there may well be some layering or positioning that is moving the section out of the link. In general the link stack is the easiest and quickest way to add a link.
I advise against using the Legacy (deprecated) version of Sections Pro which was retired in August 2016 and replaced with the all new version 2. The version 1 legacy product has not been updated since then and so has missed out the subsequent 23 updates and fixes.
@tav I will refresh all projects after the release of Stacks 4 and your new Core stacks. The latest versions of my projects were updated in very short intervals after you released SectionsPro 2 and 3…
P.S.: I am pretty sure the will be an Iceland v2.0 in near future…
