Giter VIP home page Giter VIP logo

ive-read-this's Introduction

I've Read This

An example plugin developed to demonstrate how to include Ajax operations in the frontend of WordPress.

For users who are logged in, the plugin will display a checkbox at the bottom of each post that will allow them to mark a post as read. If the post has been marked as read, the user will simply see a label noting such.

Installation

FTP

  1. Extract the plugin to a directory on your computer (it should be called ive-read-this)
  2. Upload to your wp-content/plugins directory

WordPress Dashboard

  1. Navigate to the 'Plugins' menu
  2. Click on 'Add New'
  3. Click on 'Upload'
  4. Locate the plugin's zip file on your computer
  5. Upload and install

Changelog

1.0 (September 17th, 2012)

  • Initial release.

ive-read-this's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

ive-read-this's Issues

doesn't work?

Hi, that Plugin is exactly what i need.

I installed it and activated it.
But if i check the checkbox, nothing happens. And if i refresh the Post the checkbox is again unchecked.

would be really happy if you could provide some small support...

Add another Checkbox wich calls the function mark_as_unread

Hi, I'm trying to add another Checkbox, that calls the php func mark_as_unread. But can't get it work properly.

(function ($) {
    $(function () {

        // If the "I've Read This Container" is on this page, let's setup the event handler
        if(1 === $('#ive-read-this-container').length) {

            // We use the change attribute so that the event handler fires
            // whenever the checkbox or its associated label is clicked.
            $('input[name="ive-read-this"]').change(function (evt) {
                alert("markiere als gelesen.");

                // We can retrieve the ID of this post from the <article>'s ID. This will be required
                // so that we can mark that the user has read this particular post and we can hide it.
                var sArticleId, iPostId;

                // Get the article ID and split it - the second index is always the post ID in twentyeleven
                sArticleId = $("article").attr('id');
                iPostId = parseInt(sArticleId.split('-')[1]);

                // Initial the request to mark this this particular post as read
                $.post(ajaxurl, {

                    action:     'mark_as_read',
                    post_id:    iPostId

                }, function (response) {
                    console.log(response);
                    // If the server returns '1', then we can mark this post as read, so we'll hide the checkbox
                    // container. Next time the user browses the index, this post won't appear
                    if (1 === parseInt(response)) {

                        $('#ive-read-this-container').slideUp('fast');

                    // Otherwise, let's alert the user that there was a problem. In a larger environment, we'd
                    // want to handle this more gracefully.
                    } else {

                        alert("There was an error marking this post as read. Please try again.");

                    } // end if/else

                });

            });
        // We use the change attribute so that the event handler fires
        // whenever the checkbox or its associated label is clicked.
        $('input[name="unread"]').change(function (evt) {
            alert("markiere als ungelesen.");

            // We can retrieve the ID of this post from the <article>'s ID. This will be required
            // so that we can mark that the user has read this particular post and we can hide it.
            var sArticleId, iPostId;

            // Get the article ID and split it - the second index is always the post ID in twentyeleven
            sArticleId = $("article").attr('id');
            iPostId = parseInt(sArticleId.split('-')[1]);

            // Initial the request to mark this this particular post as unread
            $.post(ajaxurl, {

                action:     'mark_as_unread',
                post_id:    iPostId

            }, function (response) {
                    console.log(response);
                    // If the server returns '1', then we can mark this post as read, so we'll hide the checkbox
                    // container. Next time the user browses the index, this post won't appear
                    if (1 === parseInt(response)) {

                        $('#ive-read-this-container').slideUp('fast');

                    // Otherwise, let's alert the user that there was a problem. In a larger environment, we'd
                    // want to handle this more gracefully.
                    } else {

                        alert("There was an error marking this post as unread. Please try again.");

                    } // end if/else

                });
            });

        } // end if

    });
}(jQuery));
    public function mark_as_unread() {

        // First, we need to make sure the post ID parameter has been set and that's it's a numeric value
        if( isset( $_POST['post_id'] ) && is_numeric( $_POST['post_id'] ) ) {

            // If we fail to update the user meta, respond with -1; otherwise, respond with 1.
            echo false == update_user_meta( wp_get_current_user()->ID, $_POST['post_id'], 'ive_unread_this' ) ? "-1" : "1";

        } // end if

        die();

    } // end mark_as_unread

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.