Samstag, 21. August 2010

Google Sites als File- und Ressourcenhost für Blogger-Blogs nutzen

Google Sites ist das kostenlose Webseiten-Baukastensystem zur Erstellung von klassischen Websites, Homepages und ein einfaches Wiki-System für Teams.
In Verbindung mit Google Apps - die Sites sind dort Bestandteil - wird es z.B. für Vereine aber auch in der kostenpflichtigen Version (Google Apps Premier, 50 US-Dollar/p.a. und User) für Freiberufler, kleine und mittelgroße Firmen beworben.

In der kostenlosen Version, lässt sich eine Google Site aber auch hervorragend als Ersatz für z.B. iGoogle (personalisierte Startseite)- die Sites können sowohl öffentlich (public) aufrufbar gemacht werden, der Zugriff kann aber auch auf privat gesetzt werden - und als Ressourcen-Host für Blogger-Blogs nutzen.

Der letzte Punkt, dass Ressourcen-Hosting für Blogger, ist Gegenstand des Posts und ich gehe von einer "öffentlich" zugänglichen Google Site aus.
Bis ca. 2009 wurden von vielen Entwicklern, die kleine Gadgets, Scripts usw. für Blogger-Blogs entwickelt hatten, die Vorläuferversion googlepages.com zum Ressourcen-Sharing (statt einem eigenen Webspace oder Server) genutzt. Die Googlepages wurden jedoch zwischenzeitlich eingestellt.

Aber, auch die Google-Sites lassen sich dazu nutzen, z.B. um:
  • Javascripts zu hosten - bspw. Lightbox, zur Anzeige von Bildern  -, die im Blog referenziert und ausgeführt werden
  • CSS-Dateien zum referenzieren im Blog
  • eine Anführungszeichen-Grafik das in Zitaten angezeigt wird (mein Beispiel)

nur um einige Möglichkeiten aufzuzeigen.


Da man im Web einige Blogs findet, die sich mit "Hacks" - kleine technische Tricks zum Erweitern von Blogger - beschäftigen, findet man dort auch Lösungen, die z.B. Scripts auf einer Google Site abgelegt haben.
Bei "Erfolg solcher Tricks" ist es leider manchmal so, dass zu viele Leute/Blogs den Code nutzen, der auf ein und dieselbe Ressourcenquelle verlinkt.
"Peng...", die Quelle streikt weil z.B. ein Traffic-Tageslimit erreicht wurde und die Lösung funktioniert (zeitweise) für alle nicht mehr.

In dem ich mir eine eigene, unabhängige Quelle (Host) schaffe, kann ich so einfach dieses Problem umgehen, da nur mein Blog die Ressourcen nutzt. Da ich als Blogger-Nutzer sowieso ein Google-Konto habe, ist der Einsatz von Google Sites nun mal naheliegend ;-).
Zudem lässt sich diese Google Site auch noch für andere Zwecke nutzen...


Ein kurze englische Einführung in Google Sites. Mittlerweile hat sich seit der Video-Erstellung einiges geändert, aber um einen ersten Gesamteindruck zu erhalten, ist das Video hilfreich:



Vorab einige Hinweise.
  1. Das Speicherlimit für hochgeladene Dateien beträgt insgesamt 100 MB in der kostenlosen Version von Google Sites. Das ist jedoch für die meisten Anwendungmöglichkeiten zum Einbau in Blogger mehr als ausreichend. Eine einzelne Datei darf max. 10 Mb groß sein...
  2. Die Google Sites - auch hier ist wieder nur die kostenlose Stand-alone-Version gemeint - unterliegen einem Traffic-Limit pro Tag. Wie hoch dieses Limit (Bandbreitenlimit) ist, behandelt Google wie ein kleines Staatsgeheimnis ;-).
Da ich nicht die Grundlagen zur Erstellung von Google Sites beschreibe, sollte man sich schon mit dem Thema beschäftigt haben.
Das was man für Blogger benötigt, besteht nur aus dem hinzufügen einer neuen Seite, dem hochladen von Dateien und einem Referenzbeispiel.

Die Adresse (URL) einer Google Site sieht so aus:

https://sites.google.com/site/ABC123/

der Begriff "ABC123" ist der Name der eigenen Site.
Wenn man eine erste Seite angelegt hat und diese als "Startseite" benannt hat, sieht die URL so aus:

https://sites.google.com/site/ABC123/Startseite

Wir fügen nun eine neue Seite hinzu :


Als Vorlage klickt man die Vorlage "Ordner" an und im Feld Name trägt man "code" ein.


Dadurch ergibt sich nach dem speichern die folgende URL:

https://sites.google.com/site/ABC123/code

Nun kann man wie im Screenshot zu sehen ist, seine eigenen Dateien (Ressourcen) hochladen:





Im Screenshot habe ich die hochgeladene Datei blockquote.gif als Beispiel markiert.
Die URL zu dieser Datei lautet:

https://sites.google.com/site/ABC123/code/blockquote.gif


Hinweis: Wer sich den Link im Browser mittels Rechtsklick im Kontextmenü kopiert, wird z.B. einen weiteren Parameter am Link sehen z.B.: .../code/blockquote.gif?attredirects=0.
Dieser Parameter im Link wird gelöscht!

