如何从PHP关闭带有cookie和到期日期的通知栏?

Cas*_*ert 6 javascript wordpress jquery-cookie

在我之前的问题中,当我发布新帖子时,我正在寻找一种在我的WordPress网站上创建通知消息的方法.经过一个很好的回答,这是非常好的.我可以更改在发布帖子之后该消息应显示多长时间的设置.当时间到期时,消息将消失.

目标

所以它工作绝对精细,特别感谢Pieter Goosen,但如果用户已经看过一次消息,我想能够关闭通知栏并确保用户不再看到它以刷新页面没有telksens返回消息,当然提供了一个新帖子再次发布.

我怎样才能做到这一点?我在想javascript.对于该功能,当然应该有一个控制关闭按钮的功能,我认为应该还有一个cookie功能,检查用户是否已关闭该消息,并在时间内检查定时器,以便两者都相互同步.

我之前可以在这里找到通知的问题:

如何计算所选帖子类型的帖子总数?

[更新]我只是坐下来尝试清除通知栏的结构,所以我简单地说,看看它是否会起作用,所以PieterGoosen的代码检查了WordPress中是否有新的帖子和显示通知栏.然后应在时间到期或用户单击关闭按钮后关闭该栏.所以代码也应该检查一下.如果用户单击关闭按钮== YES,则必须设置cookie(cookie应与PHP中设置的时间同步),因此只要有新帖子可用,它就会删除cookie.如果用户没有点击关闭按钮,那么请注意,如果时间已过期>删除cookie.

Pie*_*sen 6

我有一个解决方案.我已经尽可能多地测试了代码,我想到了尽可能多的场景.

我使用相同的代码,我已经使用这个答案这个问题的.所以我不打算再讨论那个部分

工作流程第1部分

我们将利用jquery来隐藏通知栏,以及一个有两个目的的cookie,用于保存最新的帖子ID并保持通知隐藏,直到新帖子发布或到期时间到期为止

为此,我们将使用hide()jquery中的函数在用户单击隐藏按钮时隐藏通知栏.您可以根据需要自定义此按钮或使用任何其他类型的符号.

我们现在需要使用一些方法来隐藏按钮,直到发布新帖子.这将通过在单击隐藏按钮时设置cookie来完成.Cookie会在2天后过期,因此如果在这两天内没有发布新帖子,则Cookie会自动过期.要设置cookie,我们需要下载jquery-cookie插件.当仍然设置cookie时,如果发布新帖子,此插件也会强制删除cookie.

本节严重依赖于我们设置的帖子ID new_post_notification.问题是,你不能直接将php变量传递给jquery.幸运的是,Wordpress有一个函数wp_localize_script,我们可以使用它来将帖子ID传递给jquery脚本,我们将把它作为cookie值用于它.

这是第1节的结尾,让我们得到编码

LETS CODE SECTION 1

首先,下载插件,解压缩并将jquery.cookie.js文件复制到主题的js文件夹中.接下来,在js文件夹中创建一个新文件并命名hide.notification.bar.js.打开这个新创建的文件并将以下代码粘贴到那里并保存

jQuery(document).ready(function($) {

    $("#notification_hide_button").click(function(){
        $(this).hide();
        $(".notifications_bar").hide();

        if ($.cookie( 'hide_post_cookie' ) ) { 
            $.cookie( 'hide_post_cookie', null ) 
        }
        var post_id = parseInt( cookie_Data.post_id, 10 );

        $.cookie( 'hide_post_cookie', post_id, { expires: 2, path: '/' } );

    });

});
Run Code Online (Sandbox Code Playgroud)

这是用于隐藏通知栏的代码,用于设置cookie.var post_id = parseInt( cookie_Data.post_id, 10 );将保留帖子ID,这是最重要的信息

我们现在需要注册和排队这两个js文件并将帖子ID设置为该wp_localize_script函数.打开你的functions.php并在里面粘贴以下内容.如果您wp_enqueue_scripts的主题中已经有一个钩子,只需从此处删除相关代码并将其粘贴到您的功能中

