Scratch

This might seem like a long topic, but trust me, you need to read it to learn ScratcHML, and it doesn't seem that long when you finish reading it! 

This is the forum post for ScratcHML, a program made in Scratch to make your own ''website'' (yeah HTML strongly in mind, I didn't use <  and > to make it different, but then I remember it BBCode! XD), but it won't go online, you can just share the code with people. Click here  to view the project.

Now, a few things you should have to start coding with ScratcHML:

  The ScratcHML project downloaded (use the link above)

  A text editor program which can save files as .txt ex: NotePad, Microsoft Office, OpenOffice, etc.,

Okay, now to start. SO first, you should know this:
an element is something like this: [scratchml] and [/scratchml]. There are more, but let's use these as an example. When you begin an element, you always start with text the element name surround by [ and ]. Then, on a new line, you make the text which you want to be displayed in the way that the element displays it. THen, on the next line you surround the element name by [/ and ]. Starting to get it? But, there are exceptions! The two tags [br] and [lbr] (we'll talk about what they mean later) are the only ones right now which you don't need to have some thing like [/br] or [/lbr]. I hope you understand elements now. 

This can actually help you with HTML, that's basically all from HTML(just the tags aren't the same, I only stole br from HTML!  ).

Okay, ready to code something in ScratcHML? Just open up the program. It should be something like this:



Now, open a text editor. I'll be using NotePad, you can use whatever program you want!

Okay, more things to remember, just 5! XD Here are all the elements in ScratcHML in the 0.1 Beta:

[scratchml] [/scratchml] Always placed at the beginning and ending of your ScratcHML files.

[title] and [/title] ALways placed after the [scratchml] tag, sets the title for your page which will appear at the top.

[p] and [/p] Makes a paragraph with text in it. You must use one of these to make text.

[br] Makes a blank line on the page.

[lbr] Makes a line on the page.


Those are all the elements. Now, if you read carefully, you always,a and I mean always place the [scratchml] element at the beginning and ending of your Scratchml files.

So go ahead and add that to the beginning of the file. Your code should look like this:

[scratchml]

Now, you need a title. On your page, the title will appear in the variable that's circled in the image:



Let's make the title test. First, press enter and go down to the second line on your text editor. Try guessing the code that you're going to type in before you look! 8)

[scratchml]
[title]
Test
[/title]

That was easy, wasn't it?    The title test will appear in that variable which I showed you the image of. If you want you can replace it with any title. The text in between the [title] and [/title] elements will appear there. All of the code must be on different lines or else it won't work.

Okay, time to move on. Lets add some text! This is how you use the [p] element. It's the only way so far to display text on your page. To use it, on a new line, write [p]. What do you think will happen next? On the next line type in the text which you want to be display on the page. Then go to the next line and type in [/p]. This is all really easy to remember, right? 

Inside the paragraph I wrote: This is a test. Pretty simple. XD You can write whatever you want. Now, your code should look something like this so far:

[scratchml]
[title]
Test
[/title]
[p]
This is a test.
[/p]

Now, the [br] element! It just makes a line break. That's just a blank line to make space in between elements. Add one to the code! You won't need a closing tag for this one.

The code should look like this:

[scratchml]
[title]
Test
[/title]
[p]
This is a test.
[/p]
[br]

Now, let's make another paragraph! You should know how now. Make it say: This is the end of this test.

The code should look like this:

[scratchml]
[title]
Test
[/title]
[p]
This is a test.
[/p]
[/br]
[p]
This is the end of this test.
[/p]

Now, the last element! The [lbr] element! It's basically a [br], just the line has ummm... an actual line in it!

Your code should look like this:

[scratchml]
[title]
Test
[/title]
[p]
This is a test.
[/p]
[br]
[p]
This is the end of this test.
[/p]
[lbr]

Okay, you're almost done! But you're missing something... think hard... you got it! (I hope!) The final [scratchml] element! Add it to your code and you're ready to go!

[scratchml]
[title]
Test
[/title]
[p]
This is a test.
[/p]
[br]
[p]
This is the end of this test.
[/p]
[lbr]
[/scratchml]

Now, how do you actually load it? Here are the steps:

1. Save the file as a .txt in a place where you can find it.
2. Open the ScratcHML project.
3. Right click the Code list.
4. Choose Import.
5. Find the file, choose it, and press ok.
6. Press the green flag and you're page will appear!


And that's it for this tutorial! I hope you like it! Since this is the first release, there aren't many elements. There won't be that many either(there will be more than this one) when the full version is released due to the list only making normal text. 

So that's all! If you need help with anything just reply to this post! And I really need suggestions on elements! if you have one please reply!


Thanks everyone!
-Mcsugarface 

Last edited by Mcsugarface (2011-06-10 21:44:14)