@@ -19,12 +19,12 @@ Then, we need to have a code. In this tutorial, we are just going to use the goo
19
19
It should look something like this:
20
20
21
21
``` markup
22
- <iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=embed" style="height:510px;width:100%;margin:10px 0" frameborder=0 ></iframe>
22
+ <iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=embed" style="height:510px;width:100%;margin:10px 0" frameborder="0" ></iframe>
23
23
```
24
24
25
25
This iframe can now simply be embedded in a HTML page, and it will look like this:
26
26
27
- <iframe src =" https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=embed " style =" height :510px ;width :100% ;margin :10px 0 " frameborder =0 ></iframe >
27
+ <iframe src =" https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=embed " style =" height :510px ;width :100% ;margin :10px 0 " frameborder =" 0 " ></iframe >
28
28
29
29
But there are many ways we can modify the iframe to look different. So let's take a look the available modifications we can make!
30
30
@@ -39,12 +39,12 @@ To do this, we need to change `view-mode=` from `embed` to `snippet` at the end
39
39
```
40
40
The result is the following:
41
41
42
- <iframe src =" https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet " style =" height :510px ;width :100% ;margin :10px 0 " frameborder =0 ></iframe >
42
+ <iframe src =" https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet " style =" height :510px ;width :100% ;margin :10px 0 " frameborder =" 0 " ></iframe >
43
43
44
44
And the full URL should look like this:
45
45
46
46
``` markup
47
- <iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet" style="height:510px;width:100%;margin:10px 0" frameborder=0 ></iframe>
47
+ <iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet" style="height:510px;width:100%;margin:10px 0" frameborder="0" ></iframe>
48
48
```
49
49
50
50
## Highlighting specific lines
@@ -57,12 +57,12 @@ Next is the highlighting feature. To use this, simply add the following lines to
57
57
58
58
The result is that line 6 and 7 are highlighted:
59
59
60
- <iframe src =" https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet&highlight=L6,7 " style =" height :510px ;width :100% ;margin :10px 0 " frameborder =0 ></iframe >
60
+ <iframe src =" https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet&highlight=L6,7 " style =" height :510px ;width :100% ;margin :10px 0 " frameborder =" 0 " ></iframe >
61
61
62
62
And the full URL should look like this:
63
63
64
64
``` markup
65
- <iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet&highlight=L6,7" style="height:510px;width:100%;margin:10px 0" frameborder=0 ></iframe>
65
+ <iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet&highlight=L6,7" style="height:510px;width:100%;margin:10px 0" frameborder="0" ></iframe>
66
66
```
67
67
68
68
You can highlight as many lines as you want, and it is easily configurable. For example, if we want to highlight line 4 and 6-9, we simply need to add the following to the URL:
@@ -81,11 +81,11 @@ It's also possible to only show specific lines by adding the `scope` parameter,
81
81
82
82
The result is that only lines 3 to 30 are shown.
83
83
84
- <iframe src =" https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet&scope=L3-L30 " style =" height :510px ;width :100% ;margin :10px 0 " frameborder =0 ></iframe >
84
+ <iframe src =" https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet&scope=L3-L30 " style =" height :510px ;width :100% ;margin :10px 0 " frameborder =" 0 " ></iframe >
85
85
86
86
The full URL should look like this:
87
87
``` markup
88
- <iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet&scope=L3-L30" style="height:510px;width:100%;margin:10px 0" frameborder=0 ></iframe>
88
+ <iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet&scope=L3-L30" style="height:510px;width:100%;margin:10px 0" frameborder="0" ></iframe>
89
89
```
90
90
91
91
## Hide Numbers
@@ -98,7 +98,7 @@ To hide the line numbers in the embedded snippet, add the `&hide-numbers` parame
98
98
99
99
The full URL should look like this:
100
100
``` markup
101
- <iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet&scope=L3-L30&hide-numbers" style="height:510px;width:100%;margin:10px 0" frameborder=0 ></iframe>
101
+ <iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet&scope=L3-L30&hide-numbers" style="height:510px;width:100%;margin:10px 0" frameborder="0" ></iframe>
102
102
```
103
103
104
104
## Manually changing the size of your widget
@@ -119,7 +119,7 @@ style="height:200px;width:50%;margin:10px 0"
119
119
120
120
Which will look like this:
121
121
122
- <iframe src =" https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet " style =" height :200px ;width :50% ;margin :10px 0 " frameborder =0 ></iframe >
122
+ <iframe src =" https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=snippet " style =" height :200px ;width :50% ;margin :10px 0 " frameborder =" 0 " ></iframe >
123
123
124
124
## Automatically re-sizing your sketches
125
125
0 commit comments