Twitch Embedded Player Updates in 2020

OMG I swear I tried that lol, but it worked like a charm this time. Thanks for taking the time to walk us all through this, we obviously picked WIX because we thought we could take the easy way out, and we should have known better… lol

Thanks again! You saved my user pages!

why does it appear super tiny?

The link I have works:

https://player.twitch.tv/?channel=cruzectrl&parent=djcruzectrl.com&parent=www.djcruzectrl.com&parent=www-djcruzectrl-com.filesusr.com

but when I put it into iframe I get the grey error box on my website:

www.djcruzectrl.com/dj-stream

works fine here

oohh i guess i should have tested it published lol i see it works on my end now thanks

Tried to get this to work on www.stm-church.com, but it is not working.

Your website is not over SSL is required.
Aside from that, your code is correct.

2 posts were merged into an existing topic: The great big “I’m using WIX/SomeWebsiteMaking Tool and I don’t know how to fix my embed” thread

The implementation of the new code worked so far for me. However, adjusting the volume in the embedded player has not worked since then. Previously, I had the following code, which I have now adjusted as follows after the change:

<p><iframe src="https://player.twitch.tv/?volume=1.00&amp;channel=radio_paralax&parent=www.radio-paralax.de" width="700" height="394" frameborder="0" scrolling="no"></iframe></p>

However, this does not change the volume, as before the change - The volume control remains in the middle at 50%, but I want it to be 100%. That worked before June 10, 2020.

Oh yes, what is the exact difference between a non-interactive stream that is integrated via iFrame as in my case and an interactive stream with JavaScript? What are the exact differences and advantages or disadvantages? Is there a good reason why you should definitely use an interactive stream? Somehow I can’t figure it out.

Hi Berry,
Unfortunately I have no idea how this works and how I use the source code correctly. Firefox blocks twitch. My website is edvonschleck.streamers.site … I tried it with www and without it. Maybe it is possible for you or someone else me to get the right code for copy & paste?
thank you

Your website is not available over HTTPS. SSL is required.

Then your player URL will be

https://player.twitch.tv/?channel=iiedvonschleckii&parent=edvonschleck.streamers.site

No one, who can admit the problems which I have described?

It’s an issue that twitch might need to look at, so you’ve not had an answer because it was the weekend.

You know have THREE posts on THREE threads. Please keep it to your separate thread that you started for the issues

1 Like

Thanks for your really quick answer but I set frameborder = “0” allowfullscreen = “true” scrolling = “no” height = “378”> behind your text I get website blocked again

Your website needs to be on

https://edvonschleck.streamers.site/

But it redirects to

http://edvonschleck.streamers.site/

So it works the way I have it on my website only with a https connection, I don’t have it and therefore the player no longer works?

Correct, embeds on live website,s have to be on websites over SSL

Thank you so I have to contact my web support

Hi everyone, as the purpose of this topic was to announce embed changes, we’re going to close it for further comments. However, I’m going to include many of the tips that were discussed above that helped resolved many issues. Please review these items for troubleshooting before opening a new topic. Thank you!

Top troubleshooting tips

  • Make sure you have SSL enabled for your website, this is required for embeds to function (i.e. When going to your site, “https://” is in the URL)
  • Do not include “https://” as part of the parent value
  • You cannot use wildcards as a parent value. For example, parent=*.example.com is not valid
  • Does your site allow or need “www.” in the URL? If specifying just your domain name isn’t working (e.g. parent=example.com) you may need to add a second parent value to specify the domain with “www.” if visitors can view your website this way as well. For example,
<iframe src="https://player.twitch.tv/?channel=twitchpresents&parent=example.com&parent=www.example.com" />

Wix websites

  • Make sure to include three parent values; your site’s domain, your site’s domain with “www,” and your site’s subdomain from filesusr.com. Here’s an example if I was embedding the TwitchPresents channel on my website example.com:
<iframe src="https://player.twitch.tv/?channel=twitchpresents&parent=example.com&parent=www.example.com&parent=www-example-com.filesusr.com" />

Squarespace websites

  • Make sure SSL is enabled (Settings->Advanced->SSL and select “Secure”)
  • Include your domain and the Squarespace subdomain. Here’s an example if I was embedding the TwitchPresents channel on my website example.com:
<iframe src="https://player.twitch.tv/?channel=twitchpresents&parent=example.com&parent=example.squarespace.com" />

Local development

  • Use “localhost” or “127.0.0.1” as the parent value to use either HTTP or HTTPS in local development. Any port can be used, though this does not need to be specified anywhere (80, 3000, 8100, etc)

Embed in a local file

  • Since a domain is required, embedding Twitch in a file and opening it in a browser such that the URL begins with “file://” will not succeed

Mobile development

  • Will update this comment with more information

Election apps

  • Will also update this comment with more information as it seems Electron apps typically use origin: "file://"
3 Likes