Making "Map It" link pics non-clickable

brandofamilybrandofamily Registered Users Posts: 2,013 Major grins
in SmugMug Customization

Is it possible to make the "Map It" link pics non-clickable? I just want the pic to pop up when I click the point on the map but I do not want some one to be able to click the pick and make it larger/ open the pic in it's gallery.

Comments

  • rainforest1155rainforest1155 Registered Users Posts: 4,566 Major grins

    Could you include a link to a specific page on where you'd like to do that so we could take a look?

    Sebastian
    SmugMug Support Hero
  • brandofamilybrandofamily Registered Users Posts: 2,013 Major grins

    The other site is not live yet but I added the feature to my site so you could play w/ it.
    https://brandolinoimaging.com/Unlisted-Picture-Galleries/Other/Test-2-Map/

  • rainforest1155rainforest1155 Registered Users Posts: 4,566 Major grins

    Another Hero and I gave it a try, but couldn't get any CSS to apply to the map as it's third party embedded content.

    Sebastian
    SmugMug Support Hero
  • brandofamilybrandofamily Registered Users Posts: 2,013 Major grins

    Any luck getting it to do anything? Like redirecting to homepage instead of to gallery?
    Thanks for the effort.

  • AllenAllen Registered Users Posts: 10,013 Major grins

    You might be able to add a transparent gif over the map that would block links.

    Al - Just a volunteer here having fun
    My Website index | My Blog
  • brandofamilybrandofamily Registered Users Posts: 2,013 Major grins

    How would I accomplish that?

  • AllenAllen Registered Users Posts: 10,013 Major grins

    Remember few years ago you used to click on photos and only got the covering GIF file.

    Al - Just a volunteer here having fun
    My Website index | My Blog
  • pilotdavepilotdave Registered Users Posts: 785 Major grins
    edited March 18, 2020

    I believe I found a solution, but you'll have to try it out, make sure it works, and make sure it doesn't break anything else:

    .leaflet-popup-content > a {
    pointer-events: none;
    cursor: default;
    }

    I tested it and it seems to work, but I only spent about 5 minutes on this. I just had to get out of bed and try it out when I read the comment above that CSS can't be applied to maps, since I did quite a bit of customizing the maps on my site with CSS. 99% of the credit goes to: https://css-tricks.com/pointer-events-current-nav/. They say it doesn't work in every browser, but that was written 10 years ago.

    Edit: works fine on mobile too.

    Dave

  • brandofamilybrandofamily Registered Users Posts: 2,013 Major grins

    @pilotdave said:
    I believe I found a solution, but you'll have to try it out, make sure it works, and make sure it doesn't break anything else:

    .leaflet-popup-content > a {
    pointer-events: none;
    cursor: default;
    }

    I tested it and it seems to work, but I only spent about 5 minutes on this. I just had to get out of bed and try it out when I read the comment above that CSS can't be applied to maps, since I did quite a bit of customizing the maps on my site with CSS. 99% of the credit goes to: https://css-tricks.com/pointer-events-current-nav/. They say it doesn't work in every browser, but that was written 10 years ago.

    Edit: works fine on mobile too.

    Dave

    It seems to work, at least in FireFox!
    Thanks!

Sign In or Register to comment.