WordPress.org

Support

Support » How-To and Troubleshooting » Shortcode jumps out to first place inside div

Shortcode jumps out to first place inside div

  • Lets take simple example:

    function foobar_func( $atts ){
    	return "foo and bar";
    }
    add_shortcode( 'foobar', 'foobar_func' );

    This will work nice.

    But this, when you need to call an javascript inside shortcode:

    function foobar_func( $atts ){ ?>
    <?php echo $content; ?>
    <script type="text/javascript">
    ......
    </script>
    <?php }
    add_shortcode( 'foobar', 'foobar_func' );

    The second one will jump to first place inside div.
    And it is needed to call jquery or javascript inside.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator Andrew Nevins

    @anevins

    Forum moderator

    Why do you need the JavaScript code itself to be inside a particular <div>?

    Why do you need the JavaScript code itself to be inside a particular <div>?

    Text collapse jQuery, but I fixed it.
    Thanks.

    do not use ‘echo‘ in shortcodes.

    http://codex.wordpress.org/Shortcode_API

    Any string returned (not echoed) by the shortcode handler will be inserted into the post body in place of the shortcode itself.

    do not use ‘echo’ in shortcodes.

    Thanks, alchymyth.

    I made shortcode this way, hope it’s ok:

    function text( $atts, $content = null ) {
    	return '<a class="more-text" style="float: right;" href="#lapan">Više</a>
    <div class="text" style="display: block; margin-left: 160px; height: 20px; overflow: hidden; width: 70%;">'.$content.'</div>
    <div style="display:none;">
    <script type="text/javascript">
    jQuery(\'.more-text\').click(function() {
        if(jQuery(\'.text\').css(\'height\') != \'20px\'){
            jQuery(\'.text\').stop().animate({height: \'20px\'}, 200);
            jQuery(this).text(\'Vise\');
        }else{
            jQuery(\'.text\').css({height:\'100%\'});
            var xx = jQuery(\'.text\').height();
            jQuery(\'.text\').css({height:\'28px\'});
            jQuery(\'.text\').stop().animate({height: xx}, 400);
            jQuery(this).text(\'Manje\');
        }
    });
    </script>
    </div>';
    }
    add_shortcode( 'text', 'text' );
Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Shortcode jumps out to first place inside div’ is closed to new replies.
Skip to toolbar