Add javascript when post is published

2 Views

I am trying to add javascript when a post has been published so that it’s more noticable for my user but I can’t figure out what to use.
I tryed with publish_post and save_post, but it doesn’t work unless I put die; at the end of the code.
I’ve tryed so hard to stay out of the wordpress core code, and I really don’t want to have to because of this problem…
here’s my code : 

function run_when_post_published($post_ID){
    echo '<script type="text/javascript">
        alert("essai");
    </script>';
}
add_action('publish_slider', 'run_when_post_published');

Thanks for your help !

Post Views: 2

Related posts

Leave a Reply

3 comments

  1. To enqueue scripts on the admin side, you should use the admin_enqueue_scripts hook. In this callback I check that are on the appropriate page (i.e. the page where you edit posts / post types), using the passed $hook argument.

    Optionally you can check if the post is of a specific type (in case this is only for posts, pages, or a cpt).

    Finally we’ll borrow WordPress’ in-built notice system. This produces the ?message=1. The value 1-10 determines the notice message. (See @Azizur’s answer for this relationship).

    In this example, we only enqueue our javascript if the message variable is set.

    We then enqueue our script, (which I’ve assumed is located: [theme-folder]/js/notice.js (alternatively point this to your plug-in folder). Then we ‘localise’ it with wp_localise_script. What this means is the value of message will be available in our javascript file as a property of the global object wpsePost (in particular wpsePost.message). You can then do whatever according to its value.

    add_action( 'admin_enqueue_scripts', 'wpse50770_add_admin_scripts', 10, 1 );
function wpse50770_add_admin_scripts( $hook ) {
    global $post;

    //Only need to enque script on the post.php page
    //Optional: restirct by post type
    if ( 'post.php' == $hook  && 'post' == $post->post_type && isset($_GET['message']) ) {     
        $message_id = absint( $_GET['message'] );
        wp_enqueue_script(
            'wpse-notice',
            get_template_directory_uri() . '/js/notice.js',
            array('jquery')
        );
        $data = array( 'Message' => $message_id);
        wp_localize_script( 'wpse-notice', 'wpsePost', $data );
    }
}

    Then create the notice.js:

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

    if( wpsePost.Message == 6 ){
        alert('Post published');

    }else if( wpsePost.Message == 1 ){
        alert('Post updated');
    }

});

  2. Here is an example of how you can have custom message for custom post_type ‘book’. Note the array index 6 “Book Published”.

    //add filter to ensure the text Book, or book, is displayed when user updates a book 

function codex_book_updated_messages( $messages ) {
  global $post, $post_ID;

  $messages['book'] = array(
    0 => '', // Unused. Messages start at index 1.
    1 => sprintf( __('Book updated. <a href="%s">View book</a>'), esc_url( get_permalink($post_ID) ) ),
    2 => __('Custom field updated.'),
    3 => __('Custom field deleted.'),
    4 => __('Book updated.'),
    /* translators: %s: date and time of the revision */
    5 => isset($_GET['revision']) ? sprintf( __('Book restored to revision from %s'), wp_post_revision_title( (int) $_GET['revision'], false ) ) : false,
    6 => sprintf( __('Book published. <a href="%s">View book</a>'), esc_url( get_permalink($post_ID) ) ),
    7 => __('Book saved.'),
    8 => sprintf( __('Book submitted. <a target="_blank" href="%s">Preview book</a>'), esc_url( add_query_arg( 'preview', 'true', get_permalink($post_ID) ) ) ),
    9 => sprintf( __('Book scheduled for: <strong>%1$s</strong>. <a target="_blank" href="%2$s">Preview book</a>'),
      // translators: Publish box date format, see http://php.net/date
      date_i18n( __( 'M j, Y @ G:i' ), strtotime( $post->post_date ) ), esc_url( get_permalink($post_ID) ) ),
    10 => sprintf( __('Book draft updated. <a target="_blank" href="%s">Preview book</a>'), esc_url( add_query_arg( 'preview', 'true', get_permalink($post_ID) ) ) ),
  );

  return $messages;
}
add_filter( 'post_updated_messages', 'codex_book_updated_messages' );

    You might be able to use the same hook to echo your JavaScript message, but I would not recommend doing it.

    1. Add a filter to add the javascript to your admin head

    add_filter('admin_head', 'my_custom_alert')

    Then add the custom alert by getting the query var which wordpress adds to the query string when a page has been saved

    function my_custom_alert(){

    echo "<script type='text/javascript'>

jQuery(function($){

var $_GET = {};

document.location.search.replace(/??(?:([^=]+)=([^&]*)&?)/g, function () {
    function decode(s) {
        return decodeURIComponent(s.split("+").join(" "));
    }

    $_GET[decode(arguments[1])] = decode(arguments[2]);
});

if($_GET['message'] == '1'){

alert('this page has been updated');

}


});

</script>";

}