Share icon

Issues related to hyperlinks and web site navigation.
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/links.html
Post Reply
Joan Ferrer
 
 
Posts: 112
Joined: Sat Apr 25, 2020 5:17 pm
Contact:

Share icon

Post by Joan Ferrer »

Hello everyone
How can I create a "universal" share icon, that on a mobile you can choose from the different sharing options that the mobile offers?

Tnk's
User avatar
Pablo
 
Posts: 22422
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Share icon

Post by Pablo »

Maybe this?
https://www.wysiwygwebbuilder.com/suppo ... ecity.html

Or else, can you be more specific?
Joan Ferrer
 
 
Posts: 112
Joined: Sat Apr 25, 2020 5:17 pm
Contact:

Re: Share icon

Post by Joan Ferrer »

Thanks for your attention.
On some websites, I have seen that they have a text, text with an image... and when you click from the smartphone, it is the smartphone that proposes several ways to share, WhatsApp, Telegram,...

On a computer, different options open.
An example is: https://bauharum.com/products/santjordineta

---> Compartir

Thank you
User avatar
Pablo
 
Posts: 22422
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Share icon

Post by Pablo »

I do not see any share links on this website.
But are you sure these are not standard links?

For example:
https://www.javatpoint.com/how-to-add-a ... javascript

This also works in WWB
Joan Ferrer
 
 
Posts: 112
Joined: Sat Apr 25, 2020 5:17 pm
Contact:

Re: Share icon

Post by Joan Ferrer »

User avatar
Pablo
 
Posts: 22422
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Share icon

Post by Pablo »

There is no standard option for this. This requires a custom script.
Joan Ferrer
 
 
Posts: 112
Joined: Sat Apr 25, 2020 5:17 pm
Contact:

Re: Share icon

Post by Joan Ferrer »

ok ... :(

Tnk's
User avatar
miguelss
 
 
Posts: 143
Joined: Thu Aug 15, 2013 12:25 pm
Location: Madrid, Spain

Re: Share icon

Post by miguelss »

Hi,

You can add a HTML with this code:

Code: Select all

<!DOCTYPE html>
<html>
<head>
  <title>Botón de Compartir</title>
</head>
<body>

<button id="shareButton">Compartir</button>

<script>
document.addEventListener('DOMContentLoaded', function() {
  const shareButton = document.getElementById('shareButton'); // Select existing button

  shareButton.addEventListener('click', async function() {
    try {
      await navigator.share({
        title: document.title,
        text: '¡Mira esta página!',
        url: window.location.href
      });
      console.log('Contenido compartido con éxito');
    } catch (error) {
      console.error('Error al compartir:', error);
    }
  });
});
</script>

</body>
</html>
Image

Enjoy 🤗
M.
Joan Ferrer
 
 
Posts: 112
Joined: Sat Apr 25, 2020 5:17 pm
Contact:

Re: Share icon

Post by Joan Ferrer »

Oh, fantastic, works perfectly!
Salu2
Post Reply