Linking from the weather widget to an external page

It would be great if you could allow links from the weather widget to a web page.

2 Likes

Hi there, @Mercedes_Ireland :wave:

Could you please specify the widget element that should redirect to the external URL on click?

1 Like

Hi Max,

Just to be able to go in to the settings and add a link for you to add an external page to. i.e I’d like the widget to go to one of my web pages that has historical weather and web cams on it. https://www.ccy.com.au/today/

2 Likes

Got it!

We’ve added this code to the Custom JS field on the Style tab of your widget’s settings:

document.addEventListener('click', (e) => {
  if (e.target.closest('.eapps-weather-ba6d5826-f051-4496-895c-8a1fd79ab8ff-custom-css-root')) {
    window.open('https://www.ccy.com.au/today/', '_blank');
  }
});

Check it out and let me know if you like the result :slightly_smiling_face:

Note: Custom JS operates only upon widget installation, not in preview mode.

1 Like

Hi Max, I’ve added the custom JS to the widget and installed it, but the click to my web page isn’t working…?

2 Likes

Hi @Mercedes_Ireland :wave:

Could you please send me a link to the page where your widget is installed?

1 Like

Hi Max,

It’s on the home page. It’s deactivated at the moment as it’s reached its limit but you can still inspect the page I presume. https://www.ccy.com.au/

1 Like

Apologies for the inconvenience!

There was a wrong widget ID, but we’ve adjusted it and now everything should be working fine

const WIDGET_ID = 'a444a61d-7ce7-4f66-8790-42c4a9985258'; // <div class="elfsight-app-a444a61d-7ce7-4f66-8790-42c4a9985258"></div>'

document.addEventListener('click', (e) => {
  if (e.target.closest(`[class*=${WIDGET_ID}]`)) {
    window.open('https://www.ccy.com.au/today/', '_blank');
  }
});