如何在Liuyiyi的blog中插入一段demo？

blog中可以插入一些demo，交互式的demo可以让blog更具有表现力

gradio只需通过几行python代码，即可制作一个机器学习的demo，hugging face space中大多都是由gradio实现的。使用hugging face space托管我们的gradio应用，即可获得一个可以被互联网访问的demo应用。如何把gradio制作的demo放到blog页面中呢？

实现思路有二：

思路一：使用gradio的script
思路二：使用iframe

实现思路一：

以插入一段文本转视频的demo Text2Video-Zero为例, 在markdown中插入下面这段代码即可：

<script type="module" src="https://gradio.s3-us-west-2.amazonaws.com/3.23.0/gradio.js"></script>
<gradio-app space="PAIR/Text2Video-Zero"></gradio-app>

如果想插入其它的Demo只需要更改gradio-app标签中的参数，其中space是由huggingface space托管的gradio应用的名字

效果如下：

实现思路二：

也可以使用iframe，markdown中插入如下代码即可，其中src参数填写想要展示的页面的url即可。

以机器翻译marian-finetuned-kde4-en-to-fr为例

<iframe  
height=850 
width=90% 
src="https://course-demos-marian-finetuned-kde4-en-to-fr.hf.space/"  
frameborder=0  
allowfullscreen>
</iframe>

效果如下：