Hello, how would you go about embedding a video or image where the chatbox goes, at the bottom if it is enabled.

Hey, I'm not 100% sure what you mean, but I'm guessing you want a custom image or video in the position that the chat would be when at the bottom of the forum. Since your profile says PunBB, that's what this will work for. Add this in Modules>Javascript Codes Management>create a new javascript>in the homepage. Also make sure Javascript Code Management is set to "Yes".

Code:

$(document).ready(function(){
  $("#pun-legend").before("<img src='http://game-craic.com/wp-content/uploads/2011/08/fm2012banner.jpg' />");
});

Replace the image URL with your's. That's just a totally random image. Here is what this achieves:




If that isn't exactly what you wanted or you aren't sure about something there then just reply and let me know.

I'm sorry, I kind of rushed that.

I'm using phpBB3 (prosilver) here is a link to the forums I need this for. xtre.4umer.net I'm planning on embedding a stream at the bottom.

Thanks for the info. I didn't know you could do that.

Spectro wrote:I'm sorry, I kind of rushed that.

I'm using phpBB3 (prosilver) here is a link to the forums I need this for. xtre.4umer.net I'm planning on embedding a stream at the bottom.

Thanks for the info. I didn't know you could do that.

It's only slightly different for phpBB3, so it's just as easy really. Instead of the code I posted above, use this:

Code:

$(document).ready(function(){
  $("#picture_legend").before("<img src='http://game-craic.com/wp-content/uploads/2011/08/fm2012banner.jpg' />");
});

The part that has this is the HTML:

Code:

<img src='http://game-craic.com/wp-content/uploads/2011/08/fm2012banner.jpg' />

You just need to replace that with the HTML of the stream. Let me know if you have any problems or need any help doing that.

Hmm Ok, doesn't seem to be happening. Here's my stream http://www.twitch.tv/xtrea

I tried the code that the share button shows.

Like this

Code:

$(document).ready(function(){
  $("#picture_legend").before("<iframe frameborder="0" scrolling="no" id="chat_embed" src="http://twitch.tv/chat/embed?channel=xtrea&amp;popout_chat=true" height="500" width="350"></iframe>");
});

From my Java skills I don't think it goes like that haha.

Spectro wrote:Hmm Ok, doesn't seem to be happening. Here's my stream http://www.twitch.tv/xtrea

I tried the code that the share button shows.

Like this

Code:

$(document).ready(function(){
  $("#picture_legend").before("<iframe frameborder="0" scrolling="no" id="chat_embed" src="http://twitch.tv/chat/embed?channel=xtrea&popout_chat=true" height="500" width="350"></iframe>");
});

From my Java skills I don't think it goes like that haha.

That iframe is of the chat on the stream. I have got the correct HTML for the stream below. The other problem was that the part .before(" ") The frameborder="0" causes that to end because the " before the 0 means that it is finished basically. You'll get what I mean below as that was horribly explained lol. Basically use ' and " or ' and " not both at the same time. The full code, which I tested on my forum and it works perfectly, is this:

Code:

$(document).ready(function(){
  $('#picture_legend').before('<object type="application/x-shockwave-flash" height="378" width="620" id="live_embed_player_flash" data="http://www.twitch.tv/widgets/live_embed_player.swf?channel=xtrea" bgcolor="#000000"><param name="allowFullScreen" value="true" /><param name="allowScriptAccess" value="always" /><param name="allowNetworking" value="all" /><param name="movie" value="http://www.twitch.tv/widgets/live_embed_player.swf" /><param name="flashvars" value="hostname=www.twitch.tv&channel=xtrea&auto_play=true&start_volume=25" /></object><a href="http://www.twitch.tv/xtrea" class="trk" style="padding:2px 0px 4px; display:block; width:345px; font-weight:normal; font-size:10px; text-decoration:underline; text-align:center;">Watch live video from xtrea on www.twitch.tv</a>');
});

That's just how I wanted it. Thanks for the help and for explaining it to me. I'm currently learning this, much appreciated!

Spectro wrote:That's just how I wanted it. Thanks for the help and for explaining it to me. I'm currently learning this, much appreciated!

That's good to hear. I only started learning very recently as well. Best of luck!