Tutorial: Tweets auf der Titelseite anzeigen

Sie können die Darstellung der Titelseite Ihres Developer Portal anpassen, um aktuelle Tweets anzuzeigen. Sie können die Tweets verwenden, um Ihren Benutzern Informationen zu geben, wie z. B. zur Serviceverfügbarkeit oder zu Marketingkampagnen.

Vorbereitende Schritte

Sie müssen ein Developer Portal aktiviert haben und über Administratorzugriff verfügen, um dieses Lernprogramm ausführen zu können. Im Lernprogramm Portal erstellen wird erläutert, wie Sie das Portal aktivieren, falls Sie dies noch nicht getan haben.

Info zu diesem Tutorial

In dieser Task erstellen Sie eine Ansicht, passen diese Ansicht an, um Tweets anzuzeigen, und betten diese Ansicht anschließend auf der Titelseite Ihrer Developer Portal -Site ein.

Bevor Sie beginnen, sieht die Titelseite wie folgt aus: Bild der Titelseite

Dieses Tutorial führt Sie durch die folgenden Schritte:
  1. Aktivieren Sie das Modul Medienentität Twitter.
  2. Erstellen Sie eine Entität namens Twitter zum Speichern der Tweets.
  3. Medienelemente hinzufügen.
  4. Rundmagazinansicht erstellen.
  5. Passen Sie die Rundmagazinansicht an.
  6. Integrieren Sie die Rundmagazinansicht auf der Titelseite Ihres Developer Portal.

Aktivieren des Moduls Media entity twitter

  1. Melden Sie sich bei Developer Portal als Administrator an.
  2. Klicken Sie auf Erweitern > Erweitern und geben Sie " media in das Feld Filter ein.
  3. Suchen Sie im Abschnitt Medien die Medieneinheit Twitter und klicken Sie auf Aktivieren, um das Modul " Media entity twitter zu aktivieren.

    Seite zur Aktivierung des Twitter-Moduls der Medieneinheit

Erstellen einer Entität mit dem Namen Twitter zum Speichern der Tweets

  1. Navigieren Sie zu Struktur > Medientypen.
  2. Klicken Sie auf +Medientyp hinzufügen.
  3. Geben Sie im Feld Name Twitterein.
  4. Wählen Sie aus der Liste Medienquelle Twitter.

    Medienquelle von Twitter

  5. Vergewissern Sie sich im Abschnitt " Konfiguration der Medienquelle ", dass der Wert " Whether to use Twitter api to fetch tweets or not auf "Nein" gesetzt ist.
  6. Stellen Sie unter dem Abschnitt Feldzuordnung sicher, dass die Abschnitte Tweet ID und Twitter user information auf - Feld überspringen - eingestellt sind.

    Seite, um die Twitter-Ansicht hinzuzufügen

  7. Klicken Sie auf Speichern.
  8. Wählen Sie Anzeige verwalten aus der Liste neben Bearbeiten für den neuen Twitter Medientyp.
  9. Wählen Sie aus der Liste Format von Tweet URL die Option Twitter einbetten.
  10. Stellen Sie sicher, dass die Felder Authored on, Authored by und Thumbnail im Abschnitt Disabled enthalten sind.

    Screenshot der Anzeigeoptionen

  11. Klicken Sie auf Speichern.

Hinzufügen von Medienelementen

  1. Klicken Sie auf Medien > +Medien hinzufügen > Twitter.
  2. Geben Sie im Feld Name einen Namen für den Datenträger ein, z. B. Drupal Tweet.
  3. Geben Sie in das Feld Tweet URL eine URL ein, zum Beispiel https://twitter.com/drupal/status/966443708160839684.

    seite zum Hinzufügen von Twitter URL

  4. Klicken Sie auf Speichern.
  5. Wiederholen Sie diese Schritte, um weitere Tweets hinzuzufügen. Sie benötigen mindestens 2 Tweets, um eine Rundmagazinansicht zu erstellen.

