[BLOGGER] Linear Archive on Static Page ✤✤

Ich weiss ja nicht, wie es euch geht, aber ich mag das Archiv-Gadget einfach nicht. Anfangs habe ich es benutzt, aber ich war immer total eifersüchtig auf Oliver's Archiv (Dort ist übrigens jeder Link klickenswert!) und irgendwann hab ich ihn einfach mal gefragt, wie er das macht.
Die Lösung nennt sich JavaScript, der Grundgedanke extrem simpel.
In jeden Blogger-Blog ist ein RSS-Feed integriert, der sich wie folgt aufbaut

DEINESEITE.blogspot.com/feeds/posts/default

Mithilfe des JavaScript liest man die Titel und den Link aus und stellt sie in einer Liste dar.

Was ihr also tut ist folgendes.
Neue Seite hinzufügen.

I don't know about you, but I hate the archive widget of blogger. At the beginning I used tit, but I was always envious about Oliver's Archive (where actually each post is worth clicking - but it's in German only) and at some point I just asked him, how he did this.
The solution is called JavaScript, the thought behind it extremely simple.
In each blogger blog a RSS feed is integrated which you can see if you enter this URL

YOURSITE.blogspot.com/feeds/posts/default

The script reads the titles and links and displays them in a list.

So, what you're gonna do is this.

Add a new static page.



Dort wechselt ihr ins HTML und fügt einen div-container ein.

There you go into the HTML and add a div-container.

<div id="listemup">
Loading...
</div>

Wie ihr seht hab ich noch ein loading eingefügt, wenn ihr eine Menge Posts habt, kann das schon eine Weile dauern, bis die alle geladen sind, der Text steht dann dort.

Direkt darunter fügt ihr dieses JavaScript ein, wobei ihr YOURSITE durch den Teil eurer URL einfügt, die vor .blogspot folgt.

I added a content. If you have a lot of posts there is gonna be a few seconds of waiting time until everything is displayed, in the meantime the content of the container is shown and telling your visitors something is acutally coming.

Underneath the container you are gonna add the script, making sure to replace YOURSITE with the part of your blog URL before .blogspot.

<script>
function listemall(json){
var listhis='<ul class="unstyled">';
for(var i=0; i<json.feed.entry.length; i++){
var posttitle=json.feed.entry[i].title.$t;
for(var k = 0; k < json.feed.entry[i].link.length; k++){
if (json.feed.entry[i].link[k].rel == 'alternate') {
var postlink = json.feed.entry[i].link[k].href;
}
}
listhis+='<li><a href="'+postlink+'">'+posttitle+'</a></li>';
}
listhis+='</ul>';
document.getElementById('listemup').innerHTML=listhis;
}
</script>

<script src="http://YOURUSITE.blogspot.com/feeds/posts/default?max-results=500&amp;alt=json&amp;callback=listemall"></script>

Dann veröffentlichen.

Publish




Und ihr habt euer Lineares Archiv :D

And your Archive Page is done. :D