> ## Documentation Index
> Fetch the complete documentation index at: https://wb-21fd5541-docs-1917.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

> W&B Reports를 Notion에 직접 삽입하거나 HTML IFrame 요소를 사용해 삽입합니다.

# 리포트 삽입하기

<div id="html-iframe-element">
  ## HTML iframe 요소
</div>

리포트 오른쪽 상단의 **Share** 버튼을 선택합니다. 모달 창이 나타납니다. 모달 창에서 **Copy embed code**를 선택합니다. 복사한 코드는 Inline Frame (IFrame) HTML 요소 안에서 렌더링됩니다. 원하는 iframe HTML 요소에 복사한 코드를 붙여넣습니다.

<Note>
  임베드하면 **public** Reports만 볼 수 있습니다.
</Note>

<Frame>
  <img src="https://mintcdn.com/wb-21fd5541-docs-1917/8VD6VPTVGvajJ-Nt/images/reports/get_embed_url.gif?s=e6d427e036a97ea56608e972e46bb9f1" alt="임베드 코드 가져오기" width="1425" height="721" data-path="images/reports/get_embed_url.gif" />
</Frame>

<div id="confluence">
  ## Confluence
</div>

다음 애니메이션은 Confluence의 IFrame 셀 안에 리포트 직접 링크를 삽입하는 방법을 보여줍니다.

<Frame>
  <img src="https://mintcdn.com/wb-21fd5541-docs-1917/8VD6VPTVGvajJ-Nt/images/reports/embed_iframe_confluence.gif?s=6f7e7e6565af745b64a4587fe3df87a5" alt="Confluence에 임베드하기" width="1425" height="721" data-path="images/reports/embed_iframe_confluence.gif" />
</Frame>

<div id="notion">
  ## Notion
</div>

아래 애니메이션은 Notion의 Embed 블록과 리포트의 임베드 코드를 사용해 Notion 문서에 리포트를 삽입하는 방법을 보여줍니다.

<Frame>
  <img src="https://mintcdn.com/wb-21fd5541-docs-1917/8VD6VPTVGvajJ-Nt/images/reports/embed_iframe_notion.gif?s=db822d60717146988e6f2e62e9e7a4c4" alt="Notion에 임베드하기" width="1425" height="738" data-path="images/reports/embed_iframe_notion.gif" />
</Frame>

<div id="gradio">
  ## Gradio
</div>

`gr.HTML` 요소를 사용해 Gradio Apps에 W\&B Reports를 임베드하고, 이를 Hugging Face Spaces에서 사용할 수 있습니다.

```python theme={null}
import gradio as gr


def wandb_report(url):
    iframe = f'<iframe src={url} style="border:none;height:1024px;width:100%">'
    return gr.HTML(iframe)


with gr.Blocks() as demo:
    report = wandb_report(
        "https://wandb.ai/_scott/pytorch-sweeps-demo/reports/loss-22-10-07-16-00-17---VmlldzoyNzU2NzAx"
    )
demo.launch()
```

##