Das folgende Zitate-Beispiel in Blogger, nutzt nun die Google-Site als Quelle für die Grafikdatei.

Die Grafik blockquote.gif sieht so aus


und wird in meinem Blog angezeigt, wenn ich ein Zitat schreibe und dieses im Editor mit dem Zitate-Button markiere.

Zitate

Wenn der Wind der Veränderung weht, bauen die einen Windmühlen und die anderen Mauern (chinesisches Sprichwort).

Wenn du ein Schiff bauen willst, so trommle nicht Männer zusammen, um Holz zu beschaffen, Werkzeuge vorzubereiten, Aufgaben zu vergeben und die Arbeit einzuteilen, sondern lehre die Männer die Sehnsucht nach dem weiten, endlosen Meer! (Antoine de Saint-Exupéry)
Die Welt ist in zwei Klassen geteilt, in diejenigen, welche das Unglaubliche glauben, und diejenigen, welche das Unwahrscheinliche tun. (Oscar Wilde)

Hier noch einmal der Link zum Beitrag der veränderten CSS-Klasse Blockquote in Blogger mit der Google Font API.

Wer die Schriftarten-API nicht nutzen möchte, aber die Zitate mit dem Anführungszeichen in der linken, oberen Ecke und grau unterlegt angezeigt haben möchte, nutzt dieses Beispiel:

blockquote {
margin:1em 20px;
background: #EDEDED url(https://sites.google.com/site/ABC123-abändern mit eigener URL/code/blockquote.gif) top left no-repeat;
padding: 8px 8px 8px 65px;
}
 
Die graue Farbe wird im Parameter background: mit #EDEDED definiert - kann aber auch gelöscht oder geändert werden.
Die URL im o.g. Code, ersetzt man durch die eigene Google-Site-URL.

Wer die Zitate ohne Hintergrundfarbe aber mit einem Rahmen versehen möchte, nutzt diese Version von blockquote und ändert sie entweder im Blogger-Template ab oder falls nicht in der Vorlage vorhanden, fügt sie im CSS-Teil hinzu:

blockquote {

border: 1px solid #000000;
margin:1em 20px;
background: url(https://sites.google.com/site/ABC123-abändern mit eigener URL/code/blockquote.gif) top left no-repeat;
padding: 8px 8px 8px 65px;
}

Für das solid in "border: 1px solid #000000;", kann man andere Werte bzw. Rahmenarten verwenden, zum Beispiel:  dotted = gepunktet,  dashed = gestrichelt, solid = durchgezogen, double = doppelt durchgezogen.

Ich denke, der Einsatz der Google Sites in Verbindung mit Blogger ist eine einfache Möglichkeit, in Zukunft diverse kleinere Blogger-Erweiterungen selber hosten zu können.
Das es vielfältige andere Filehoster usw. gibt, weiß ich auch...

Die Google Sites sind mittlerweile mehrfach um neue Features erweitert worden und bieten sehr viele eigenständige Einsatzmöglichkeiten.
Nicht entweder oder, sondern: Blogger PLUS Google Sites PLUS Google Docs PLUS Google Map und, und, und... ;-).
Link: http://sites.google.com/?hl=de

NoodleGei.blogspot.com

Ähnliche Beiträge zum Thema/Kategorie:



2 Kommentar(e) zum Beitrag:

Anonym hat gesagt…

Ich benutze diese Methode für ein Tumblr Blog und kann den CSS file leider nur dann abrifen wenn ich in mein Google Konto eingeloggt bin. Sobald ich mich von Google Sites abmelde wird der CSS file nicht mehr runtergeladen. Dabei handelt es sich um eine öffentliche Seite. Kannst Du das überürpfen bitte? Danke. Ansonsten geht die Methode recht gut. Wäre nur schade wenn man die ganze eingeloggt bleiben muss um die files auch auf diversen seiten laden zu lassen. Grüsse

NoodleGei hat gesagt…

Ich habe in einem Test-Blogger-Blog ein CSS-File von Lightbox abgeändert, dass auf einer Google Site gehostet wird.
Von Google abgemeldet, Cache und Cookies gelöscht und sogar rebootet.

Geändertes CSS-Files wird mir korrekt angezeigt, ohne eingeloggt zu sein.
Zu einem Tumblr-Blog kann ich nichts sagen, sollte aber eigentlich auch funktionieren.

Kommentar veröffentlichen

Kommentare bitte fair und im rechtlich erlaubten Rahmen verfassen!
Die Kommentare und ggf. hinterlassene URLs werden von mir überprüft. Kommentare die für blaue Pillchen, Glücksspiele, bestimmte Bilder/Videos, Abzocker-Dienste usw. werben, werden gelöscht.

Kommentare von SEO-Link-Builder sind ebenso unerwünscht!

In den Kommentare können die HTML-Tags für:
kursiv = <i>Testwort</i>
fett = <b>Testwort</b>
Links = <a href="http://www.deineURL.de/">Link Text</a>
genutzt werden. Einfach die o.g. Beispiele kopieren und mit den eigenen Werten ersetzen.

  © Blogger template Columnus by Ourblogtemplates.com 2008

Back to TOP