YouTube Videos automatisiert per XML auf Website ver├Âffentlichen

Zum YouTube-Video:

Mit meiner Website verfolge ich das Ziel stets aktuellen, hilfreichen Content f├╝r die Webseitenbesucher bereitzustellen. Daher habe ich ein Tool gesucht, dass mir automatisiert meine neuen YouTube-Videos auf meiner Startseite anzeigt. Das Ganze am besten White Label, ohne, dass Datenkrake ihre Tentakel in die Daten meiner User stecken und kostenlos. Da ich au├čerdem zurzeit sehr viel Spa├č habe, kleinere PHP-Codes zu schreiben, habe ich mich dann daf├╝r entschieden selbst eine kleine Applikation zuschreiben. In Zukunft m├Âchte ich das Template dann zu einem eigenst├Ąndigen Modul f├╝r Contao ausbauen. Diese Alpha wollte ich dir aber trotzdem vorstellen.

Der PHP-Code um die XML auf deine Website zu bringen

<?php
$rss_url = 'https://www.youtube.com/feeds/videos.xml?channel_id=UCA0a1r7KMTZ9Tp5Gqjw5ObA';
$anz_obj = 3;
$i = -1;

$all_lines = file($rss_url);
foreach ($all_lines as $key => $line) {

	   if ($i >= $anz_obj) break;
    
        if (str_contains($line,"published")){
        if ($i == -1) $i++;
        else{
        $line_split = explode('<published>',$line);
        $date = explode('-',substr($line_split["1"], 0, -28));
        $finaldate[$i] = $date[2] . "." . $date[1] . "." . $date[0];
        }
    }



    if (str_contains($line,"www.youtube.com/watch?")){
        $line_split = explode('"',$line);
        $arr_link[$i]= $line_split["3"];
    }

    if (str_contains($line,"media:title")){
        $line_split = explode('<media:title>',$line);
        $arr_title[$i]= $line_split["1"];
    }

    if (str_contains($line,"ytimg.com")){
        $line_split = explode('"',$line);
        $arr_thumbnail[$i] =  $line_split["1"];
    }
    
    if (str_contains($line,"starRating")){
        $line_split = explode('"',$line);
        $arr_rating[$i] = 100/5*$line_split["3"];
    }

    if (str_contains($line,"statistics")){
        $line_split = explode('"',$line);
        $arr_clicks[$i] = $line_split["1"];
        $i++;
    }

}
echo "<div class='cc_3-column cc_yt-banner'>";

$i = 0;
while ($i < $anz_obj){
    echo "<div class='cc_yt-box'>";
        echo "<a href='$arr_link[$i]' target='_blank'><h4>$arr_title[$i]</h4></a>";
        echo "<p>". $finaldate[$i] ."</p>";
            echo "<a href='$arr_link[$i]' target='_blank'><div class='cc_yt-thumbnail' style='background-image:url($arr_thumbnail[$i]);'></div></a>";
            echo "<div class='cc_yt-rating'>";
            echo "<table><tr><td class='cc_yt-rating-pos' style='width:$arr_rating[$i]%'></td><td class='cc_yt-rating-neg'></td></tr></table>";
            echo "</div>";
            echo "<div>";
                echo "<div class='cc_clicks'> <p>$arr_clicks[$i] Aufrufe</p>";
                echo "</div>";
                echo "<div class='cc_video-link'> <a href='$arr_link[$i]'>Hier geht's zum Video</a>";
                echo "</div>";
            echo "</div>";
    echo "</div>";    
    $i++;
}

echo "</div>";
?>

Nicht f├╝r riesige Dateien

Der Code ist durchaus nicht perfekt, daf├╝r hochgradig flexibel. Da wir hier tats├Ąchlich Zeile f├╝r Zeile nach den Keys suchen, die wir ben├Âtigen, kannst du mit diesem Ger├╝st praktische jede XML in jedes Modul umwandeln. Er eignet sich sicherlich nicht f├╝r Dokumente mit vielen hunderten und tausenden Zeilen, da dadurch zu viele Abfragen entstehen und die Seite verlangsamen. Allerdings ist die Performance f├╝r meine Zwecke ausreichend.

RSS Feed deiner YouTube-Seite erstellen

