Twoday Logo
help > externe Scripts und Gadgets > Google Calendar einfügen Anmelden nächstes Blog lesen
About
Account (Benutzername & Profil)
Administration
Advanced
Anmeldung
Archiv
Backlinks (Referrer)
Beiträge
Berechtigungen
Bezahlung
Bilder
Blog als Buch
Blog anlegen
Blog archivieren
Charts
Dateien
... weitere
Profil
Abmelden
Weblog abonnieren

Google Calendar einfügen

Hi,

ich möchte einen Google Kalender in meinen Blog einbauen.

Es gelingt mir, einen kleinen Google Calendar in meine rechte Menüleiste hinzuzufügen (über Free Text Module), aber ich hätte diesen Kalender lieber im Content Block.

Wie geht das? Hat jemand schon Google Calendar in einen Blog eingebaut?

danke
User Icon
NeonWilderness vor 4673 Tagen

Man kann den iframe-Code des Google Kalenders direkt in das Content-DIV integrieren (im Skin Site.page). Dadurch wird der Kalender jedoch auf jeder Inhaltsseite angezeigt und ich bin nicht sicher, ob das wirklich wünschenswert ist:

<!-- content -->
<div id="content">

<% response.message prefix='<div class="message">' suffix='</div><br />' %>
<iframe src="https://www.google.com/calendar/embed?src=your.own.public.calendar.google.com&ctz=Europe/Berlin" style="border: 0" width="500" height="375" frameborder="0" scrolling="no"></iframe>
<% response.body %>

</div><!-- end of content -->


Wollen Sie hingegen eine bedingte Darstellung realisieren (z.B. nur auf der Startseite, nicht aber auf Beitragsseiten), ist die Verwendung von JavaScript unumgänglich.
User Icon
Klaener1 vor 4673 Tagen

Google Calendar einfügen

Danke für die schnelle Reaktion.

Sie haben Recht, ich möchte den Kalender nicht auf jeder Seite haben.

Ich dachte es mir eigentlich ganz einfach: Über ein "Free Text Field" einen kleinen Kalender in das Menü (notfalls als jpg ohne echte Kalender Funktion) und von dort auf einen Beitrag verlinken, der den Kalender enthält. Allerdings schaffe ich es nicht, den Google code in einen Beitrag einzubauen. Geht das?
User Icon
skydance vor 4673 Tagen

Nein, embeds in Beiträgen sind aus Sicherheitsgründen nicht erlaubt.
User Icon
NeonWilderness vor 4673 Tagen

@Klaener - das ist wie im richtigen Leben: die einfachsten Dinge können manchmal sehr aufwändig werden.

Wie skydance schon anmerkte, können iframe-Einbettungen nur in Skins, nicht aber in Beitragstexte integriert werden. Der Twoday-Editor filtert entsprechende Versuche sofort aus.

Ich möchte trotzdem noch eine Lösung anbieten, die sowohl das Sicherheitsbedürfnis von Twoday berücksichtigt, als auch Ihnen erlaubt, Ihren Kalender in einen beliebigen Beitrag einzubinden: dabei wird eine simple OBJECT-Einbettung (welche auch der Editor akzeptiert) bei der Seitenanzeige durch ein kleines jQuery-Script in einen validen Google-Calendar Aufruf umgesetzt. Führen Sie dazu folgende Schritte durch:
  1. Aktivieren Sie die Twoday-Komponente jQuery. Klicken Sie auf Admin → Module → Extension Module und dort beim Eintrag "JQuery Integration" (ganz unten) auf Einstellungen und stellen Sie den Auswahlwert auf "ja" (Sichern nicht vergessen).
  2. Klicken Sie auf Admin → Layout → Vorlagen bearbeiten (HTML) und dann auf Hauptseite (Site.page). Navigieren Sie an das Ende der HTML-Anzeige und kopieren Sie direkt vor </body> folgendes Script:
  3. <script type="text/javascript">
    $(document).ready(function(){ "use strict";
    $(".storyContent object.gcal").each( function(){
    var self = $(this),
    src = self.attr("data") || "",
    width = self.attr("width") || "",
    height = self.attr("height") || "",
    html = "";
    self.css("display","none");
    if (width.length===0 || height.length===0 || src.length===0){
    html = "<p class='message'>Fehler: Bitte überprüfen Sie die Object-Parameter 'data', 'width' und 'height'.</p>";
    } else {
    html = '<iframe src="https://www.google.com/calendar/embed?src='+src+'&ctz=Europe/Berlin" style="border: 0" width="'+width+'" height="'+height+'" frameborder="0" scrolling="no"></iframe>';
    }
    self.before(html);
    });
    });
    </script>

  4. Klicken Sie nach dem Einfügen auf "Speichern und Schließen". Legen Sie nun einen neuen Beitrag an. Geben Sie im Editor folgenden HTML-Befehl ein:

    <object class="gcal" data="{Kalenderquelle}" width="{Breite}" height="{Höhe}"></object>

    wobei {Kalenderquelle} die Adresse Ihres Kalenders aus dem Google-iframe-Code (hinter &src=...), {Breite} die anzuzeigende Kalenderbreite in Pixel und Höhe die entsprechende Höhe darstellt. Die Klassenangabe gcal ist fix. Ausgefüllt könnte die OBJECT-Anweisung also etwa so ausschauen: <object class="gcal" data="xxx_klaener%40gmail.com" width="500" height="375"></object>.
  5. Vor oder nach dem OBJECT-Befehl können Sie nach Wunsch beliebige Texte oder andere HTML-Befehle einfügen.
  6. Speichern Sie den Beitragstext und führen Sie einen Hard-Reload (Strg-F5) durch. In der Beitragsanzeige müsste nun Ihr Google-Kalender geladen und angezeigt werden.

Viel Erfolg bei der Umsetzung!

User Icon
Klaener1 vor 4670 Tagen

Klappt Prima

Danke für die schnelle und idiotensichere (brauche ich) Hilfe.

Habe den Kalender in meinem Test-Blog eingebaut und der funktioniert prima. Zwar läßt Google sich nicht so schön formatieren, aber das ist eine andere Geschichte. Im Januar werde ich diese und andere Änderungen in den Live-Blog übernehmen.

Können Sie mir auch so eine schöne Anweisung geben, wie man Google Suche einbaut?
http://help.twoday.net/stories/565877575/#comments ?

danke
User Icon
NeonWilderness vor 4668 Tagen

siehe Anleitung hier.
User Icon
seoagentur vor 4630 Tagen

Super^^

Hat bei mir gklappt. War auch nicht viel mehr an Arbeit. Danke
development