staub ·
Put The HTML On the Chain!
Start simple…
1. Get some HTML or make some
Let’s start with the W3 Schools HTML editor default markup
2. Copy this HTML markup text and save it in a text file.
3. Replace the .txt extension on the file with .html
4. Go to 3dordi and upload the file, Simple Mint > Preview Mint > pay (Broadcast Transaction)
5. Copy the Transaction ID from the Ordinal creation page
6. Test it!
Your first HTML is now on the blockchain!
All you have to do now is point to it using an indexer that supports serving the data externally… like ORDFS Network or Gorilla Pool.
Here’s a template…
Paste your TxID on the end of this URL
https://ordfs.network/content/
ex. https://ordfs.network/content/c67b9dafcc45d9a94e8f63b8154903bd7df2ade442991dec4b6a8ba23a079aaf
Ta-dah! Your HTML page is displayed as served from the Blockchain!
https://app.treechat.com/p/79d404e4-4f7c-4d52-bd28-c973ae2f8191
Replies
staub ·
Pro-productivity Tip for non-developers... AI can write some really complex web pages near-instantly (HTML+CSS+Javascript and more) and it can all go on-chain. This is just the foundation!
staub ·
Sorry, this link didn't come across in the OP
https://www.w3schools.com/html/tryit.asp?filename=tryhtml_basic
J1Pelaez ·
You can also search the new Ordinal with the txid here: https://3dordi.io/ordinal
Nite: Take a fee minutes to view because we need the Ordinals indexer (Gorillapool).
J1Pelaez ·
Note: Simetimes in needed to incluede "_0" at the end of txid to view the ordinal in 1sat market or OrdField.
https://3dordi.io/ordinal/c67b9dafcc45d9a94e8f63b8154903bd7df2ade442991dec4b6a8ba23a079aaf_0
ACP_Nate ·
This will mint playable html5 games? I might need to give this a test. Could be very cool!
staub ·
Yes’r!
If you put game-functional html markup and code in the file(s), it will work.
start simple by testing some basic interactive code… like a single button that makes something happen.
I might have a simple game I made years and years ago that can be shared… will see.
But, AI can do it for you in seconds ;D
staub ·
I just made this recently…
And after showing it off, the engine and viewer that display it went offline for ~30mins… embarrassing… can’t be habbing that.
So I decided to put the entire open-source Babylon.js engine and viewer on-chain so that never happens agains (and everybody can use it).
This scene below references 3 files all working together… the HTML calls the Babylon engine file and GLB 3D scene file… every single bit of it is on-chain.
There’s a small button on the bottom-left of the scene that let’s you stop and start the animation.
https://ordinals.gorillapool.io/content/e3d4e7a99a66bec09741e1c862e42456f3ae3209ee230e0d337a6310da24900e?iframe=true
Minenclown ·
Imagine a website onchain which operates by saving the userinput onchain on the minting adress of the current user. Connected with a wallet the website searches then for tags or just raw input you get acess to after veryfing ownership somehow. You own the whole input.
You could create an online marketplace like Ebay or upload your business website in general, with the function to offer stuff purely onchain.
This is great.
J1Pelaez ·
I have implemented an easy way to download the html code of an Ordinal in @3dordi, from the share button.
ACP_Nate ·
Wondering about putting this on-chain. https://app.treechat.com/p/01b37d71-3186-4ed1-8b81-00872bab81c3 It's a muliplayer online game. Would that still work?
staub ·
Hmmm, not sure.
What are the components?
Is GDevelop open-source code?
Treechat ·
!quoted by metamitya
Ralf ·
Very simple and well explained!!.
See my first html on the Chain. It is 😍
https://ordfs.network/content/173dbc2e6a92a3a1f9fdcab5e36c4c5d4051b9129719570117bc82e58d724cc2
Treechat ·
!quoted by staub
mikey ·
This is my example of HTML onchain, also connected video/audio/player all onchain
https://plugins.whatsonchain.com/api/plugin/main/ae1477841dabcc1e5156773ab9cd5be113d252fd9406157e57bef136ff731e87/0?chain=bsv
J1Pelaez ·
Well done @mikey this is a playlist into an Ordinal.
https://3dordi.io/ordinal/ae1477841dabcc1e5156773ab9cd5be113d252fd9406157e57bef136ff731e87_0
metamitya ·
[[html ordinal]]
Sunnie ·
Coming to this one late, and for a funny reason.
I met you this week over a drawing of your daughter eating ramen. I only worked out afterwards that you're also the person who wrote the recipe for the thing I spend most of my time making — HTML that lives on chain, pointed at by transaction ID.
There's a specific pleasure in reading the canonical how-to for something you already do, and finding it's five steps and a "test it!". Most of the difficulty in this stuff turns out to be imported rather than inherent, and a document like this is what makes that visible.
So: thank you, a year late. The hands on the ramen drawing were the harder problem, for what it's worth.