Verwendung: Cookie Hinweis - fixed-note nachträglich für Tao installieren

Gerald's Avatar

Gerald

22 Feb, 2016 04:11 PM

Produkt: Tao Contao
Contao-Version: 3.5.6
Browser und Browserversionen: alle

Hallo,

habt ihr einen Hinweis/Link, wie sich nachträglich der Cookie Hinweis bei einer bestehenden Tao-Installation hinzufügen lässt. Welche Dateien müssen ersetzt werden, bzw. welche .css Anpassungen vorgenommen werden. Danke!

  1. Support Staff 1 Posted by RockSolid Theme... on 23 Feb, 2016 08:14 AM

    RockSolid Themes's Avatar

    Vielen Dank für Ihre Frage.

    Bitte laden Sie die aktuelle Version Ihres Themes über Ihren Kundenbereich herunter und übernehmen folgende Dateien aus dem ZIP-Archiv:

    contao/theme/templates/tao/rsce_tao_fixed_note_config.php contao/theme/templates/tao/rsce_tao_fixed_note.html5

    in Ihre bestehende Installation nach contao/templates/tao/.

    Übernehmen Sie sämtliche CSS-Selektoren und die zugehörigen CSS-Eigenschaften die mit .fixed-note- beginnen. Im Falle von Tao sieht der Block beispielsweise so aus:

    .fixed-note {
        position: fixed;
        display: table;
        top: auto;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        min-height: 3.75em;
        padding: 0.75em 1.25em 0.75em 5em;
        border-top: 1px solid #b2b9c4;
        z-index: 99;
        background-color: white;
        box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
    }
    @media screen and (max-width: 900px) {
        .fixed-note {
            position: relative;
        }
    }
    @media screen and (max-width: 599px) {
        .fixed-note {
            display: block;
            padding-left: 1.25em;
        }
    }
    .fixed-note:before {
        position: absolute;
        top: 50%;
        margin-top: -0.5em;
        left: 0.83333em;
        font-size: 2.25em;
        color: #8570a6;
    }
    @media screen and (max-width: 900px) {
        .fixed-note:before {
            top: 0.66667em;
            margin-top: 0;
        }
    }
    @media screen and (max-width: 599px) {
        .fixed-note:before {
            position: static;
        }
    }
    .fixed-note h1,
    .fixed-note h2,
    .fixed-note h3 {
        font-size: 0.9375em;
        margin: 0.4em 0;
    }
    .fixed-note p {
        font-size: 0.875em;
        margin: 0.42857em 0;
    }
    @media screen and (max-width: 599px) {
        .fixed-note p {
            font-size: 1em;
        }
    }
    
    .fixed-note-column {
        display: table-cell;
        vertical-align: middle;
        padding: 0 0.625em;
    }
    .fixed-note-column:last-child {
        text-align: right;
    }
    @media screen and (max-width: 900px) {
        .fixed-note-column:last-child {
            text-align: left;
        }
    }
    @media screen and (max-width: 900px) {
        .fixed-note-column {
            display: block;
            margin: 0.75em 0;
            padding: 0;
        }
    }
    
    .fixed-note-link,
    .fixed-note-button {
        white-space: nowrap;
    }
    
    .fixed-note-button {
        margin: 0;
    }
    
    .fixed-note-closed {
        position: fixed;
        right: 1.875em;
        bottom: 0;
        z-index: 99;
        padding: 0.5em 0.75em;
        color: white;
        text-decoration: none;
        background: #37aadf;
        box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
    }
    @media screen and (max-width: 1188px) {
        .fixed-note-closed {
            right: 0;
        }
    }
    @media screen and (max-width: 900px) {
        .fixed-note-closed {
            position: absolute;
            top: 0.75em;
            right: 0.75em;
            bottom: auto;
            padding: 0.25em 0.75em;
            font-size: 0.875em;
        }
    }
    @media screen and (max-width: 599px) {
        .fixed-note-closed {
            font-size: 1em;
        }
    }
    .fixed-note-closed:hover,
    .fixed-note-closed:focus {
        background-color: #1f90c4;
    }
    .fixed-note-closed:before {
        font: 100%/1 "RockSolid Icons";
        content: "\e0a6";
        -webkit-font-smoothing: antialiased;
        font-smoothing: antialiased;
        text-rendering: geometricPrecision;
        text-indent: 0;
        display: inline-block;
        position: relative;
    }
    .fixed-note-closed > span {
        display: none;
    }
    

    Hinweis: Bei anderen Themes bitte im CSS nach .fixed-note suchen und den Codeblock übernehmen, er kann in einigen Punkten themespezifisch abweichen.

    Wenn Sie bisher keine Änderungen an der main.css direkt vorgenommen haben können Sie die Dateien main.css bzw. main.css.base (zweitere wird vom Frontend Helper benötigt) auch komplett überschreiben. Bitte vorher unbedingt ein Backup der ursprünglichen Datei herstellen. Haben Sie bereits Änderungen mit dem Frontend Helper oder manuell vorgenommen, kopieren Sie den obigen Code bitte in die Datei custom.css.

    Abschließend legen Sie unter Themes » THEME NAME » Frontend-Module ein neues Modul mit dem Titel Fixed Note an, der Modultyp lautet Hinweisbox. Geben Sie dem Modul den gewünschten Inhalt und binden es in jedem Layout, in dem die Hinweisbox erscheinen soll, in die Kopfzeile ein.

  2. 2 Posted by Gerald Helminge... on 24 Feb, 2016 03:52 PM

    Gerald Helminger - Kundenkraft GmbH's Avatar

    Vielen Dank, hat super geklappt.
    Noch eine Frage hierzu.
    Nachdem die Cookie Verwendung akzeptiert wurde, erscheint ein "i" um jederzeit den Hinweis wieder aufzurufen.
    Kann ich diesen Hinweis entfernen, indem ich den folgenden Selektor entferne?

    .fixed-note-closed:hover,
    .fixed-note-closed:focus {
        background-color: #1f90c4;
    }
    .fixed-note-closed:before {
        font: 100%/1 "RockSolid Icons";
        content: "\e0a6";
        -webkit-font-smoothing: antialiased;
        font-smoothing: antialiased;
        text-rendering: geometricPrecision;
        text-indent: 0;
        display: inline-block;
        position: relative;
    }
    .fixed-note-closed > span {
        display: none;
    }
    

    Danke für ein Feedback!

  3. Support Staff 3 Posted by RockSolid Theme... on 25 Feb, 2016 09:12 AM

    RockSolid Themes's Avatar

    Sie können in den Moduleinstellungen den Punkt „Wieder öffnen Link“ deaktivieren um den Link zu entfernen.

    Durch das Entfernen des CSS-Codes wird der Link selbst nicht entfernt.

  4. 4 Posted by strichsieben on 13 Jul, 2018 11:02 AM

    strichsieben's Avatar

    Greift das auch bei CONTAO 3.2? Bei 3.5 konnte ich das ohne Probleme umsetzen, bei 3.2 wird im Seitenlayout das Modul nicht gefunden.

  5. 5 Posted by strichsieben on 13 Jul, 2018 12:13 PM

    strichsieben's Avatar

    OK, hat sich erledigt, funktioniert alles bestens! Auch in 3.2 kein Problem.

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:

»

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac