Embed a scratch 3.0 project

mpdmonster

I am making a website with all my scratch projects. I believe flash will slow my website down so I would like to embed them using scratch 3.0. Anyone know how to do this?

Killernotch101

You can’t embed any projects in Scratch 3.0 yet, but you can embed them in Sulfurous!

mpdmonster

Does it run on flash? @Killernotch101

mpdmonster

Also it ruins my project. Goes to fast.

Smolec

The program Sulfurous doesn't work for Scratch 3.0

JGames101

You can use the scratch 3 embeddable projects by adding /embed to the end of a project url, or you can use my tool, Scratch Silicon, to embed a Scratch 3 Project in a website: https://scratch.mit.edu/discuss/topic/330317, which has a few more features than the regular embeddable projects.

Last edited by JGames101 (Jan. 6, 2019 01:16:58)

Programing_God

I have found the solution after hours of trying; this works with the latest version of Scratch, Scratch 3.0.

Step 1:
Go to the project page of your game; look at it's URL, and add embed to the end of it (e.g. https://scratch.mit.edu/projects/276955447/ changes to https://scratch.mit.edu/projects/276955447/embed).

Step 2:
Hopefully, your website editor or maker allows you to upload html to it – if not, you are out of luck. Copy this iframe:

<iframe allowtransparency=“true” width=“485” height=“402” src=“link goes here” frameborder=“0” allowfullscreen></iframe>

Remember that link you just made in Step 1? Replace the “link goes here” portion with that link (e.g. <iframe allowtransparency=“true” width=“485” height=“402” src="https://scratch.mit.edu/projects/276955447/embed“ frameborder=”0" allowfullscreen></iframe>).

Step 3:
Load your website. Your Scratch 3.0 game should be working (e.g. https://Poppo-The-Bird–mushakushi.repl.co)!

Note: Since Scratch 3.0 is rather new – and buggy at times – you may have to refresh your page a couple of times before it works.
Did you know that the example link is a legitimate game? Go check it here (it's the least you can do….)!

I hope this helps!

EDIT: This has been tested to work with repl.it and Notepad. Although I can not guarantee it will work for everything, it should work for most other platforms – save for mobile. If this solution does not work, check out the other posts that comment on this issue!

Last edited by Programing_God (Oct. 18, 2019 13:10:16)

mpdmonster

Thank you so much!

JGames101

mpdmonster wrote:
Thank you so much!

If you want the project to work on mobile devices, Programming_God's solution won't work. Try Scratch Silicon to support that. Otherwise, their solution is great.

Beamy68Animates

Programing_God wrote:
I have found the solution after hours of trying; this works with the latest version of Scratch, Scratch 3.0.

Step 1:
Go to the project page of your game; look at it's URL, and add embed to the end of it (e.g. https://scratch.mit.edu/projects/276955447/ changes to https://scratch.mit.edu/projects/276955447/).

Step 2:
Hopefully, your website editor or maker allows you to upload html to it – if not, you are out of luck. Copy this iframe:

<iframe allowtransparency=“true” width=“485” height=“402” src=“link goes here” frameborder=“0” allowfullscreen></iframe>

Remember that link you just made in Step 1? Replace the “link goes here” portion with that link (e.g. <iframe allowtransparency=“true” width=“485” height=“402” src="https://scratch.mit.edu/projects/276955447/embed“ frameborder=”0" allowfullscreen></iframe>).

Step 3:
Load your website. Your Scratch 3.0 game should be working (e.g. https://Poppo-The-Bird–mushakushi.repl.co)!

Note: Since Scratch 3.0 is rather new – and buggy at times – you may have to refresh your page a couple of times before it works.
Did you know that the example link is a legitimate game? Go check it here (it's the least you can do….)!

I hope this helps!

Unfortunetly, It bugs out and comes up with a 404 error screen

DancingLine

Finally, after a few days of searching. I finally found the embed link in GitHub from this https://github.com/LLK/scratch-www/issues/1661

The code is this:
<!DOCTYPE html><html><head><title>Embed</title></head><body> <iframe allowtransparency=“true” width=“485” height=“402” src=“//scratch.mit.edu/projects/embed/<INSERT PROJECT ID HERE>/?autostart=false” frameborder=“0” allowfullscreen></iframe></body></html>

For example the code is like this for Google Sites
<!DOCTYPE html><html><head><title>Embed</title></head><body> <iframe allowtransparency=“true” width=“485” height=“402” src=“//scratch.mit.edu/projects/embed/199839521/?autostart=false” frameborder=“0” allowfullscreen></iframe></body></html>

I hope this works, *sigh*

Spike_Mace_12342

Why can't they work for weeblys?

byu2008

they don't work on google sites on a school account, at least

Filereq

Killernotch101 wrote:
You can’t embed any projects in Scratch 3.0 yet, but you can embed them in Sulfurous!

you can, embedding is hidden

Try yourself:
1. Add “/embed” to the URL
2. Copy it
3. Create a HTML frame with this URL
4. There you go!

(on google sites it's easier)

DancingLine

Spike_Mace_12342 wrote:
Why can't they work for weeblys?

I didn't try it in Weebly, I just trying it on Google Sites.

frodewin-test

This code

<div style="overflow: hidden; height: 480px; width: 640px;" >
    <iframe style="margin-top:-50px; margin-left:-11px;" scrolling="no" allowtransparency="false" width="658" height="536" bgcolor=#220000 src="https://scratch.mit.edu/projects/284133924/embed/" allowfullscreen></iframe>
    <br/><br/>
</div>

should do the trick. Replace “284133924” with your project's number.

I don't know how to add autostart though (see my other post)

L0LW0T

Killernotch101 wrote:
You can’t embed any projects in Scratch 3.0 yet, but you can embed them in Sulfurous!

text
You CAN embed projects in Scratch. Just
add embed/ to the project page.
end

LeoTurnbull

frodewin-test wrote:
This code
<div style="overflow: hidden; height: 480px; width: 640px;" >
    <iframe style="margin-top:-50px; margin-left:-11px;" scrolling="no" allowtransparency="false" width="658" height="536" bgcolor=#220000 src="https://scratch.mit.edu/projects/284133924/embed/" allowfullscreen></iframe>
    <br/><br/>
</div>
should do the trick. Replace “284133924” with your project's number.

I don't know how to add autostart though (see my other post)

Thank you SO MUCH! That was the only one that worked for me!!

PhoenixLondon2008

frodewin-test wrote:
This code
<div style="overflow: hidden; height: 480px; width: 640px;" >
    <iframe style="margin-top:-50px; margin-left:-11px;" scrolling="no" allowtransparency="false" width="658" height="536" bgcolor=#220000 src="https://scratch.mit.edu/projects/284133924/embed/" allowfullscreen></iframe>
    <br/><br/>
</div>
should do the trick. Replace “284133924” with your project's number.

I don't know how to add autostart though (see my other post)

Umm… In google sites it just pops open a box that says “Google Gadget”. Or am I clicking the wrong button?

messyteach

frodewin-test - that works - all the others do not! Thanks!

Discuss Scratch