• what i want to do is add a button/image that when clicked will
    close the thickbox.

    I see where the regular image/x calls the tb_remove function in thickbox.js

    I can add images/buttons etc no problem to the thickbox window, where i want (which is right next to add to gallery / save crop rotation changes

    I just cannot figure out how to make it call the close function when
    the image/button is pressed.

    any ideas?

Viewing 7 replies - 1 through 7 (of 7 total)
  • See Settings -> Media -> Embeds -> Auto-embeds. Tick the box labelled “When possible, embed the media content from a URL directly onto the page. For example: links to Flickr and YouTube.”

    Thread Starter digibucc

    (@digibucc)

    thank you

    that is/was checked, but from my understanding that will allow you to embed media into a post/page … how does that affect what i am trying
    to do?

    Sorry – wrong post tab! 🙁

    With regard to the correct original question, why are you trying to add a close graphic to thickbox when there’s already one in there by default?

    Thread Starter digibucc

    (@digibucc)

    because it will be used by a lot of people, without tutoring or first hand experience.

    if the tutorial just says close, or click the x, some people will click the X to close ie/ff, not to close the thickbox.

    And the whole point is simplicity, so i can’t complicate the
    tutorial.

    Thread Starter digibucc

    (@digibucc)

    got it, thank you 🙂

    just adding this where i want it closes the thickbox:

    <a href="#" onclick="self.parent.tb_remove();return false">close</a>

    In the ZenLite theme, I’ve addressed this by means of the link title attribute:

    <div class="main-img"><a class="thickbox" title="<?php the_title(); ?> <?php  _e('(press ESC to close)','zenlite');?>" href="<?php echo wp_get_attachment_url($post->ID); ?>"><?php echo wp_get_attachment_image( $post->ID, 'large' ); ?></a></div>

    This places a message (“press ESC to close”) at the top of the thickbox which also provides important information for non-mouse users (eg sighted keyboard navigators). I also load theme-specific CSS via the functions.php file:

    if ( !function_exists( 'zenlite_thickbox_style' ) ) :
    function zenlite_thickbox_style() {
    	$css_file = get_stylesheet_directory() . '/thickbox.css';
    	$css_url = get_stylesheet_directory_uri() . '/thickbox.css';
    	if ( file_exists($css_file) && ( is_attachment() || has_post_format('image')) ) {
    		wp_register_style('zenlite-thickbox-style', $css_url, '', '', 'screen');
    		wp_enqueue_style('zenlite-thickbox-style');
    	}
    }
    endif;
    add_action('wp_print_styles', 'zenlite_thickbox_style');

    and correct a known issue in thickbox’s image path:

    if( !function_exists ('zenlite_load_tb_fix') ) :
    function zenlite_load_tb_fix() {
    	if( is_attachment() ) ?><script type="text/javascript">tb_pathToImage = "'<?php echo home_url();?>/wp-includes/js/thickbox/loadingAnimation.gif";tb_closeImage = "<?php echo home_url();?>/wp-includes/js/thickbox/tb-close.png";</script>
    	<?php
    }
    endif;
    add_action('wp_footer', 'zenlite_load_tb_fix');

    Try those out and see if they help.

    Thread Starter digibucc

    (@digibucc)

    thank you, my next step was to add similar instructions at the top of the thickbox 🙂

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Additional button to close image thickbox’ is closed to new replies.