Button „Speichern“

Das Plugin für den Button „Speichern“ ist veraltet. Dieses Plugin bleibt bis zum 15. September 2022 einsatzfähig und zugänglich. Danach wird es eingestellt und ist nicht mehr einsatzfähig.

Über den Button „Speichern“ können Nutzer*innen Artikel oder Dienste in einer privaten Liste auf Facebook abspeichern, sie mit Freund*innen teilen und relevante Benachrichtigungen dazu erhalten. Eine Person kann beispielsweise ein Kleidungsstück, eine Reise oder einen Link speichern – was ihr eben gerade einfällt. Wenn sie sich dann später zum Kauf entscheidet, kann sie dies über die Liste tun. Oder vielleicht möchte sie Benachrichtigungen erhalten, wenn gerade eine Werbeaktion stattfindet.

Konfigurator für Button „Speichern“CodebeispielEinstellungen

Schritt für Schritt

1. Webseitenlink auswählen

Wähle den Link einer Webseite, die du mit dem Button „Speichern“ verwenden möchtest.

2. Code-Konfigurator

Füge diesen Link in den Code-Konfigurator ein und klicke auf den Button „Code generieren“, um den Code für deinen Button „Speichern“ zu erstellen.

3. HTML-Codeausschnitt kopieren und einfügen

Kopiere den Codeausschnitt und füge ihn in die HTML der Ziel-Website ein.

Konfigurator für Button „Speichern“

Link einer Webseite oder zu speicherndes Produkt
Größe des Buttons

Vollständiges Codebeispiel

Kopiere das Codebeispiel und füge es in deine Webseite ein. Passe den Wert data-uri an deinen Webseitenlink an. Verwende anschließend das <title>-Tag, um den Titel „Gespeichert“ anzupassen.

<html>
<head>
  <title>Your Website Title</title> 
</head>
<body>

  <!-- Load Facebook SDK for JavaScript -->
  <div id="fb-root"></div>
  <script>(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.6";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>

  <!-- Your save button code -->
  <div class="fb-save" 
    data-uri="http://www.your-domain.com/your-page.html">
  </div>

</body>
</html>
Probiere es aus!

Einstellungen

Neben den oben aufgeführten Einstellungen sind auch folgende Änderungen möglich:

Einstellung HTML5-Attribut Beschreibung Standard

uri

data-uri

Der absolute Link der Seite, die gespeichert wird.

Aktueller Link/aktuelle Adresse

lazy

data-lazy

true bedeutet, dass du den Lazy-Loading-Mechanismus des Browsers verwenden sollst, indem du das iframe-Attribut loading="lazy" festlegst. Dadurch rendert der Browser das Plugin nicht, wenn es sich nicht in der Nähe des Ansichtsfensters befindet und möglicherweise nie gesehen würde. Die Optionen lauten true und false (Standard).

false

Button „Speichern“ für Produkte

Du kannst den Button „Speichern“ auch für Produkte verwenden:

1. Einrichten eines Produktkatalogs

Um den Button „Speichern“ mit deinen Produkten verwenden zu können, musst du zunächst einen Produktkatalog einrichten.

Ein Produktkatalog, der manchmal als „Produkt-Feed“ bezeichnet wird, ist eine Liste mit Produkten, die du in Facebook bewerben möchtest. Jedes Produkt in der Liste weist spezifische Attribute auf, mit denen du eine Werbeanzeige, eine Produkt-ID, einen Namen, eine Beschreibung, eine Landing-Page-URL, eine Bild-URL, Verfügbarkeit usw. erstellen kannst.

So erstellst du einen ProduktkatalogDynamische Produktanzeigen in Facebook

2. Facebook-API-ID

Öffne den Einstellungs-Tab des App Dashboard, füge die Plattform „Webseite“ hinzu und gib die Domain der Webseite ein.

3. Laden des JavaScript-SDKs

Lade das JavaScript-SDK mit deiner App-ID wie in nachstehendem Beispiel gezeigt. Ersetze {your-app-id} durch deine App-ID.

<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.6&appId={your-app-id}";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

4. Abrufen der Produkt-URI

Über den Business Manager

Für den Button „Speichern“ für Produkte musst du zwei Informationen angeben: die Produktkatalog-ID und die Artikel-ID aus deinem Produkt-Feed:

  1. Melde dich im Business Manager an deinem Unternehmen an.
  2. Rufe „Unternehmenseinstellungen > Produktkatalog“ auf.
  3. Klicke auf den Produktkatalog, den du für das Plugin verwenden möchtest.
  4. Gib unter dem Titel des Produktkatalognamens die Produktkatalog-ID an. In unserem Beispiel ist das 768856339915012.
  5. Die andere Information ist die Artikel-ID, die in deinen Produkt-Feed hochgeladen wurde. Klicke zum Anzeigen von Beispielen aus deinem Produkt-Feed auf die Produktkatalog-ID.
  6. Klicke auf der nächsten Seite oben auf „Produkt-Feeds“.
  7. Klicke auf den Feed, der die Artikel enthält, die du verwenden möchtest.
  8. Auf der nächsten Seite siehst du eine Auswahl an Artikeln aus deinem Feed. Damit das Plugin dein Produkt identifiziert, muss die Artikel-ID für jedes Produkt in deinem Feed aufgeführt sein.
  9. Die URI für das Plugin hat die folgende Struktur: product://<catalog_id >/{retailer_id}. Wenn wir also im Beispiel oben eine URI für das Produkt mit dem Namen Product #45 erstellen möchten, sähe diese folgendermaßen aus: product://768856339915012/45 (wobei die Katalog-ID des Produkts aus Schritt 5 stammt).

Per Graph API

Du kannst die URI für dein Produkt per Graph API abrufen. Erstelle beim Laden einzelner oder mehrerer Produkte das folgende URL-Format, indem du <catalog_id> durch deine Katalog-ID und <retailer_id> durch die Händler-ID deines Produkts ersetzt:

product://<catalog_id>/<retailer_id>

Weitere Informationen erhältst du in den Produktdokumenten.

5. Produkt-URI

Verwende im Code für den Button „Speichern“ die Produkt-URI für data-uri. Für die Produkt-URI product://949817451770475/143791832 sähe dein Code beispielsweise so aus:

<div class="fb-save" 
  data-uri="product://949817451770475/143791832">
</div>

Ansicht „Gespeichert“

Alle gespeicherten Links werden der Ansicht Gespeichert hinzugefügt, die du unter www.facebook.com/saved oder für mobile Apps unter Mehr -> Gespeichert findest.

Beispiel

Gespeicherter Link

Ändern der Sprache

Du kannst die Sprache des Buttons „Speichern“ ändern, indem du eine lokalisierte Version des Facebook-JavaScript-SDK lädst. Ändere den Wert von js.src beim Laden des SDK, um deine Ländereinstellung zu verwenden. Ersetze en_US durch deine Ländereinstellung, z. B. fr_FR für Französisch (Frankreich):

js.src = "https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&amp;version=v2.6";

Die unterstützten Gebietsschemata findest du in der XML-Datei der Facebook-Gebietsschemata.

Möglicherweise musst du die Breite eines sozialen Plugins anpassen, um ausreichend Platz für andere Sprachen zu schaffen. Weitere Informationen dazu findest du auf unserer Seite Lokalisierung und Übersetzung.