google-Kalender formatieren

  • Hallo zusammen,


    habe gerade eine gute Seite zum Thema "Customizing Google Calendar" gefunden.
    Sieht alles toll aus und erlaubt fast alles, um den Google Kalender anzupassen.


    https://feed.mikle.com/support…alendar-widget-using-css/


    und hier zum konfigurieren
    https://feed.mikle.com/gcal/


    Nun meine Schwierigkeit:
    Wie bekomme ich den Code in Website X5?


    Da gibt es ein css und die Einbindung in HTML... was muss wo, wie hin?
    Habe u.a. das mit dem Container nicht verstanden.



    Wer kann helfen?


    hier mal die css-Datei


    ----- oder eine ganz andere Möglichkeit? Wer hat Erfahrung ?? ---

    Dateien

    Danke für Eure Hilfe! Sal Guri

    3 Mal editiert, zuletzt von salguri ()

  • Dein erster link funktioniert nicht! C:-)

    Lg.

    Thabo-Umasai

    -----------------------------------------------------------------------------------------------------------
    "Was du heute kannst besorgen, das verschiebe nicht auf Morgen...."

    ;)

  • Links (s.o.) korrigiert.


    Etwas mehr Hintergrund:
    Möchte einen bestehenden google Kalender auf einer Website einbinden, wobei das Layout des Kalenders an das Layout der Seite angepasst werden soll. Responsive sollte es auch sein.


    Hatte das mal in 2015 mit "restyle" und zwoemtis Hilfe geschafft, funktioniert aber nicht mehr
    http://www.restylegc.com/


    Am liebsten wäre es mir auf einer Seite in X5 einen HTMLCode mit dem Aufruf des google-Kalenders einzubinden und der Seite eine css-Datei hinzuzufügen.


    Zum Thema Responsive Kalender habe ich interessantes gefunden


    https://answers.squarespace.co…-in-a-responsive-way.html
    https://codepen.io/profstein/pen/ozrbPJ


    .. aber auch hier: Wie bekomme ich das nach X5???

    Danke für Eure Hilfe! Sal Guri

    Einmal editiert, zuletzt von salguri ()

  • Hallo, hab es geschafft den google-Kalender als responsive in Website X5 einzubauen.


    Hier die Testseite


    Was ich wo eingebunden habe ist dort genau beschrieben.
    Wer schaut sich den Code mal an, ... bitte nicht schimpfen ;-)
    Verbesserungen nehme ich gern.



    zum Thema: "Anpassen Layout" komme ich nicht voran .

  • Also an deiner obigen Seite habe ich nichts auszusetzen. Sehe keinen Fehler. Zum Thema Anpassen ist mein Wissenstand immer noch wie damals.


    http://www.codefreaks.net/goog…ndar-api-mit-php-nuetzen/ ist für die Ausgabe im eigenen Stil extrem aufwendig....


    vom restyle gibt es auch ein paar weitere Varianten auch neuere...


    https://github.com/normalhuman/restylegc


    Das hier habe ich nicht weiter verfolgt scheint aber aktueller zu sein.


    und wie man dort sieht gibt es defintiv auch noch funktionierende



    http://clevelandfmc.org/



    siehe Quelltext



  • Es ist mir gelungen den Google Kalender anzupassen und ihn über css-zu ändern
    dazu
    - Neue Seite als php
    auf Seite HMTL Objekt mit (s.u.)
    - zum HTML-Objekt den css-code (s.u.)


    und ... FERTIG
    über css Code das Aussehen anpassen und schon sieht alles prächtig aus. Schaut mal HIER


    Nun der Punkt:
    - Wie zu sehen, fehlt auf der Kalenderseite der Rollbalken rechts und man kann die darunterliegenden Texte, Fußzeile nicht erreichen
    - Bei der Vorschau der Seite in X5 kommt die Meldung
    function _onload()', '


    Wer hat eine Idee... Nehmen und Geben ;-)


    -----
    LINKS korrigiert:


    Basis ... dank unserem ZWOEMTI
    https://gist.github.com/dawoodman71/5250759
    und als Muster-Ergebnis
    http://www.efs-sohland.de/termine

    Danke für Eure Hilfe! Sal Guri

    2 Mal editiert, zuletzt von salguri ()

  • Deine unteren Links funktionieren nicht!


    Aber was ich so gesehen habe, hast du in das HTML-OBjekt die ganze Website eingebunden was du nicht brauchst. Du musst das html, Head, MEtatag rauslöschen oben und unten.

    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !

  • Danke andy. Links in Vorpost korrigiert.


    Ja, irgendetwas ist nicht korrekt eingebunden! Schaut mal in "Seitenquelltext"


    IST:
    - eine eigene Kalender-Seite als php (Keine allgemeinen Eintragungen)
    - auf der Kalenderseite ein HTML und ein Textobjekt
    - im HTML-Objekt den PHP-Code
    - und in diesem Objekt als Zusatz der Css-Code


    Codes siehe HIER
    Muster siehe HIER


    Hab alles versucht, hier ist Sal Guri am ENDE!

    Danke für Eure Hilfe! Sal Guri

    Einmal editiert, zuletzt von salguri ()

  • Hi!


    Im HTML-Object 1 gibt es eine Style-Anweisung für den Body-Bereich die das Abschneiden des fehlenden Bereiches verursacht.
    Siehe dazu meinen Screenshot 1 und entferne den pinkfarben markierten Bereich.


    Im Screenshot 2 und 3 siehst du wie es ohne diese Style-Anweisung im Browser aussieht

  • Hallo Werner,
    Danke, das sieht super aus!
    Muss ich den Code immer manuell entfernen, oder kann das in x5 direkt geändert werden? Wenn ja, wo.

  • Hi!


    Also eine wirkliche Lösung, wo die Style-Anweisung her kommt, habe ich leider nicht gefunden. Scheint als kommt das mit der PHP-Einbindung des Kalenders daher. Ich bin aber leider in PHP nicht so fit und muss da passen.


    Du könntest aber jetzt mal test-halber die Einblendung des Scroll-Balken erzwingen.
    Dazu müsstes du in deinem Projekt in den Einstellungen (1) unter "Statistiken SEO und Code" die "Erweitert"-Registerkarte aufrufen und unter "Benutzerdefinierter Code" -> "Vor dem </HEAD> Tag" folgende fünf Zeilen einfügen:


    <style>
    body {
    overflow-y: auto !important;
    }
    </style>

  • Danke für den Vorschlag.
    Leider kein Erfolg ;-( aber eine gute Idee.
    Muss doch zu schaffen sein ....

  • HAtten wir das nicht schon mal geschrieben? Wieso bindest du etwas einen HTML und Head Tag ein. Du darfst nicht den gesamten Code von der Musterseite nehmen sondern nur den relevanten Teil ab den <titel> Tag !
    Dann wird auch die Leiste wieder auftauchen.

    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !

  • Hallo,


    habe den Vorschlag von Werner nochmal aufgegriffen und mir den php-Code im HTML-Objekt angesehen.
    Dort wird schon einiges im vom Script (google) erzeugten Code ersetzt.


    Also habe ich mit den Zusatzbefehlen:


    $f = str_replace('<style type="text/css">body{margin:0;padding:0;overflow-y:hidden;}','', $f )
    $f = str_replace('html{overflow-y:hidden;}</style>','', $f )



    die überflüssigen style und overflow Befehle entfernt.



    UND: ES LÄUFT!


    Und hier das MUSTER

  • @zwoemti


    "Na da werd ich ja auch nicht mehr gebraucht.."


    Das stimmt nicht! Wo wären wir ohne das Forum und ohne Deine Hilfe?!
    Ohne zwoemti geht es nicht!!!
    Denke, Du wirst mehr gebraucht als jemals zuvor ...


    DANKE

  • Zu diesem Thema kann ich abschließend nur sagen: Lasst es!


    Es klappt, aber nur mit nicht vertretbarem Aufwand:
    - php Script
    - Css Date
    - zusätzliche Images
    usw.


    Genug?


    Wenn jemand das wirklich will, möge sie/er sich melden ...


    Mein besonderer Dank geht an unseren ZWOEMTI :bobybuild: