Writing Snapblocks

On the Snap! forum, block code must be inserted between the [snapblocks]...[/snapblocks] bbcode tags, while on the Snap! Wiki, they can be inserted between <snapblocks>...</snapblocks> tags. Scripts can also be inserted inline between [sb]...[/sb] or <sb>...</sb> tags to avoid breaking lines.

Basic Syntax

Snapblocks tries to match the code you write as close as possible. The block text is only used to find the correct color.

The basic syntax of the Block Plugin is as follows:

Code	Use	Example	Result
block name	a block	erase all
(var)	variable or reporter	(x position)
<predicate>	predicate block	<shown?>
block name { c-shape }	c-shape block	if <> { }
[text]	string input	say [Hello!]
(12.34)	number input	wait (0.5) seconds
(item v) [item v]	editable dropdown	(item (1 v) of @list) (split [Hello world!] by [ v])
(item V) [item V]	read-only dropdown	(read-only (item V)) switch to costume [costume1 V]
[#hex] [rgb(r, g, b)]	color input	set pen color to [#911a44] set pen color to [rgb(145, 26, 68)]
<> <t> <f> <true> <false>	boolean input	if <<> and <<t> or <f>>> { set [on V] to <<true>> set [off V] to <<false>> }
{+ custom + block +} :: define	Define custom blocks. See Custom Blocks.	{+ custom + block + } :: define
// comment /* multiline comment */	comment	show // now you see me hide /* now you don't */
...	a placeholder block	if <(var) = [this]> { ... }
((upvar))	Create upvar	script variables ((a)) @addInput

Advanced Syntax

The following is some more in-depth syntax of snapblocks.

Override	Use	Example	Result
:: [override ...]	Add overrides to blocks. See Block Overrides	custom :: motion hat
({} @addInput) ({} @>)	Grey rings. See Rings	({} @addInput) ({} @>)
@icon $icon	Icons such as @greenFlag. See Icons	when @stopSign clicked :: control hat
$[icon OR text]-[scale]-[r]-[g]-[b]	Change the icon scale and color. This is the same syntax used in Snap! See Icon properties	$storage-2 @pipette-0.5-0-255-0 $text-1.5-255-0-0
[[Italic input]]	Create italic text in inputs.	(item ([last] v) of @list)
[`code`]	Create monospace code input	(JavaScript function \( @addInput \) \{ [`console.log('JavaScript code')`] \}
[{Long text input}]	Create bigger text input	(first word of [{}] :: operators)
[multiline input]	Create a multiline text input	(multiline [multiline text] :: operators)
\	A backslash can be used to escape characters that are part of the syntax.	say [hello \[ world \]]
multiline \ block	Create multiline block	multiline \ block :: looks
(multiline reporter)	Multiline reporter	(multiline reporter)
<multiline predicate>	Multiline predicate	<multiline predicate>
loop { } @loop	Add loop arrow after c-shape	do while <> { ... } @loop :: control

Block Overrides

Block overrides allow you to override block properties, such as category and shape.

Syntax:

:: [override ...]

Categories

All the categories in snap can be used.

Category	Result
motion
looks
sound
pen
control
sensing
operators
variables
lists
other
obsolete

However you can also use the Scratch categories and extensions

Category	Result
events
list
grey / gray
custom
extension
music
video
tts / text2speech
translate
wedo / wedo2
ev3
microbit
makeymakey
gdxfor
boost

If you wish to use a custom category color, that's possible in two different ways, #hex or rgb(r, g, b)

custom :: #3a5f75
custom :: rgb(255, 100, 50)

Block shapes

There are more block shapes than just (reporters) and <predicates>, however they're not created in the same way, they're created with block overrides.

Shape	Result
command / stack
reporter
ring
predicate / boolean
hat
condition
cap
cat

Santa Hats

For Christmas 2024, santa hats were added to Snap! temporarily, which added picture relating to Christmas on hat blocks. These can also be created in snapblocks using the santa override.

when flag clicked :: santa when [space V] key pressed :: santa when I am [clicked V] :: santa when <> :: santa when <> :: santa condition when I receive [ V] @addInput :: santa when I start as a clone :: santa when [anything V] is edited @addInput :: santa when slot [ V] signals [menu V] :: santa {custom} :: define+ santa {custom :: santa} :: define+ santa

As you can see, each hat block has its own hat, but you can still use any hat you want.

Hat	Result
santa-hat
santa-trumpet
santa-star
santa-candles
santa-advent
santa-gift
santa-present
santa-pretzel
santa-letter
santa-train
santa-house
santa-gingerbread
santa-gingerbread-house

Other overrides

There are more overrides that can be used.

Override	Use	Example	Result
reset	Reset all default block formatting.	forever { } :: reset
local	Sprite-only (local) block	block :: local

Rings

Creating grey rings is very simple.

Ring	Result
({} @addInput)
(() @addInput)
(<> @addInput)
({...} input names: ((#1)) @delInput @addInput)

Icons

Icons can be created by using @ or $ followed by the icon name, for Example, @greenFlag.

List of icons

Icon	Result
greenFlag
flag
stopSign
stop
octagon
turnLeft
turnRight
clockwise
counterclockwise
loop
loopArrow
addInput
delInput
verticalEllipsis
list
pointRight
turtle
turtleOutline
pause
cloud
cloudGradient
cloudOutline
flash
blitz
camera
circleSolid
circle
ellipse
notes
storage
brush
pipette
paintbucket
bucket
eraser
location
gears
gearPartial
gearBig
globe
globeBig
square
robot
stepForward
file
fullScreen
grow
normalScreen
shrink
smallStage
normalStage
stage
turnAround
poster
tick
checkedBox
rectangle
rectangleSolid
dot
line
cross
crosshairs
speechBubble
speechBubbleOutline
turnBack
turnForward
magnifyingGlass
magnifierOutline
selection
polygon
closedBrush
footprints
keyboard
keyboardFilled
listNarrow
flipVertical
flipHorizontal
trash
trashFull
cube
cubeSolid
infinity
arrowUp
arrowUpOutline
arrowUpThin
arrowDown
arrowDownOutline
arrowDownThin
arrowLeft
arrowLeftOutline
arrowLeftThin
arrowRight
arrowRightOutline
arrowRightThin
arrowUpDownThin
arrowLeftRightThin

Icon Shortcuts

Since @delInput @verticalEllipsis @addInput is a very common set of icons to use, there is also a shortcut to add those.

@<:>

These can be used in any order and however many you want.

@<: @:><>>>

Icon properties

There are some icon properties you can set, scale and color. This uses the same syntax found in Snap!.

This can be used by adding -[scale]-[r]-[g]-[b] after the icon name. For example

@flag-2-0-0-0
$pipette-1.7-135-0

If you use $, you can type any text, and that text will be used instead of an icon.

$text-2-0-135-90

Custom Blocks

Custom blocks in Snap! are defined with a special kind of block, called a block prototype. These can be created in snapblocks using a system that mimics what they look like in Snap!.

{+ custom + block +} :: define

However it can be cumbersome to write in all the pluses and hope you didn't forget one, so you can also use define+ to automatically add them in.

{custom block} :: define+

You can also change the shape, category, and add a definition script.

{($flash assoc ((key)) ((a-list)) :: lists)} :: define+
report ($blitz find first item (<(key) = (item (1 v) of @list) @<:> > @>) in (a-list))

Blocks are also automatically set to the category defined in the block prototype.

{(replace every ((pattern = t)) with ((other = sh)) in ((text = tower top)) :: operators local)} :: define+
report (combine (split (text) by (pattern)) using ((join [] (other) [] @<:>) @>))

(replace every [t] with [sh] in [tower top])