The question:
A custom shortcode i made is being forced to the top of the widget outside of the widget container. Any ideas why? This is my code…
function nktmediaplayer_func($atts) {
extract(shortcode_atts(array(
'id' => rand(1, 900),
'language' => 'en',
'playlist' => 'no',
'media' => '3381',
'height' => '480',
'width' => '640',
'style' => 'single'
), $atts));
?>
<div id="player_<?php echo $id; ?>" class="video_player"><a href="http://www.adobe.com/products/flashplayer/" rel="nofollow noreferrer noopener" rel="nofollow noreferrer noopener">Get the Flash Player</a> to see this player.</div>
<script type="text/javascript" src="https://kadampa.org/embed/apps/jwplayer.js"></script>
<script type="text/javascript">
jwplayer("player_<?php echo $id; ?>").setup({
flashplayer: "http://kadampa.org/embed/apps/player.swf",
playlistfile: "http://kadampa.org/<?php echo $language; ?>/api/video/<?php if ( 'playlist' == 'yes' ) echo 'playlist/'; ?><?php echo $media; ?>/desc",
height: "<?php echo $height; ?>",
width: "<?php echo $width; ?>",
config: "http://kadampa.org/embed/config/<?php echo $style; ?>.xml"
});
</script>
<?php
}
add_shortcode('nkt_mediaplayer', 'nktmediaplayer_func', 10);
The Solutions:
Below are the methods you can try. The first solution is probably the best. Try others if the first one doesn’t work. Senior developers aren’t just copying/pasting – they read the methods carefully & apply them wisely to each case.
Method 1
For shortcodes you have to return the output for it to be written out where the shortcode appears.
Either turn your HTML into a PHP string rather than breaking out of the PHP tags or you can use PHPs output buffering methods like so:
ob_start();
?>
<div id="player_<?php echo $id; ?>" class="video_player"><a href="http://www.adobe.com/products/flashplayer/" rel="nofollow noreferrer noopener" rel="nofollow noreferrer noopener">Get the Flash Player</a> to see this player.</div>
<script type="text/javascript" src="https://kadampa.org/embed/apps/jwplayer.js"></script>
<script type="text/javascript">
jwplayer("player_<?php echo $id; ?>").setup({
flashplayer: "http://kadampa.org/embed/apps/player.swf",
playlistfile: "http://kadampa.org/<?php echo $language; ?>/api/video/<?php if ( 'playlist' == 'yes' ) echo 'playlist/'; ?><?php echo $media; ?>/desc",
height: "<?php echo $height; ?>",
width: "<?php echo $width; ?>",
config: "http://kadampa.org/embed/config/<?php echo $style; ?>.xml"
});
</script>
<?php
$output = ob_get_contents();
ob_end_clean();
return $output;
All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0