• edzah

    (@bloofood)


    This is a duplicate of my Stack Overflow question. If you prefer to answer there please do.

    I want to create a plugin that has a widget that includes a ‘copy to clipboard’ button to copy a string to the user’s clipboard. The most basic zeroclipboard functionality is listed on their page:

    <html>
        <body>
                <script type="text/javascript" src="ZeroClipboard.js"></script>
    
                <div id="d_clip_button" style="border:1px solid black; padding:20px;">Copy To Clipboard</div>
    
                <script language="JavaScript">
                        var clip = new ZeroClipboard.Client();
                        clip.setText( 'Copy me!' );
                        clip.glue( 'd_clip_button' );
                </script>
        </body>
        </html>

    So to convert this functionality into a widget I tried this (note: I had no problems with installing and registering the plugin, just this functionality):

    function widget( $args, $instance ) {
    extract( $args );
    $title = apply_filters( 'widget_title', $instance['title'] );
    ?>
    
    <?php
    echo $before_widget;
    ?>
    
    <?php
      if ($title) {
    echo $before_title . $title . $after_title;
      }
    ?>
    
    <div class="my_textbox">
        <div id="d_clip_button" style="border:1px solid black; padding:20px;">Copy To Clipboard</div>
    </div>
    
     <?php
       echo $after_widget;
     ?>

    As you can see all the widget does is display the button div for copying. I didn’t know where to add the javascript so I put the enqueue script at the top of the plugin.php file:

    add_action('wp_head', 'wp_bitcoin_donations', 15);
    wp_register_script( 'zeroclipboard', WP_PLUGIN_URL . '/bitcoin-donations-plugin/zeroclipboard.js' );
    wp_enqueue_script( 'zeroclipboard' );

    And the rest in the widget initialisation section:

    add_action( 'widgets_init', 'BitcoinDonationsWidgetInit' );
    function BitcoinDonationsWidgetInit() {
      register_widget( 'BitcoinDonationsWidget' );
      ?>
      <script language="JavaScript">
        var clip = new ZeroClipboard.Client();
        clip.setText( 'Copy me!' );
        clip.glue( 'd_clip_button' );
      </script>
      <?php
    }
    ?>

    The glue function does not seem to be working. Any ideas what I am doing wrong? Do I need to use the jquery on page ready to make sure my div is loaded before I run the glue function on it? I think it might be a problem with this load order.

The topic ‘getting zeroclipboard (javascript flash) to work in a wordpress plugin’ is closed to new replies.