> ## Content Index
> Fetch the complete content index at: https://www.bramadams.dev/llms.txt
> Use this file to discover other available public pages before exploring further.

# How To Add Clickable Thumbnail Youtube Videos to ChatGPT
- URL: https://www.bramadams.dev/how-to-add-youtube-videos-to-chatgpt/
- Published: 2024-02-10T06:27:04.000Z
- Updated: 2024-02-12T05:51:04.000Z
- Description: quick tip!
- Author: Bram Adams
- Tags: chatgpt, ai, tutorials, #u-bg-feature-image, #u-color-text-light

0:00 

/0:16 

1× 

First, get the thumbnail image for your video from: 

```markdown
http://img.youtube.com/vi/YOUR_YOUTUBE_VIDEO_ID/0.jpg
```

Next, get the URL for the video you'll be using, e.g.:

```markdown
https://www.youtube.com/watch?v=4SkDCpguusM
```

Then, follow this format (Github flavored Markdown): 

```markdown
[![your_text_describing_video](thumbnail_image_url)](youtube_video_url)
```

Here's the full prompt I used in the example GPT above:

```markdown
on start show the following embed yt video: 

[![Watch the video](http://img.youtube.com/vi/4SkDCpguusM/0.jpg)](https://www.youtube.com/watch?v=4SkDCpguusM)
```

## Extra Tip

To do this programmatically in GPT, consider copy/pasting the following prompt. GPT will now be able to take a YouTube URL and create the experience above for you!

***Note: This is bugged. See video below for "fix". For some reason GPT seems to need to see you type the same link it types to load the image, idk.***

```markdown
When given a YouTube URL:
1. Extract the ID from the URL string
2. Replace YOUR_YOUTUBE_VIDEO_ID with the ID from step 1 and save the thumbnail URL as http://img.youtube.com/vi/YOUR_YOUTUBE_VIDEO_ID/0.jpg
3. (Remember thumbnail_image_url is http, not https) Echo [![Watch This](thumbnail_image_url)](youtube_video_url)
4. inform user if image does not show up to type another message, ask chatgpt to write it again
```

Here's the GPT where you can try it yourself (watch bug video first!)

[ChatGPT - Link to Clickable Imageopen a yt video with a clickable thumbnail![](https://cdn.oaistatic.com/_next/static/media/apple-touch-icon.59f2e898.png)ChatGPT![](https://cdn.oaistatic.com/_next/static/media/chatgpt-share-og.49cbbffe.png)](https://chat.openai.com/g/g-raAyNEjQQ-link-to-clickable-image?ref=bramadams.dev)

0:00 

/0:36 

1× 

the not loading the image bug

[ChatGPTA conversational AI system that listens, learns, and challenges![](https://cdn.oaistatic.com/_next/static/media/apple-touch-icon.59f2e898.png)![](https://cdn.oaistatic.com/_next/static/media/chatgpt-share-og.49cbbffe.png)](https://chat.openai.com/share/c021620d-edbb-47cb-835f-90e31e6e51fa?ref=bramadams.dev)

here's the transcript for the bug

---

***Update 2024-02-11:***

> If a URL you're trying to reference is partially model-generated, the link output by ChatGPT won't be clickable. ([Why aren't my GPT links clickable? | OpenAI Help Center](https://help.openai.com/en/articles/8838458-why-aren-t-my-gpt-links-clickable?ref=bramadams.dev))

**Fix: Use actions. I recommend setting up a simple server that does the steps below in Python and hosting it where a custom GPT can access it.**

```javascript
youtube_video_url = "https://www.youtube.com/watch?v=TTCN2hzhxcI"
video_id = youtube_video_url.split("v=")[-1]
thumbnail_image_url = f"http://img.youtube.com/vi/{video_id}/0.jpg"
markdown_link = f"[![Watch This]({thumbnail_image_url})]({youtube_video_url})"
markdown_link
```

[Add YouTube Videos with clickable thumbnails to your GPTsFor some reason the shared chats aren’t opening… Here’s some screenshots,![](https://global.discourse-cdn.com/openai1/optimized/1X/2a3172c7e1961225fa818c8fd4775a70c70ad057_2_180x180.png)OpenAI Developer Forumbram![](https://global.discourse-cdn.com/openai1/original/4X/9/2/2/922108037430f777c7a680e21e119a67b0a95a65.jpeg)](https://community.openai.com/t/add-youtube-videos-with-clickable-thumbnails-to-your-gpts/621341/8?u=bram&ref=bramadams.dev)

[Add YouTube Videos with clickable thumbnails to your GPTsThe solution is to have an action generate the complete link, then it’s no issue.![](https://global.discourse-cdn.com/openai1/optimized/1X/2a3172c7e1961225fa818c8fd4775a70c70ad057_2_180x180.png)OpenAI Developer Forumbram![](https://global.discourse-cdn.com/openai1/original/3X/b/3/b32f604c592f9a403d89909a2ac630d941304c08.png)](https://community.openai.com/t/add-youtube-videos-with-clickable-thumbnails-to-your-gpts/621341/10?u=bram&ref=bramadams.dev)