Image Link

Ask the Community General Questions
1

Can we make the image link to another page instead of having to add a website link below?

2 Likes
3

Hi there, @Jamie_Ha :wave:

I am afraid I didn’t quite get what you mean. Could you please elaborate on your idea?

1 Like
4

Hi Max,

So when you click on the pin it opens up the window where you can upload an image. Can the image become a link where you can link to another page?

Also, when uploading a CSV, it removes my default pin and goes to just a red pin. Can we make it so it automatically uses my default pin?

Thank you,

2 Likes
5

  1. Just to clarify, do you want the image to be clickable, so it takes users to the right page when they click on it? Or would you like to show just the link instead of an image?

  2. Right now, it’s impossible to do this, but we’ll try to consider this idea within this request - Uploading through CSV keep existing settings

1 Like
6

Hi Max,

Yes, it would be great if the image can be clickable!

Thank you,

2 Likes
7

Got it, thanks!

And the last questions, would you like to use the same link for all images or each image should have its own link?

1 Like
8

Hi Max,

Happy New Year!

Each image should have it’s own link please.

I am adding multiple locations to the map with images of the location and want to link directly to each individual location page.

Thank you,

2 Likes
9

Thank you so much!

I’ve shared your request with the dev team. I’ll let you know if it’s feasible once I have their response :slightly_smiling_face:

10

Hi there, @Jamie_Ha :wave:

If you’re going to open links that you’ve added to the location description, we have a solution:

image
image746×593 32 KB


Just add this code to the Custom JS field on the Appearance tab of your widget’s settings and let me know how it worked:

const targetNode = document.body;
const widgetClassContainer =
	'elfsight-app-11aebde1-84bc-4599-afaa-565c46525444';

const observer = new MutationObserver((mutationsList) => {
	for (const mutation of mutationsList) {
		if (mutation.type === 'childList') {
			const appContainer = document.querySelector(`.${widgetClassContainer}`);
			if (appContainer) {
				const dialog = appContainer.querySelector('div[role="dialog"]');
				if (dialog) {
					const link = dialog.querySelector('a');
					const img = dialog.querySelector('img');

					if (link && img) {
						const href = link.getAttribute('href');

						if (href) {
							img.style.cursor = 'pointer';
							img.addEventListener('click', () => {
								window.open(href, '_blank');
							});

							// observer.disconnect();
							break;
						}
					}
				}
			}
		}
	}
});

const config = { childList: true, subtree: true };

observer.observe(targetNode, config);

In case you’d like to use another links, please send me the list of URLs and specify where you’d like to use each specific link :slightly_smiling_face:

1 Like