Discuss Scratch
- Discussion Forums
- » Advanced Topics
- » Scratch Silicon: Embed Scratch 3 Projects In Your Site
- JGames101
- Scratcher
100+ posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
The Scratch Embedder is not visible in the Scratch UI (it does exist if you enter /embed at the end of a project url), so I created an embeddable site for Scratch 3 projects. I made something similar a year ago, but it doesn't work anymore and relied on embedding a specific portion of https://llk.github.io/scratch-gui, which now has fullscreen, small stage, and so much more that would mess it up. This new version is a fork of scratch-gui, with all UI elements other than the fullscreen player removed. The player, in fullscreen, adapts to the screensize, so it will work in an iframe of any size. Currently, it functions just like a fullscreen scratch 3 project, but more features will be added in the future.
How-To
In your page, simply add an iframe or object with a source of https://jamesbmadden.github.io/scratch-silicon/#project id
For example, you could add
The width and the height can be anything you want, as the page is fully responsive.
Why Use This Over The Official Embeddable Pages?
Current Issues
Missing Features
Because Scratch Silicon is a fork of scratch-gui, which does not contain certain features, the following features are unvailable in Scratch Silicon:
Version History
How-To
In your page, simply add an iframe or object with a source of https://jamesbmadden.github.io/scratch-silicon/#project id
For example, you could add
<iframe src="https://jamesbmadden.github.io/scratch-silicon/#276660763" width="480px" height="480px" allowFullscreen></iframe>
The width and the height can be anything you want, as the page is fully responsive.
Why Use This Over The Official Embeddable Pages?
- Scratch's Embed pages can't be used on a mobile device, but Silicon can. That means it works in WebView!
- Scratch Silicon Supports Fullscreen (Supported, but In Progress)
Current Issues
- Fullscreen Does Not Change the Size of the Stage.
Missing Features
Because Scratch Silicon is a fork of scratch-gui, which does not contain certain features, the following features are unvailable in Scratch Silicon:
- Cloud Variables
Cloud variables should not be a huge issue since they are already unavailable to any new scratcher anyway.
Version History
- v0.2.1: Viewport meta tag added to work better in WebViews on mobile and Sprites can no longer be dragged
- v0.2.0: Test Fullscreen Added
- v0.1.0: Initial Test Release
Last edited by JGames101 (Feb. 3, 2019 01:51:07)
- JGames101
- Scratcher
100+ posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
That's a bug I noticed a little while ago. I'll add it to the issues list and work on a fix. It's because it's a fork of the editor, and in the editor, every sprite is draggable, and I'm not properly setting fullscreen the way that the buttons would. Why is every sprite draggable no matter what project I view?
- JGames101
- Scratcher
100+ posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
I fixed the issue Why is every sprite draggable no matter what project I view?
- dillonbarnes
- Scratcher
37 posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
You can also use this website to embed scratch projects
https://phosphorus.github.io/
https://phosphorus.github.io/
Last edited by dillonbarnes (Jan. 7, 2019 10:36:34)
Creator of:
Mobile-Friendly Studio
Coolest Scratch Projects studio
micro:bit Studio
New Scratchers studio
Please join to help others!
dillonbarnes
- Sheep_maker
- Scratcher
1000+ posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
Won't work with 3.0 projects because it's a 2.0 thing You can also use this website to embed scratch projects
https://phosphorus.github.io/
- Sheep_maker This is a kumquat-free signature. :P
This is my signature. It appears below all my posts. Discuss it on my profile, not the forums. Here's how to make your own.
.postsignature { overflow: auto; } .scratchblocks { overflow-x: auto; overflow-y: hidden; }
- Wettining
- Scratcher
500+ posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
Would Phosphorus++ work?Won't work with 3.0 projects because it's a 2.0 thing You can also use this website to embed scratch projects
https://phosphorus.github.io/
- JGames101
- Scratcher
100+ posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
No, Phosphorus++ still seems to be unable to load Scratch 3 projects.Would Phosphorus++ work?Won't work with 3.0 projects because it's a 2.0 thing You can also use this website to embed scratch projects
https://phosphorus.github.io/
- ethajenn
- New Scratcher
4 posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
You could almost make a hosting site where you enter project ID, make the specs such as whether the sprites are draggable and such, and make a very basic HTML embed generator. If you put it on a google site or something, the cost would be nothing, just some HTML time.
- frodewin
- Scratcher
500+ posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
No, Phosphorus++ still seems to be unable to load Scratch 3 projects.Would Phosphorus++ work?Won't work with 3.0 projects because it's a 2.0 thing You can also use this website to embed scratch projects
https://phosphorus.github.io/
Phosphorus and Sulfurous only work with Scratch 2.0 projects, but projects that have not been changed since the 3.0 transition are still in 2.0 format. So old projects can be embedded with them.
Moreover, I just found out, that it is still possible to make and upload 2.0 projects with the Scratch 2.0 offline editor. A project which I just uploaded loaded and played well in Sulfurous.
- physix
- Scratcher
8 posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
It doesn't work anymore ?
- Varan40
- Scratcher
1 post
Scratch Silicon: Embed Scratch 3 Projects In Your Site
Yes, today it was stop… 404
404 There isn't a GitHub Pages site here
This link is working sometimes: https://jamesbmadden.github.io/scratch-silicon/#283224933 but game from this project dos't work: https://play.google.com/store/apps/details?id=com.wKliker_8473773
404 There isn't a GitHub Pages site here
This link is working sometimes: https://jamesbmadden.github.io/scratch-silicon/#283224933 but game from this project dos't work: https://play.google.com/store/apps/details?id=com.wKliker_8473773
- JGames101
- Scratcher
100+ posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
Replace thejamesbm in your URL with jamesbmadden, and it will work fine. The app uses the old URL. Yes, today it was stop… 404
404 There isn't a GitHub Pages site here
This link is working sometimes: https://jamesbmadden.github.io/scratch-silicon/#283224933 but game from this project dos't work: https://play.google.com/store/apps/details?id=com.wKliker_8473773
Last edited by JGames101 (Feb. 3, 2019 18:25:22)
- pms2010
- Scratcher
1 post
Scratch Silicon: Embed Scratch 3 Projects In Your Site
@JGames101… Thanks for the embed info. I'm a teacher and have spent all day looking for some documentation on how to embed in 3.0. I couldn't find anything. I don't need the speed, just the /embed
tks
tks
Last edited by pms2010 (Feb. 5, 2019 21:17:04)
- komakao
- New Scratcher
4 posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
The file is located on Scratch official website and embed it as projectID.
Can I upload a Scratch 3.0 file and embed the file?
Can I upload a Scratch 3.0 file and embed the file?
Last edited by komakao (Feb. 7, 2019 01:33:35)
- JGames101
- Scratcher
100+ posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
Not in the current version, but that feature could definitely be implemented. The issue is still allowing you to embed an uploaded file on a page, and how the data would be stored (data URL? Seems like the only real option). I'll work on it. The file is located on Scratch official website and embed it as projectID.
Can I upload a Scratch 3.0 file and embed the file?
Last edited by JGames101 (Feb. 9, 2019 00:24:15)
- komakao
- New Scratcher
4 posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
https://llk.github.io/scratch-gui/develop/compatibility-testing.html#201793794
I found this page can embed a project on scratch official site by projectID.
I guess there may be some way to embed a local file by using the lib.min.js but I've got no one to solve it.
https://llk.github.io/scratch-gui/develop/lib.min.js
I found this page can embed a project on scratch official site by projectID.
I guess there may be some way to embed a local file by using the lib.min.js but I've got no one to solve it.
https://llk.github.io/scratch-gui/develop/lib.min.js
- redware
- Scratcher
6 posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
JGames101 - that is great. On my mobile though it is difficult to press the green button - is there an autostart option ?
http://www.redware.com/scratch-test-01.html
http://www.redware.com/scratch-test-01.html
Last edited by redware (Feb. 9, 2019 16:36:53)
- MinecraftWin98
- Scratcher
28 posts
Scratch Silicon: Embed Scratch 3 Projects In Your Site
Yep, having options for autostart and removing the top bar with the flag and stop icons would be pretty sweet. Nice work!
My name is John, I've been using Scratch since 1.4 was the latest version, and now I'm a college kid studying Electrical Engineering. Even though I am learning much more advanced languages, I still have a lot of fun working with Scratch.
- makakulka
- Scratcher
1 post
Scratch Silicon: Embed Scratch 3 Projects In Your Site
komakao, thank you very much!!! https://llk.github.io/scratch-gui/develop/compatibility-testing.html#
- Discussion Forums
- » Advanced Topics
- » Scratch Silicon: Embed Scratch 3 Projects In Your Site