Transparent link anchor buttons

In Filemaker I can create navigation buttons that are not visible.
I put these buttons over layout objects. When you click on them they will run a script or take you to a different layout.

Could something like this be done on a site image stack?

I would like to be able to click on a particular part of a kitchen picture and be transported to an anchor link that lives somewhere else. For example, if you are interested in just the stove you could click on the stove and navigate to a discussion of stoves in general. If you were interested in a light fixture you would click on the lamp and go to a discussion of lighting options.

All of these transparent buttons would live on top of the same kitchen photo.

Can this be done?

Try either https://stacks4stacks.com/hotspotspro/ or https://www.weavers.space/stacks/points

There is a free Stealth Link stack from RWExtras (Will Woodgate).

There also used to be Extrusions stack from CosCulture, but I donā€™t think it is offered for sale anymore.

Functionality of these two is a bit different from those that Paul mentioned, but it can be adopted for your needs.

I just watched the HotSpotsPro video by Will Woodgate.
I am no longer impressed by being impressed by whatever he comes up with.
All of his work is just amazing!

I now have another question that was not answered in that video.

Is it possible to view a site image that is void of any hotspots until you put your curser onto the image?

I would like to see the picture of my kitchen in all itā€™s glory without any apparent hotspots but then have the hotspots show up on demand.

1 Like

Hi - Iā€™m 98Ā½ % sure you can do that. If you look at his demo site, scroll to the ā€˜bikeā€™ example. The hot spots are there as translucent yellow circles - I believe you can make them transparent. When you hover over the defined area, you can set up a tooltip that links to where you want to go.

One of the best things ever about Will (and there are many) is the fact that he offers a trial version of the stack to play with. I would give it a go! Iā€™m a bit of a newbie and used it recently - I was able to make sense out of it and everything worked out well. Itā€™s a complicated thing, but the latest version, couple with his tutorial video) made quick work of things for someone like me. Good luck!

1 Like

Hi @cabinetmaker, the reply from @bleener is correct.

Here is the bumblebee example from my website modified to become an invisible clickable area on the page.

https://send.firefox.com/download/d01a3b07669e2da8/#PrMPe0CTkaA4FHaTrzCSkQ

Clicking or tapping the bumblebee on the flower opens a link to Wikipedia. In theroy the link can be made to go anywhere.

The trick is to use the opacity sliders on the border colours, and set their opacity level down to 0%. You may also want to do like I did and disable title popovers too.

I think this should work for you. The above project file opens in RapidWeaver 8 and works with the free trial version and the normal version of the stack.

For irregular shapes, consider using the ImageMapper stack instead:

This stack also has the option to disable area borders / fills to make them completely invisible.

-Will.

2 Likes

Thank you guys for all the input!

I finally got a chance to downloaded Stacks4Stacks ImageMapper.
Learning to operate it was really intuitive and I was up & running in no time.

My test project was an overlay onto a Sketchup drawing of a kitchen we are selling.
I used the polygon tool to outline a few different cabinets. I filled in the area coordinates with a yellow fill pattern that linked to a URL that also contained an anchor from Foundry.

As the customer pans over the drawing they are presented with high-lited cabinets that take them to additional information about why I recommended that cabinet.

Rather than sending out drawings as email attachments I am now creating web pages for each kitchen design proposal, This way when a prospective customer asks their peers for input they arenā€™t merely swapping emails but are instead hooking up their friends with the entire design ecosystem. Each customer not only gets a more thorough presentation, I can amortize the cost of each presentation over more customers. ( If one of my customers has a question a hundred more have the same question.)

A really great addition would be the ability to include a tooltip type text popover that hovers adjacent to the polygon callout. Bleener mentioned something about this but I wasnā€™t able to find the ā€œbikeā€ example.

I have been really busy at the shop so was unable to get back to this thread till today.
Willā€™s bumblebee on the flower example really did expire. Would like to see that again if you have a chance to re-post.

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.