Skip to content

Commit c384a95

Browse files
committed
Add Wistia example to style guide
1 parent 7b064e5 commit c384a95

File tree

1 file changed

+49
-0
lines changed

1 file changed

+49
-0
lines changed

docs/contributing/style-guide.md

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1533,6 +1533,8 @@ If you need to use mouse actions to be specific, use:
15331533
15341534
## Videos
15351535
1536+
### YouTube
1537+
15361538
To embed a YouTube video on a doc:
15371539
15381540
1. Copy and paste the following code into your page (including the `import Iframe` line).
@@ -1596,3 +1598,50 @@ import Iframe from 'react-iframe';
15961598

15971599
</TabItem>
15981600
</Tabs>
1601+
1602+
### Other video types
1603+
1604+
You can use similar coding to embed videos from other vendors than YouTube. Following is example coding to embed videos from Wistia.
1605+
1606+
<Tabs
1607+
className="unique-tabs"
1608+
defaultValue="Markdown"
1609+
values={[
1610+
{label: 'Markdown', value: 'Markdown'},
1611+
{label: 'Result', value: 'Result'},
1612+
]}>
1613+
1614+
<TabItem value="Markdown">
1615+
1616+
```html
1617+
<Iframe url="https://fast.wistia.net/embed/iframe/yebz0v90tx?web_component=true&seo=true&videoFoam=false"
1618+
width="854px"
1619+
height="480px"
1620+
id="wistiaVideo"
1621+
className="video-container"
1622+
display="initial"
1623+
position="relative"
1624+
allow="autoplay; fullscreen"
1625+
allowfullscreen
1626+
/>
1627+
```
1628+
1629+
</TabItem>
1630+
<TabItem value="Result">
1631+
1632+
<Iframe url="https://fast.wistia.net/embed/iframe/yebz0v90tx?web_component=true&seo=true&videoFoam=false"
1633+
width="854px"
1634+
height="480px"
1635+
id="wistiaVideo"
1636+
className="video-container"
1637+
display="initial"
1638+
position="relative"
1639+
allow="autoplay; fullscreen"
1640+
allowfullscreen
1641+
/>
1642+
</TabItem>
1643+
</Tabs>
1644+
1645+
:::note
1646+
Typically you must include `import Iframe from 'react-iframe';` with the markdown. It is not included in the example above because it was already called in the previous markdown for YouTube.
1647+
:::

0 commit comments

Comments
 (0)