function enqueue_cookie_scripts() {

    wp_enqueue_script( 'jquery-cookie', get_template_directory_uri() . '/js/jquery.cookie.js', array( 'jquery' ), '' , true );
    wp_register_script( 'set-cookie-option', get_template_directory_uri() . '/js/hide.notification.bar.js', array( 'jquery', 'jquery-cookie'), '' , true );

    $cookie_data = array(
        'post_id' => get_option( 'new_post_notification' )->ID
    );
    wp_localize_script( 'set-cookie-option', 'cookie_Data', $cookie_data ); // this one do the magic

    wp_enqueue_script( 'set-cookie-option' );

}

add_action( 'wp_enqueue_scripts', 'enqueue_cookie_scripts' );
Run Code Online (Sandbox Code Playgroud)

您还可以复制并粘贴在new_post_notification发布新帖子时设置选项的功能.有关此代码的工作原理的参考,请在此处查看.这段代码进入functions.php

add_action( 'transition_post_status', function ( $new_status, $old_status, $post )
{
    //Check if our post status then execute our code
    if ( $new_status == 'publish' && $old_status != 'publish' ) {
        if ( get_option( 'new_post_notification' ) !== false ) {

            // The option already exists, so we just update it.
            update_option( 'new_post_notification', $post );

        } else {

            add_option( 'new_post_notification', $post );

        }
    }

}, 10, 3 );
Run Code Online (Sandbox Code Playgroud)

工作流程第2部分

我们现在已经有了jquery工作的所有内容,我们现在需要设置显示通知栏的功能,并显示隐藏按钮并删除co​​okie,如果cookie尚未过期则设置新帖子.

此代码已得到很好的评论,因此您现在将无法遵循它.这里最重要的部分是获取cookie的值,该值存储在全局变量中并可以使用$_COOKIE['hide_post_cookie'].这实际上是一个帖子ID,这将根据存储的帖子进行检查get_option( 'new_post_notification' )->ID

隐藏按钮将隐藏任何内容<div class="notifications_bar"></div>,因此您将在该div中添加通知栏.根据需要自定义.

我在函数中添加了所有代码,您可以在标题中调用,如下所示

echo get_new_post_notification_bar(); 
Run Code Online (Sandbox Code Playgroud)

第2节代码

这段代码也会进入你的functions.php

function get_new_post_notification_bar() {

    // Get the new_post_notification which holds the newest post
    $notification   = get_option( 'new_post_notification' );

    // Get the post ID saved in the cookie
    $cookie_post_ID = isset( $_COOKIE['hide_post_cookie'] ) ? (int) $_COOKIE['hide_post_cookie'] : false; 

    $output = '';
    if( false != $notification ) {

        //First check if we have a cookie, if not, show the notification bar
        // If a cookie is set, do not display the notification bar
        if( false === $cookie_post_ID ) {

            //Get the post's gmt date. This can be changed to post_date
            $post_date = strtotime( $notification->post_date_gmt );

            //Get the current gmt time
            $todays_date = current_time( 'timestamp', true );

            //Set the expiry time to two days after the posts is published
            $expiry_date = strtotime( '+2 day', $post_date );

            //Show the notification bar if the expiry date is not yet reached
            if( $expiry_date > $todays_date ) { 

                $output .= '<div class="notifications_bar">';
                $output .= 'If you click on the "Hide" button, I will disappear.';
                $output .= '</div>';
                $output .= '<button id="notification_hide_button">';
                $output .= 'Hide';
                $output .= '</button>';

            }

        }else{

            /**
             * If a cookie is set, check the cookie value against the post id set as last post
             * If the two don't match, delete the cookie and show the notification bar if a new post is published
             * This code only run once, that is when a cookie is still set, and new post is published within the time
             * in which the cookie is still set
            */ 
            if( (int) $notification->ID !== $cookie_post_ID ) {

                ?>
                    <script>
                        jQuery(document).ready(function($) {

                            $.removeCookie('hide_post_cookie', { path: '/' });

                        });
                    </script>
                <?php

                $output .= '<div class="notifications_bar">';
                $output .= 'If you click on the "Hide" button, I will disappear.';
                $output .= '</div>';
                $output .= '<button id="notification_hide_button">';
                $output .= 'Hide';
                $output .= '</button>';

            }

        }   

    }

    return $output;

}
Run Code Online (Sandbox Code Playgroud)