Blogspot Widget: Letzte Posts vom Label

Mit diesem Blogspot/Blogger Widget können Sie den letzten Post oder mehrere Posts von einem Label anzeigen.
Das Widget kann an einer beliebigen Stelle im Blogger Blog eingebunden werden.
Die Einbindung vom Widget erfordert keine HTML oder sonstige spezifische Kenntnisse. Sollte etwas nicht klappen, einfach über Kommentare melden, ich versuche zu helfen.

Anleitung: Widget im Sidebar einbauen

Schritt 1)
Nachfolgend befindet sich der Code vom Widget.

In dem Code zuerst 2 rot markierte Werte entsprechend Ihren Wünschen anpassen - dazu einfach im Code darauf klicken und anpassen (wie im Texteditor). 
Wenn es mit Ihrem  Webbrowser nicht klappt, den Code hier auf itslot.de anzupassen, dann den Code kopieren, im Texteditor einfügen und dort anpassen.

<!-- Blogspot Widget: Letzte Posts vom Label v1.1 von itslot.de - Anfang-->
<p id="lastpostsgadget"></p>
<script>
var AnzahlPosts = 1;
var Label = "Katzen";
     
function loadRSSfeed() { var xmlHttpReq = new XMLHttpRequest(); xmlHttpReq.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { getLastPosts(this);} }; xmlHttpReq.open("GET", "/feeds/posts/default/-/"+Label+"?alt=rss&max-results="+AnzahlPosts, true); xmlHttpReq.send(); }
function getLastPosts(xmlData) { var i, xmlDocument, item, title, titleLinkUrl, titlelink, description, descriptionOnlyText, descriptionShort, imageExist, SmallImageSrc, bigImageSrc, bigImage, bigImageWithLink;var summary = ""; xmlDocument = xmlData.responseXML; for (i = 0; i< AnzahlPosts; i++) { item = xmlDocument.getElementsByTagName("item")[i]; if (item) { title = item.getElementsByTagName("title")[0].childNodes[0].nodeValue; titleLinkUrl = item.getElementsByTagName("link")[0].childNodes[0].nodeValue; titlelink = "<a href="+titleLinkUrl+">"+title+"</a>"; description = item.getElementsByTagName("description")[0].childNodes[0].textContent; descriptionOnlyText = description.replace(/<[^>]*>/g, ""); descriptionShort = descriptionOnlyText.substring(0, 100);  imageExist = item.getElementsByTagNameNS('http://search.yahoo.com/mrss/', 'thumbnail')[0]; if (imageExist) { SmallImageSrc = item.getElementsByTagNameNS('http://search.yahoo.com/mrss/', 'thumbnail')[0].getAttribute('url'); bigImageSrc = SmallImageSrc.replace(/s72-c/g, "s1600"); bigImage = '<img style="width: 100%;" src="' + bigImageSrc + '" />'; bigImageWithLink = "<a href="+titleLinkUrl+">"+'<img style="width: 100%;" src="' + bigImageSrc + '" />'+"</a>"; summary += titlelink+"<br><br>"+bigImageWithLink+"<br><br>"+descriptionShort+"..."+"<br><br>";  } else { summary += titlelink+"<br><br>"+descriptionShort+"..."+"<br><br>"; } } }  document.getElementById("lastpostsgadget").innerHTML = summary; } loadRSSfeed();
</script>
<!-- Blogspot Widget: Letzte Posts vom Label v1.1 von itslot.de  - Ende-->

 
 Bedeutung von diesen 2 roten Werten:

AnzahlPosts - Anzahl von letzten Posts, welche im Widget angezeigt werden.
Label - hier in Klammern das Label angeben, deren Posts im Widget angezeigt werden. Wichtig! Bitte Groß- und Kleinschreibung vom Label beachten - das Label 1zu1 wie in Ihrem Blog eintragen (also "Katzen" ist nicht gleich "katzen")

Schritt 2)
Den angepassten Code auswählen und kopieren (z.B. mit Tastenkombination "Strg + C")

Schritt 3)
Auf blogger.com anmelden,  auf Layout klicken:



Schritt 4)
Im Bereich vom Sidebar auf Gadget hinzufügen klicken:



Schritt 5)
Auf HTML/JavaScript klicken:



Schritt 6)
Im Feld Titel eine beliebige Überschrift vom Widget eingtragen (z.B. "Posts vom Label Katzen")
Im Feld Content den kopierten Code vom Widget einfügen und auf Speichern klicken:





Widget-Variante 2
(mit Datum über dem Post-Link)

<!-- Blogspot Widget: Letzte Posts vom Label v1.1 von itslot.de - Anfang-->
<p id="lastpostsgadget"></p>
<script>
var AnzahlPosts = 1;
var Label = "Katzen";
     
function loadRSSfeed() { var xmlHttpReq = new XMLHttpRequest(); xmlHttpReq.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { getLastPosts(this);} }; xmlHttpReq.open("GET", "/feeds/posts/default/-/"+Label+"?alt=rss&max-results="+AnzahlPosts, true); xmlHttpReq.send(); }
function getLastPosts(xmlData) { var i, xmlDocument, item, title, titleLinkUrl, titlelink, description, descriptionOnlyText, descriptionShort, imageExist, SmallImageSrc, bigImageSrc, bigImage, bigImageWithLink, pubDate, date, postDate, postMonth, postYear, postFullDate;var summary = ""; xmlDocument = xmlData.responseXML; for (i = 0; i< AnzahlPosts; i++) { item = xmlDocument.getElementsByTagName("item")[i]; if (item) { title = item.getElementsByTagName("title")[0].childNodes[0].nodeValue; titleLinkUrl = item.getElementsByTagName("link")[0].childNodes[0].nodeValue; titlelink = "<a href="+titleLinkUrl+">"+title+"</a>"; description = item.getElementsByTagName("description")[0].childNodes[0].textContent; descriptionOnlyText = description.replace(/<[^>]*>/g, ""); descriptionShort = descriptionOnlyText.substring(0, 100);  imageExist = item.getElementsByTagNameNS('http://search.yahoo.com/mrss/', 'thumbnail')[0]; pubDate = item.getElementsByTagName("pubDate")[0].childNodes[0].nodeValue; date = new Date(pubDate); postDate = date.getDate()-1; postMonth = date.getMonth()+1; postYear = date.getFullYear(); postFullDate = postDate+"."+postMonth+"."+postYear; if (imageExist) { SmallImageSrc = item.getElementsByTagNameNS('http://search.yahoo.com/mrss/', 'thumbnail')[0].getAttribute('url'); bigImageSrc = SmallImageSrc.replace(/s72-c/g, "s1600"); bigImage = '<img style="width: 100%;" src="' + bigImageSrc + '" />'; bigImageWithLink = "<a href="+titleLinkUrl+">"+'<img style="width: 100%;" src="' + bigImageSrc + '" />'+"</a>"; summary += postFullDate+"<br>"+titlelink+"<br><br>"+bigImageWithLink+"<br><br>"+descriptionShort+"..."+"<br><br>";  } else { summary += postFullDate+"<br>"+titlelink+"<br><br>"+descriptionShort+"..."+"<br><br>"; } } }  document.getElementById("lastpostsgadget").innerHTML = summary; } loadRSSfeed();
</script>

<!-- Blogspot Widget: Letzte Posts vom Label v1.1 von itslot.de  - Ende-->