Shortcode jumps out to first place inside div

  • pinokio

    (@lapanwebsite)


    10 years ago

    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)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    10 years ago

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

    Thread Starter pinokio

    (@lapanwebsite)

    10 years ago

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

    Text collapse jQuery, but I fixed it.
    Thanks.

    Michael

    (@alchymyth)

    10 years ago

    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.

    Thread Starter pinokio

    (@lapanwebsite)

    10 years ago

    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.