Skip to content

Commit dc7b707

Browse files
committed
Test: fix md
1 parent 725c8bb commit dc7b707

File tree

1 file changed

+11
-11
lines changed

1 file changed

+11
-11
lines changed

content/arduino-cloud/04.cloud-editor/embedding-create-iframes/embedding-create-iframes.md

+11-11
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ description: 'Learn about different methods when embedding your sketches in a we
44
author: 'Karl Söderby'
55
---
66

7-
The Cloud Editor is a great tool for creating and uploading programs while also collecting all of your sketches in one place. Another great feature is embedding them as iframes, such as articles, blogposts or journals.
7+
The Cloud Editor is a great tool for creating and uploading programs while also collecting all of your sketches in one place. Another great feature is embedding them as iframes, such as articles, blogposts or journals.
88

99
To embed an iframe is very easy, and we just need to copy and paste a link from our sketch in the Cloud Editor. But we can also do a series of modifications to that iframe, and in this tutorial we will take a look at how to do that.
1010

@@ -24,7 +24,7 @@ It should look something like this:
2424

2525
This iframe can now simply be embedded in a HTML page, and it will look like this:
2626

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>
2828

2929
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!
3030

@@ -39,7 +39,7 @@ To do this, we just need to add the following code to the end of the URL:
3939
```
4040
The result is the following:
4141

42-
<iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=embed&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=embed&snippet" style="height:510px;width:100%;margin:10px 0" frameborder="0"></iframe>
4343

4444
And the full URL should look like this:
4545

@@ -58,7 +58,7 @@ Next is the highlighting feature. To use this, simply add the following lines to
5858

5959
The result is that line 3 and 4 are highlighted:
6060

61-
<iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=embed&snippet#L3-L4" style="height:510px;width:100%;margin:10px 0" frameborder=0></iframe>
61+
<iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=embed&snippet#L3-L4" style="height:510px;width:100%;margin:10px 0" frameborder="0"></iframe>
6262

6363
And the full URL should look like this:
6464

@@ -74,37 +74,37 @@ You can highlight as many lines as you want, and it is easily configurable. For
7474

7575
## Manually changing the size of your widget
7676

77-
If we want to change the size of the widget, we just need to modify the dimensions of the iframe.
77+
If we want to change the size of the widget, we just need to modify the dimensions of the iframe.
7878

7979
The following dimensions are default:
8080

8181
```markup
82-
style="height:510px;width:100%;margin:10px 0"
82+
style="height:510px;width:100%;margin:10px 0"
8383
```
8484

8585
But we can change them up a bit:
8686

8787
```
88-
style="height:200px;width:50%;margin:10px 0"
88+
style="height:200px;width:50%;margin:10px 0"
8989
```
9090

9191
Which will look like this:
9292

93-
<iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=embed&snippet" style="height:200px;width:50%;margin:10px 0" frameborder=0></iframe>
93+
<iframe src="https://app.arduino.cc/sketches/examples?eid=01.Basics%2FBlink&view-mode=embed&snippet" style="height:200px;width:50%;margin:10px 0" frameborder="0"></iframe>
9494

95-
## Automatically re-sizing your sketches
95+
## Automatically re-sizing your sketches
9696

9797
We can also choose to automatically re-size our iframes. This is simply done by first including this script in your HTML file:
9898

9999
```markup
100100
<script src="https://content.arduino.cc/assets/arduinoSketchIframeResizer.js"></script>
101101
```
102102

103-
And then using the class `arduino-sketch-iframe` in your HTML element.
103+
And then using the class `arduino-sketch-iframe` in your HTML element.
104104

105105
## Summary
106106

107-
There are several cool ways of working with iframes from the Cloud Editor, and it is a really easy process that requires very little coding.
107+
There are several cool ways of working with iframes from the Cloud Editor, and it is a really easy process that requires very little coding.
108108

109109
The Cloud Editor helps you keep track on all of your sketches, and with the iframes, including your projects on other pages has never been easier.
110110

0 commit comments

Comments
 (0)