github
Anzeigen der GitHub-Timeline / -Feeds auf Ihrer Website

Anzeigen der GitHub-Timeline / -Feeds auf Ihrer Website

In diesem Dokument wird erläutert, wie Sie Ihre GitHub-Feeds / Timeline auf Ihrer Website anzeigen.

Beispiel: Ein Live-Beispiel ist verfügbar unter:

https://newtonjoshua.com

GitHub-Timeline:

GitHub stellt die öffentliche Timeline für jeden Benutzer im Atom-Format bereit.

Sie können Ihre Zeitleiste anzeigen unter:

https://github.com/ {{GitHub_username}}. atom

siehe: https://developer.github.com/v3/activity/feeds

Google Feed-API:

Mit der Feed-API können Sie jeden öffentlichen Atom-, RSS- oder Medien-RSS-Feed nur mit JavaScript herunterladen, sodass Sie Feeds mit nur wenigen JavaScript-Zeilen mit Ihrem Inhalt und anderen APIs kombinieren können. Dadurch können Sie Feeds schnell in Ihre Website integrieren.

Siehe: https://developers.google.com/feed/v1/devguide

Laden der JavaScript-API: Um die Feed-API zu verwenden, fügen Sie das folgende Skript in die Kopfzeile Ihrer Webseite ein.

<script type="text/javascript" src="https://www.google.com/jsapi"></script>

Laden Sie anschließend die Feed-API mit google.load (Modul, Version, Paket).

<script type="text/javascript">
  google.load("feeds", "1");
</script>

Angeben der Feed-URL: Sie können google.feeds.Feed () wie folgt aufrufen:

var feed = new google.feeds.Feed("https://github.com/{{GitHub_UserName}}.atom");

Laden eines Feeds: .load (Rückruf) lädt den im Konstruktor angegebenen Feed von den Servern von Google herunter und ruft den angegebenen Rückruf auf, wenn der Download abgeschlossen ist.

<script type="text/javascript">

    function initialize() {
      feed.load(function(result) {
        if (!result.error) {
          var container = document.getElementById("feed");
          result.feed.entries.forEach(function (feed) {
            var feedTitle= feed.title; 
            var feedLink = feed.link;
            var feedDate = formatDate(feed.publishedDate);
            var feedContent = formatContent(feed.content);

           // display the feed in your website
          });
        }
      });
    }
    google.setOnLoadCallback(initialize);

    </script>

Aufruf des onLoad-Handlers: setOnLoadCallback (callback) ist eine statische Funktion, die die angegebene Handlerfunktion registriert, sobald die Seite mit diesem Aufruf geladen wird. Callback ist eine erforderliche Funktion, die aufgerufen wird, wenn das enthaltende Dokument geladen wird und die API verwendet werden kann

<script type="text/javascript">
    google.setOnLoadCallback(initialize);
 </script>

Festlegen der Anzahl der Feedeinträge : .setNumEntries (num) setzt die Anzahl der Feedeinträge, die von diesem Feed geladen werden, auf num. Standardmäßig lädt die Feed-Klasse vier Einträge.

var feed = new google.feeds.Feed("https://github.com/{{GitHub_UserName}}.atom");
feed.setNumEntries(500);

Jetzt können Sie Ihre GitHub-Feeds / Timeline auf Ihrer Website formatieren und anzeigen.