Benutzer-Werkzeuge

Webseiten-Werkzeuge


design:snippets

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Nächste Überarbeitung
Vorhergehende Überarbeitung
design:snippets [19.09.2015 14:14] – angelegt Manuela v.d.Deckendesign:snippets [21.09.2015 12:13] (aktuell) Manuela v.d.Decken
Zeile 2: Zeile 2:
  
 ~~FAQ~~ ~~FAQ~~
 +=?=== Verschiedenes =====
 +
 ??? Hinweis auf die Benutzung von Cookies? ??? Hinweis auf die Benutzung von Cookies?
-Wie baue ich einen Button ein, damit der Besucher Cookies akzeptieren muss? +Damit meine Seite rechtssicher (nach der EU-Cookie-Richtlinie) wird, möchte ich auf meiner Seite einen Button einbauen, damit der Besucher Cookies akzeptieren muss bevor er meine Seite betritt
-What if I want to put some text after the block and that text doesn'+!!! Hierfür sind mehrere Schritte/Elemente notwendig: 
-belong to the answer? +Zuallererst wird natürlich der Button sowie eine entsprechende Meldung benötigt. Dieser wird ganz unten in der //index.php// des Templates, direkt **vor** dem **</body>**-Tag eingesetzt. 
-!!! Put triple question mark at the start of a line+<HTML> 
-=?=== Installation ===== +<!--  
-??? How to migrate from WebsiteBaker 2.9.x? + CookieNotice.html 
-!!! The upgrade scenarios from an existing WebsiteBaker version to a newer one is explained in more detail here.+ copyright: Manuela v.d.Decken <manuela@isteam.de> 
 + author:    Manuela v.d.Decken <manuela@isteam.de> 
 + license:   http://www.gnu.org/licenses/gpl.html   GPL License 
 + version:   0.0.1  
 +--> 
 +    <div id="CookieNotice"> 
 +       <div id="CookieNoticeBar"> 
 +            <span id="CookieNoticeClose">X</span> 
 +            <span id="CookieNoticeInfo">!! HIER WIRD DER GEWÜNSCHTE HINWEISTEXT EINGESETZT !!</span> 
 +        </div> 
 +    </div> 
 +    <script charset="utf-8" type="text/javascript" src="<?php echo oReg.TemplateUrl; ?>js/CookieNotice.min.js"></script> 
 +</HTML> 
 +Da hier ein JScript aufgerufen wird, sollte man das natürlich auch noch in den /js/ Ordner des Templates packen. 
 +<file java CookieNotice.min.js> 
 +/** CookieNotice.min.js 
 + copyright: Manuela v.d.Decken <manuela@isteam.de> 
 + author:    Manuela v.d.Decken <manuela@isteam.de> 
 + license:   http://www.gnu.org/licenses/gpl.html   GPL License 
 + version:   0.0.1 */function CookieNotice(e){var o=7,t=this;this.Box=document.getElementById(e),this.hideNotice=function(e){e=e||window.event;var i=e.target||e.srcElement;"CookieNoticeClose"==i.id&&(t.Box.style.display="none",t.setCookie("CookieNoticeVisible","none",o),e.stopPropagation?e.stopPropagation():e.cancelBubble=!0)},this.setCookie=function(e,o,t){var i=new Date;i.setTime(i.getTime()+864e5*t);var n="expires="+i.toGMTString();document.cookie=e+"="+o+";path=/; "+n},this.getCookie=function(e){for(var o=e+"=",t=document.cookie.split(";"),i=0;i<t.length;i++){for(var n=t[i];" "==n.charAt(0);)n=n.substring(1);if(0===n.indexOf(o))return n.substring(o.length,n.length)}return""},this.start=function(){var e=t.getCookie("CookieNoticeVisible");"none"!=e&&(t.Box.style.display="block")},this.Box.onclick=t.hideNotice,this.start()}new CookieNotice("CookieNotice"); 
 +</file> 
 +Gut, das ist jetzt natürlich hervorragend lesbar. Deshalb hier der Code noch einmal, jedoch in Klartext: 
 +<file java CookieNotice.js> 
 +/* 
 + * DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS HEADER. 
 + * 
 + * This program is free software: you can redistribute it and/or modify 
 + * it under the terms of the GNU General Public License as published by 
 + * the Free Software Foundation, either version 3 of the License, or 
 + * (at your option) any later version. 
 + * 
 + * This program is distributed in the hope that it will be useful, 
 + * but WITHOUT ANY WARRANTY; without even the implied warranty of 
 + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the 
 + * GNU General Public License for more details. 
 + * 
 + * You should have received copy of the GNU General Public License 
 + * along with this program.  If not, see <http://www.gnu.org/licenses/>
 + */ 
 +/** ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
 + * 
 + * CookieNotice.js 
 + * 
 + * @category     Template 
 + * @copyright    Manuela v.d.Decken <manuela@isteam.de> 
 + * @author       Manuela v.d.Decken <manuela@isteam.de> 
 + * @license      http://www.gnu.org/licenses/gpl.html   GPL License 
 + * @version      0.0.1 
 + * @lastmodified 19.09.2015 
 + * @since        File available since 04.07.2015 
 + * @description  switch off the cookie notice for n days 
 +    (by default after 7 days the cookie will be removed again) 
 +~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ 
 + 
 +    function CookieNotice(NoticeAreaId) { 
 + 
 +        var CookieLifetime 7; // lifetime of the cookie in days 
 +        var thisObject this; 
 +        this.Box document.getElementById(NoticeAreaId); 
 + 
 +        this.hideNotice function(e) { 
 +            e e || window.event; 
 +            var target e.target || e.srcElement; 
 +            if (target.id == 'CookieNoticeClose') { 
 +                thisObject.Box.style.display 'none'; 
 +                thisObject.setCookie("CookieNoticeVisible", "none", CookieLifetime); 
 +                if (e.stopPropagation) { 
 +                    e.stopPropagation(); 
 +                } else { 
 +                    e.cancelBubble = true; 
 +                } 
 +            } 
 +        }; 
 + 
 +        this.setCookie = function(cname,cvalue,exdays) { 
 +            var d = new Date(); 
 +            d.setTime(d.getTime() + (exdays*86400000)); 
 +            var expires = "expires=" + d.toGMTString(); 
 +            document.cookie = cname+"="+cvalue+"; path=/; "+expires; 
 +        }; 
 + 
 +        this.getCookie = function(cname) { 
 +            var name = cname + "="; 
 +            var ca = document.cookie.split(';'); 
 +            for(var i=0; i<ca.length; i++) { 
 +                var c = ca[i]; 
 +                while (c.charAt(0)==' ') c = c.substring(1); 
 +                if (c.indexOf(name) === 0) { 
 +                    return c.substring(name.length, c.length); 
 +                } 
 +            } 
 +            return ""; 
 +        }; 
 + 
 +        this.start = function() { 
 +            var value = thisObject.getCookie('CookieNoticeVisible'); 
 +            if (value != 'none') { 
 +                thisObject.Box.style.display = 'block'; 
 +            } 
 +        }; 
 +        this.Box.onclick = thisObject.hideNotice; 
 +        this.start(); 
 +    } 
 +/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
 +    show the cookie notice if needed 
 +~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ 
 +    new CookieNotice('CookieNotice'); 
 +</file> 
 +Jetzt fehlt nur noch die Optik. Dazu wird die nachfolgende CSS-Datei einfach als letztes CSS im **<head>** eingebunden. 
 +<file css CookieNotice.css> 
 +/** ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
 + * 
 + * CookieNotice.css 
 + * 
 + * @category     Template 
 + * @copyright    Manuela v.d.Decken <manuela@isteam.de> 
 + * @author       Manuela v.d.Decken <manuela@isteam.de> 
 + * @license      http://www.gnu.org/licenses/gpl.html   GPL License 
 + * @version      0.0.1 
 + * @lastmodified 19.09.2015 
 + * @since        File available since 04.07.2015 
 + * @description  switch off the cookie notice for n days 
 +    (by default after 7 days the cookie will be removed again) 
 +~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ 
 + 
 +/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
 +    format the cookie notice 
 +~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ 
 +#CookieNotice { 
 +    box-sizing: border-box; 
 +    position: fixed; 
 +    left: 0; top: 0; right: 0; bottom: 0; 
 +    padding: 15px; 
 +    background-color: rgba(120, 120, 120, 0.6); 
 +    display: none; 
 +    z-index: 9999; 
 +
 +#CookieNoticeBar { 
 +    position: relative; 
 +    top: 30%; 
 +    background-color: rgba(244,239,195,0.8); 
 +    text-align: center; 
 +    color: #777; 
 +    font-size: 0.9em; 
 +    padding: 6px 4px; 
 +    border-radius: 6px; 
 +    border: solid 1px red; 
 +
 +#CookieNoticeClose { 
 +    float:right; 
 +    background: #ff0000; 
 +    color: #ffffff; 
 +    font-weight: bold; 
 +    width: 1.525em; 
 +    cursor: pointer; 
 +    border-radius: 4px; 
 +
 +#CookieNoticeInfo {} 
 +/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ 
 +</file> 
 + 
 +??? ..nächste Frage 
 +!!! ..nächste Antwort
design/snippets.1442672084.txt.gz · Zuletzt geändert: 19.09.2015 14:14 von Manuela v.d.Decken