Question

我正试图在我们的网站上找到一个'好看的'欧盟cookie法律旗帜。

对于那些不知道的人。在英国和欧洲，使用cookie的网站必须告诉用户。我看了几个WP插件，但它们都非常干扰设计。

我正在使用自己的WP Boostrap主题。在导航栏上方有一个带有子行div的容器div。

当用户使用数据切换数据目标点击按钮时，我隐藏了子行div。

这在此处的代码中显示（因为它位于导航上方，此代码显示在每个页面上。

<div id="container-topline" class="container-fluid bg-moderateblue" style="min-height:2px;">
    <div id="row-cookie" class="row" style="padding-top:10px; padding-bottom:10px;">
        <div class="col-md-1 col-xs-hidden"></div>
        <div class="col-md-10 col-sm-12">
            <div class="col-sm-10 col-xs-12">
                <ul class="fa-ul" style="color:#FFF; font-size:small;">
                <li>
                <i class="fa fa-exclamation-triangle fa-li fa-2x" aria-hidden="true"></i>
                <strong>Privacy &amp; Cookies:</strong> This website uses cookies to improve your experience and to provide essential functionality. By continuing to use this website your consent is implied. To view our privacy policy <a href="#" style="font-weight:bold; color:#FFF;"> click here</a>.
                </li>
                </ul>
            </div>
            <div class="col-sm-2 col-xs-12" style="text-align:center;">           
                <button class="btn btn-default col-md-pull-right" data-toggle="collapse" data-target="#row-cookie">
                <i class="fa fa-times" aria-hidden="true"></i> Close Message
                </button>
            </div>
        </div>
        <div class="col-md-1 col-xs-hidden"></div>
    </div>
</div>

到目前为止一切顺利。但是，它意味着在每个页面上用户必须关闭该消息。有点烦人，它需要关注网站。

我想要的是一种方式（这就是我被困住的地方）在关闭后24小时隐藏＃row-cookie。

这可能吗？你有什么tutotrial推荐指导我吗？

我认为可能是一个Cookie，但我看过他们在Stack Overflow上使用它们的一些例子，他们非常坦率地让我感到困惑！

所有帮助都非常有用:)！

Answer 1

当用户关闭横幅时，请通过Ajax设置cookie。使用jQuery，它就像做：

一样简单

jQuery(#row-cookies .fa-times).click(
    jQuery.get("http://link-to-php-file.php");
});

对于PHP文件，只需在主题目录中创建一个（确保使用child theme，如果您还没有这样做！）

然后在PHP文件中执行：

<?php 
// Set a cookie to expire in 24 hours
setcookie("closed-cookies", "true", time()+60*60*24, "/");

现在，在您的模板文件中，您只需在打印之前查看cookie是否已设置。

<?php
if(isset($_COOKIE['closed-cookies'])) :
?>

// Cookie banner

<?php
endif;
?>

Answer 2

!(document.cookie.split(";").forEach(function(elem){
   var key = elem.split("=")[0];
   var value = elem.split("=")[1];
   if(key == "privacyRead" && value == "true"){
     // code to hide the div
     document.getElementById("container-topline").style.display = "none"; 
   } 
}))

现在只需在隐私接受按钮上添加一个onclick处理程序，它将处理cookie设置内容document.cookie = "privacyRead=true;" + "expires=" + new Date(new Date().getTime() + 60*1000*60*24) + hideDiv，你就完成了

我以为你没有使用任何框架。

在页面加载时，脚本的第一部分将检查是否存在cookie，如果为true则将隐藏您的div。在cookie设置部分，我们将添加1天的到期时间，因此cookie明天不会在那里。

可能吗？隐藏基于cookie的div（创建欧盟Cookie法律横幅）

2 个答案: