YouTube Live Likes, Views, Comments Counter

Lightweight youtube live counter usable in OBS Studio and Streamlabs as browser source

Viewers
0
Views
0
Likes
0
Comments
0
Configure OBS Studio Widget

This tool requires your own YouTube API key due to quota limits. Add it in the field above to generate your OBS browser URL. Need help? Get API key or style the widget.

YouTube Live Counter Features

πŸ“Š Track YouTube Live Likes & Views

Monitor live YouTube likes πŸ‘ & views πŸ‘€ in real-time for your streams. Stay updated with an accurate counter to engage your audience with the latest stats. Perfect for streamers and content creators!

πŸ”— Seamless OBS Integration

Easily show YouTube Live stats like likes & views πŸŽ₯ on your OBS stream without any hassle. Stream smoothly and engage your viewers with real-time metrics right on the screen.

⚑ Instant YouTube Stats Updates

Get instant updates πŸš€ for YouTube live likes πŸ‘ and views πŸ‘€ as they happen. Keep your viewers engaged with up-to-the-minute stats and enhance real-time interaction during your live streams!

πŸ”₯ How to Get a FREE YouTube API Key (Step-by-Step Guide)

Are you looking for a FREE YouTube API Key to integrate with OBS Studio or other streaming tools? In this quick and professional guide, I’ll walk you through the exact steps to generate your own API key in just minutes! βœ…

πŸ”— Use your API key at: yt.obscountdown.com to enhance your YouTube streaming experience!

πŸ“Œ Steps Covered:

  • βœ”οΈ Accessing Google Cloud Console
  • βœ”οΈ Enabling the YouTube Data API v3
  • βœ”οΈ Creating and managing API credentials
  • βœ”οΈ Securing your API key for safe use

πŸ”Ή How to Get a Free YouTube API Key

Follow these steps to generate your API key from Google:

  • πŸ”— Go to Google Cloud Console.
  • πŸ”‘ Sign in with your Google account.
  • πŸ“‚ Click on "Select a Project" (top menu) and create a new project.
  • πŸ“ Enter a project name and click "Create".
  • πŸ“š Navigate to "APIs & Services" > "Library".
  • πŸ” Search for YouTube Data API v3 and select it.
  • βœ… Click the "Enable" button.
  • βš™οΈ Go to "APIs & Services" > "Credentials" in the left menu.
  • βž• Click on "Create Credentials" and select "API key".
  • πŸ“‹ Google will generate an API key. Copy it and paste it into your application.
  • πŸ”’ (Optional) Click "Edit API key" to set usage restrictions for security.

🎯 Once done, your API key is ready for use in OBS Studio and other tools!

🎨 How to Customize Each Element in OBS Studio with CSS

You can fully customize the appearance of your YouTube counter widget in OBS Studio using Custom CSS. Each icon, label, and odometer value has a unique id and class to give you complete styling freedom.

πŸ“Œ Available Selectors

  • #icon-viewers - the icon before the β€œViewers” label
  • #label-viewers - the text label β€œViewers”
  • #value-viewers - the odometer number for viewers
  • #icon-views, #label-views, #value-views - for total views
  • #icon-likes, #label-likes, #value-likes - for likes
  • #icon-comments, #label-comments, #value-comments - for comments

πŸ–ŒοΈ Example Custom CSS

/* Make the viewers icon red */
#icon-viewers i {
  color: red;
}

/* Change the font and size of the viewers label */
#label-viewers {
  font-family: 'Arial Black', sans-serif;
  font-size: 18px;
  color: #ffcc00;
}

/* Make the viewer count bold and larger */
#value-viewers {
  font-size: 36px;
  font-weight: bold;
  color: #00ffcc;
}

/* Hide comments section */
.stat-comments {
  display: none;
}

πŸ“₯ How to Apply in OBS

  1. Add the widget to OBS as a Browser Source.
  2. Right-click the source > Properties.
  3. Scroll down to Custom CSS.
  4. Paste your custom styles there and click β€œOK”.
πŸ’‘ Tip: Use the browser developer tools (F12) to inspect and test changes before pasting into OBS.

πŸ§ͺ Experiment with shadows, animations, fonts, and colors it's your stream, your style!

Join Our OBS Community

Loading...

Join Now