Wordpress Chat and Video Embeds

Preface: I’ve looked through various coding examples of how to implement twitch’s chat and video embeds into the site both on twitch and wordpress.

here is the testing ground that i’m using to eventually make a proper page that doesn’t use shortcode (which worked on the home page for site)

tests were done for embeds, html code, and for generic codes on the site. None worked.
I will attach screenshots as well as full list of codes tried.


https://www.twitch.tv/ninja25dre

twitch test code block

<script src= "https://player.twitch.tv/js/embed/v1.js"></script>
<div id="<player div ID>"></div>
<script type="text/javascript">
  var options = {
    width: <400>,
    height: <400>,
    channel: "<Ninja25Dre>",
    parent: ["ninja25dre.wordpress.com"]
  };
  var player = new Twitch.Player("<player div ID>", options);
  player.setVolume(0.5);
</script>

https://player.twitch.tv/?channel=ninja25dre

iframe test

<iframe src="https://player.twitch.tv/?channel=ninja25dre&parent=www.example.com" frameborder="0" allowfullscreen="true" scrolling="no" height="378" width="620"></iframe>

test code

<script src="http://player.twitch.tv/js/embed/vs.js"><script>

<div id="mystream">
</div>

<script type="text/javascript">
 var options = {
  width: 300
  height: 250
  channel: "Ninja25Dre",
  parent: ["ninja25dre.wordpress.com"]
  //video: "<video ID>",
  //collection: "<collection ID>",
];
var player = new Twitch.Player("mystream", options);
player.setVolume(.5);
</script>

test html

container test

.container {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%;
}
.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
<div class="container">
<iframe class="responsive-iframe" src="https://player.twitch.tv/?<Ninja25Dre>&parent=ninja25dre.wordpress.com"></iframe>
</div>​

chat tests

html

code

<iframe src="https://www.twitch.tv/embed/Ninja25Dre/chat?parent=ninja25dre.wordpress.com"
        height="700"
        width="700">
</iframe>

video

end


sorry, i really don’t have a great idea of what i was doing wrong and why things weren’t loading

So the problem here is taht no where did you manage to get HTML code to actually render.

You’ve tried a number of plugins to no avail.

The problem here is that you are using a wordpress.com blog that doesn’t support doing what you are trying to do.

This is a Wordpress Problem.

You got it working using a shortcode plugin so use that. Thats likely the only solution to wordpress.com hosted blogs due to it’s limitations

1 Like

thank you very much Barry for the reply; I was losing my mind trying every style of coding possible to make it work :frowning: only on the home, recommended, does it work but that’s with short code unfortunately. for those wanting to make sure their code works then -

[twitchtv url=“Twitch”]
works^
as well as
[twitchtv url=“Twitch” width=“600” height=“400” autoplay=“true” muted=“false”]

with Twitch being replaced by your channel’s full link

if you have any site recommendations for such an idea, please let me know, ty

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.