Astro 部落格架設筆記(7) - 使用 astro-embed 嵌入 YouTube 影片

撰寫部落格文章的時候,如果要嵌入 YouTube 影片應該要怎樣做?過往我們可能是透過 iframe 的方式來把 Youtube 影片嵌入。

而 Astro 上如果要嵌入影片,我們可以改用 astro-embed 來處理。

示意圖

首先,請留意文章的格式為 mdx 格式,原本的 md 格式沒辦法支援。

  1. 安裝套件
    npm install astro-embed
  2. 在 mdx 檔案加入以下內容
    import { Tweet, Vimeo, YouTube, LinkPreview } from 'astro-embed';
    
    <YouTube id="https://youtu.be/SWMOgOZVWP4"/>
這樣就可以嵌入 YouTube 了,除此之外還支援 Vimeo、Tweet 等其他之類的功能,可以參考 官網 的介紹。


    Blogger Comment

0 意見: