Teilen Button im Trade Theme

[r2d2c3po]

Hallo,

ich nutze das Trade Theme und suche ein Möglichkeit, dass man über den Webbrowser und auch über die mobile Darstellung ein Produkt teilen kann. Ausreichend wäre, wenn nur der Produktlink kopiert wird.

Hier im Forum habe ich leider nichts gefunden.

Hat da jemand eine einfache Lösung?

Gruß Herry

[Ben310]

Du kannst gerne einen Share-Code in deine PDP einbauen, wie:

<button id="share-button" onclick="copyProductLink()">Teilen</button>
<p id="share-confirmation" style="display: none;">Link kopiert!</p>

Beispiel eines JS Code:

function copyProductLink() {
    const productUrl = window.location.href; // Holt die URL
    navigator.clipboard.writeText(productUrl) // Kopiert die URL
        .then(() => {
            const confirmation = document.getElementById('share-confirmation');
            confirmation.style.display = 'block'; // Zeigt die Bestätigung an
            setTimeout(() => { 
                confirmation.style.display = 'none'; // Versteckt die Bestätigung nach 2 Sekunden
            }, 2000);
        })
        .catch(err => {
            alert('Link konnte nicht kopiert werden. Bitte manuell kopieren.');
        });
}

Oder eben eine App wie diese hier. Aber auch auf die Shariff Lösung achten.

[r2d2c3po]

---

@Ben310  schrieb:

Du kannst gerne einen Share-Code in deine PDP einbauen, wie:

<button id="share-button" onclick="copyProductLink()">Teilen</button>
<p id="share-confirmation" style="display: none;">Link kopiert!</p>

Beispiel eines JS Code:

function copyProductLink() {
    const productUrl = window.location.href; // Holt die URL
    navigator.clipboard.writeText(productUrl) // Kopiert die URL
        .then(() => {
            const confirmation = document.getElementById('share-confirmation');
            confirmation.style.display = 'block'; // Zeigt die Bestätigung an
            setTimeout(() => { 
                confirmation.style.display = 'none'; // Versteckt die Bestätigung nach 2 Sekunden
            }, 2000);
        })
        .catch(err => {
            alert('Link konnte nicht kopiert werden. Bitte manuell kopieren.');
        });
}

Oder eben eine App wie diese hier. Aber auch auf die Shariff Lösung achten.

---

Danke. Im Code wollte ich nicht was anpassen. Welche App unter den 792 🙂 würdest Du einsetzen um auch SharIff zu berücksichtigen?

[Ben310]

Welche App? Kann ich nicht genau sagen, aber du kannst zwei dinge machen: 1) klicke durch die Demos der Apps (Demo-Shop einer der Apps hier ansehen die auch einen Free Plan anbietet) und 2) die Bewertungen durchlesen.

Ist auch besser den Code in Ruhe zu lassen, da ansonsten die Gefahr besteht, die Theme Updates zu verlieren und auch ggf. die Page Ladezeiten zu verschlechtern.