GitHub Readme YouTube Cards

Workflow for displaying recent YouTube videos as SVG cards in your readme.

Usage

1. Add the following snippet to your markdown file where you want the cards to appear.

<!-- BEGIN YOUTUBE-CARDS -->
<!-- END YOUTUBE-CARDS -->

2. In your repo, create a .github folder and inside create a folder named workflows if it does not exist. Then create a file in your .github/workflows/ folder and give it a name such as youtube-cards.yml with the following contents.

name: GitHub Readme YouTube Cards
on:
  schedule:
    # Runs every hour, on the hour
    - cron: "0 * * * *"
  workflow_dispatch:

jobs:
  build:
    runs-on: ubuntu-latest
    # Allow the job to commit to the repository
    permissions:
      contents: write
    # Run the GitHub Readme YouTube Cards action
    steps:
      - uses: DenverCoder1/github-readme-youtube-cards@main
        with:
          # Your YouTube channel ID
          channel_id: UCipSxT7a3rn81vGLw9lqRkg

Parameters

DenverCoder1/github-readme-youtube-cards@main

Click to show/close parameters

Name	Type	Required	Default	Description	More Description
channel_id	string	true		Your YouTube channel ID
playlist_id	string			Playlist ID
lang	string		en	Language
comment_tag_name	string		YOUTUBE-CARDS	The text in the comment tag for replacing content
youtube_api_key	string			YouTube API key
max_videos	number		6	The maximum number of videos to display
base_url	string		https://ytcards.demolab.com/	The base URL to use for the cards
card_width	number		250	The width of the SVG cards	Unit: pixels.
border_radius	number		5	The border radius of the SVG cards
background_color	string		#0d1117	The background color of the SVG cards
title_color	string		#ffffff	The color of the title text
stats_color	string		#dedede	The color of the stats text
theme_context_light	any		{}	JSON object with light mode colors
theme_context_dark	any		{}	JSON object with dark mode colors
max_title_lines	number		1	The maximum number of lines to use for the title
show_duration	boolean		false	Whether to show the duration of the videos	Requires the YouTube API key youtube_api_key.
author_name	string		GitHub Actions	The name of the commit author
author_email	string		41898282+github-actions[bot]@users.noreply.github.com	The email address of the commit author
commit_message	string		docs(readme): Update YouTube cards	The commit message to use for the commit
readme_path	string		README.md	The path to the Markdown or HTML file to update
output_only	boolean		false	Whether to skip writing to the readme file
output_type	string		markdown	The output syntax to use	Available options: markdown html.
markdown	string	true		The generated Markdown or HTML used for updating the README file
committed	string	true		Whether the action has created a commit	Possible: true false.
commit_long_sha	string	true		The full SHA of the commit that has just been created
commit_sha	string	true		The short 7-character SHA of the commit that has just been created
pushed	string	true		Whether the action has pushed to the remote	Possible: true false.

Examples

# Example usage: https://github.com/DenverCoder1/github-readme-youtube-cards/blob/main/.github/workflows/youtube-cards.yml
name: GitHub Readme YouTube Cards
on:
  schedule:
    # Runs every day at 12:00
    - cron: "0 12 * * *"
  push:
    branches:
      - main
  workflow_dispatch:

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: DenverCoder1/github-readme-youtube-cards@main
        id: youtube-cards
        with:
          channel_id: UCipSxT7a3rn81vGLw9lqRkg
          comment_tag_name: EXAMPLE-YOUTUBE-CARDS
          youtube_api_key: ${{ secrets.YOUTUBE_API_KEY }}
          show_duration: true
          theme_context_light: '{ "background_color": "#ffffff", "title_color": "#24292f", "stats_color": "#57606a" }'
          theme_context_dark: '{ "background_color": "#0d1117", "title_color": "#ffffff", "stats_color": "#dedede" }'
          max_title_lines: 2
          output_type: html
      - run: echo OUTPUT '${{ steps.youtube-cards.outputs.markdown }}'
        shell: bash