Erstellen einer Rundmagazinansicht

  1. Navigieren Sie zu Struktur > Ansichten.
  2. Klicken Sie auf +Ansicht hinzufügen.
  3. Geben Sie in das Feld Ansichtsname einen Namen für Ihre Ansicht ein, zum Beispiel Ansicht Tweet.
  4. Wählen Sie unter Anzeigeeinstellungen die folgenden Optionen:
    • show: Medien
    • of type: Twitter
    • sorted by: Unsortiert
  5. Aktivieren Sie im Abschnitt Blockeinstellungen das Kontrollkästchen Block erstellen.
  6. Stellen Sie sicher, dass das Anzeigeformat als Klickkarussell von Feldern ausgewählt ist.

    Karussellseite erstellen

  7. Klicken Sie auf Speichern und bearbeiten.

Anpassen der Rundmagazinansicht

Sie befinden sich jetzt auf der Seite, auf der Sie Ihre Ansicht bearbeiten können.

  1. Wenn Sie sich nicht auf der Seite Ansicht bearbeiten befinden, navigieren Sie zu Struktur > Ansichten, suchen Sie den Namen der von Ihnen erstellten Ansicht und klicken Sie auf Bearbeiten.
  2. Klicken Sie im Abschnitt Titel auf Tweet-Ansicht und geben Sie <none> in das Feld Title ein, und klicken Sie auf Anwenden.

    Seite, um den Namen der Ansicht zu ändern

  3. Klicken Sie im Abschnitt Felder auf Hinzufügen und suchen Sie dann nach Tweet.
  4. Aktivieren Sie das Kontrollkästchen für Tweet URL und klicken Sie auf Hinzufügen und Felder konfigurieren.

    Seite Felder hinzufügen

  5. Wählen Sie unter Formatter die Option Twitter embed und klicken Sie auf Apply.

    Seite zum Hinzufügen von Twitter Embed Formatter

  6. Klicken Sie im Abschnitt Felder auf Medien: Name, und klicken Sie auf Entfernen.

    Seite zum Entfernen des Mediennamens

  7. Klicken Sie im Abschnitt Filterkriterien auf Medien: Veröffentlicht (= Wahr), und klicken Sie auf Entfernen.

    Seite zum Entfernen veröffentlichter Medien

  8. Klicken Sie im Abschnitt Format auf Einstellungen neben Klickkarussell.
  9. Wählen Sie aus der Liste Skin Main Default.
  10. Wählen Sie im Abschnitt Beschriftungsfelder die Option Medien: Tweet URL und die Kontrollkästchen Hauptoptionen außer Kraft setzen.
  11. Aktivieren Sie im Abschnitt Überblendbare Optionen die Kontrollkästchen Autoplay und Punkte, und klicken Sie auf Anwenden.

    Seite zum Konfigurieren von Skinänderungen

  12. Klicken Sie im Abschnitt Pager aufElemente, setzen Sie das Feld Anzuzeigende Elemente auf 0 und klicken Sie dann auf Anwenden.

    Pager-Optionen-Seite

  13. Klicken Sie auf Speichern.

Betten Sie die Ansicht auf der Titelseite Ihres Developer Portal ein

  1. Navigieren Sie zu Struktur > Seiten.
  2. Suchen Sie die Bezeichnung welcome und klicken Sie auf Bearbeiten.
  3. Klicken Sie im Abschnitt Varianten auf Panels, dann auf Inhalt.
  4. Klicken Sie auf Neuen Block hinzufügen.
  5. Wählen Sie unter dem Abschnitt Listen(Ansichten) Ihren neuen Block aus.

    Tweet-Ansicht zum Block hinzufügen

  6. Deaktivieren Sie das Kontrollkästchen Titel anzeigen und klicken Sie auf Block hinzufügen.
  7. Sie können jetzt die Position Ihrer Tweet-Ansicht auf der Startseite neu anordnen.

    Screenshot der Tweet-Ansicht auf der Titelseite

  8. Klicken Sie auf Aktualisieren und speichern.

Die Themen dieses Tutorials

Sie können überprüfen, ob die erstellte Ansicht auf der Titelseite Ihrer Site angezeigt wird.

Die neue Titelseite mit Tweet-Karussell

Nächste Schritte

Sie können Ihre Ansicht jederzeit bearbeiten, indem Sie zu Struktur > Ansichten navigieren und Ihre Ansicht anhand ihres Namens auswählen. Sie können das Layout der Ansicht auf der Startseite auch ändern oder löschen, indem Sie unter Struktur > Seiten zurück zum Layoutbereich Ihrer Seite navigieren.

Sie können Ihre Twitter-Daten auch dynamisch integrieren. Weitere Informationen finden Sie unter den folgenden Links.