Damit deine Videos automatisch auf deiner Seite angezeigt werden k├Ânnen, ben├Âtigst du als allererstes eine Datei, in der sich alle deine Videos befinden und welche sich automatisch updatet. Gl├╝cklicherweise erstellt YouTube automatisch zu jedem Kanal eine XML-Datei, die wir f├╝r diesen Zweck nutzen k├Ânnen. Sch├Ân vor allem, da wir hier nicht auf eine API-Schnittstelle zur├╝ckgreifen m├╝ssen. Der Link ist: https://www.youtube.com/feeds/videos.xml?channel_id=DEINE_KANAL_ID - DEINE_KANAL_ID musst du dabei logischerweise ersetzen. Deine Kanal ID findest du, wenn du deinem YouTube noch keinen Alias zugewiesen hast und sieht in etwa wie: UCD0a1r7UMTZ9Tp7Gqjw5ObA aus. Du findest deine YouTube-Kanal ID auch, wenn du auf deine Kanal-Einstellungen ┬╗ Anpassen ┬╗ Allgemeine Informationen klickst. Dort steht deine Kanal-URL in der Ursprungsform.

Wichtige Tags aus der YouTube-XML definieren 

Der Variable $rss_url haben wir also die URL der XML mitgegeben. Die Anzahl der Objekte, die geladen werden sollen, steuerst du ├╝ber $anz_obj. Die Z├Ąhler Variable beginnt bei -1, weil es sonst eine Komplikation mit dem Datum g├Ąbe - dazu komme ich aber sp├Ąter. Ich baue mir ein Array aus dem Quellcode der XML, wobei jede Zeile ein Eintrag ist und starte dann die foreach Schleife, damit ich jede Zeile auf dessen Bestandteile pr├╝fen kann. In dem Fall kontrolliere ich jede Zeile, ob sie Folge Informationen enth├Ąlt:

  • Den YouTube-Link zum Video
  • Das Ver├Âffentlichungsdatum des Videos
  • Den Titel
  • Das Thumbnail
  • Die Bewertung
  • Die Klicks

Dabei wird immer mittels str_contains nach einem passenden Ausdruck gesucht und im Falle eines Treffers die entsprechende Zeile in Einzelteile zerlegt. Dabei muss man dann mit etwas Ausprobieren, bzw. ganz genauem Hingucken schauen, welchen Teil der Zeile man selbst ben├Âtigt. Anschlie├čend wird der Teil in das jeweilige Array mit der Laufnummer $i gepackt. Jede Kategorie hat dabei sein eigenes Array. Denkbar w├Ąre dabei nat├╝rlich, ein Array f├╝r alle Objekte oder ein Array pro Objekt zu erschaffen, ich habe mich zur ├ťbersicht aber f├╝r diesen Weg entschieden. 

Bei dem Datum gibt es allerdings gleich mehrere Besonderheiten: neben der Zerlegung und neu Zusammensetzung steht dort auch die Abfrage, ob $i -1 ist. Das hat den Grund, dass in der XML vor den Eintr├Ągen der Videos ein Mal ein Eintrag zum YouTube-Kanal selbst kommt. Der HTML-Tag unterscheidet sich nicht von denen der Datumseintr├Ąge der Videos, daher habe ich die Variable $i auf -1 gesetzt, damit beim ersten Vorkommen des Datums kein Eintrag in Array erfolgt.

YouTube Videos auf der Startseite ausgeben

In meinem Fall wollte ich nur eine Verlinkung zum Video, keinen YouTube-Player, der das Video direkt abspielt, da ich sonst wieder ein OPT-System h├Ątte zwischenschalten m├╝ssen. Du kannst das aber sicherlich umsetzen, in dem du dir ein Iframe-Ger├╝st baust. 

Nun wird die Variable $i auf 0 gesetzt, schlie├člich haben die vielen Arrays je drei Keys: 0, 1, 2 und da jetzt eine while Schleife gestartet wird, in der $i kleiner als $anz_obj sein muss. Zur ├ťbersicht habe ich jede Zeile einzeln ausgegeben, um sich ein paar Bytes zu sparen, k├Ânnte man sich das ganze Konstrukt auch in einer echo Anweisung ausgeben lassen.

Hier noch die Entsprechenden CSS-Definitionen:

.cc_yt-rating table,
.cc_yt-rating tr,
.cc_yt-rating td {
    padding:0px!important;
    border:0px!important;
    }
    .cc_yt-box a h4 {
    color:darkgray!important;
    }
    td.cc_yt-rating-pos {
    heigh:5px;
    background-color: hsl(166deg 72% 48%);
    }
    td.cc_yt-rating-neg {
    height: 5px;
    background-color: #ec9000;
    }
    div.cc_clicks, div.cc_video-link{
    display: inline-block;
    padding:10px 15px;
    }
    div.cc_clicks{
    background-color:rgb(240,240,240);
    box-shadow: 2px 2px 3px #c3c3c3, -2px -2px 3px #dedede;
    border-radius: 20px;
    }
    div.cc_yt-thumbnail{
    padding-top: 56%;
    background-position: center;
}

Zur├╝ck

Etwas nicht klar - Frag mich!

 

 

Was ist die Summe aus 4 und 7?