Jump to content
  • 0

Change play.html to show image instead of "Stream will start" text


Philip Campbell
 Share

Question

Is it possible to change LiveApp play.html to show a logo I've created instead of the text "Stream will start automatically when it is live"?  I have the image in JPG and PNG formats saved in the images folder.  When I've tried replacing text with the HTML <img src="images/logo.png"> command it just shows a box with an x for a moment then is over written by the JavaScript innerHTML code  with the text again.  When I've  the JavaScript I still only get the box as if it cannot find the image.  Is there another way to do this?  I'm not great at HTML and no little to nothing about JavaScript.

Thanks for any help

Philip Campbell 
Link to comment
Share on other sites

  • Answers 3
  • Created
  • Last Reply

Top Posters For This Question

3 answers to this question

Recommended Posts

  • 0
Hi Philip,

You have to delete to cut the connection of the div that is enclosing that text for after hearing that the stream has not started the javascript adds it to that div. Deleting or changing div solves it but rather than that, I encourage you to modify js. All you have to do is modify this line

document.getElementById("video_info").innerHTML="Stream will start playing automatically<br/>when it is live";

To something like this:

document.getElementById("video_info").innerHTML="<img src=\"https://antmedia.io/wp-content/uploads/2020/01/Ant-Media__web-1.png\" alt=\"Ant Media\">";

to include your picture instead. You can check document methods of javascript, modifying an HTML div is not a hard task but feel free to ask for help. By the way, do not forget to escape the quotes in src

Best,
Asim

Link to comment
Share on other sites

  • 0
Asim,

That seems to partially work.  I've referenced the image, but since the image was designed to use the entire space used by the play.html when it is imbedded into my site it offsets the image.  I tired modifying the player.css file to remove the centering and spacing, but that did not help.  Any way I can get it to not offset the image?

Thanks

Philip  
Link to comment
Share on other sites

  • 0
Ok, I think I figured it out.  I had to remove the following from player.css under #video_info:

position:relative;
top:30%;
height:100%

After clearing my cache it seems to work and fill the entire box now.  I also changed the body background color to match my site/image background as well.

Thanks for all of your help.

Philip
Link to comment
Share on other sites

 Share

×
×
  • Create New...